Spickzettel Bilder einbinden: Unterschied zwischen den Versionen

Aus Worumwiki
Wechseln zu: Navigation, Suche
 
(15 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
 
<small>[[Worumwiki:Hilfe | Wiki-Hilfe]] -  
 
<small>[[Worumwiki:Hilfe | Wiki-Hilfe]] -  
−
[[Spickzettel Tabellen | Tabellen erstellen]] - [[Spickzettel Formatierungen |Formatierung, Schrift, Layout]] - [[Spickzettel Bilder einbinden | Bilder einbinden und verlinken]] - [[Spickzettel Bilder verlinken | Für Fortgeschrittene: Bilder verlinken]]</small>
+
[[Spickzettel Tabellen | Tabellen erstellen]] - [[Spickzettel Formatierungen |Formatierung, Schrift, Layout]] - [[Spickzettel Bilder einbinden | Bilder einbinden und verlinken]] - [[Spickzettel Bilder verlinken | Für Fortgeschrittene: Bilder verlinken]] - [[Spickzettel Links | Links ]]  </small>
−
 
 
−
 
 
  
  
Zeile 12: Zeile 10:
 
* auf der Bearbeitungsseite auf das Symbol '''Dateilink''' klicken und Bildadresse in die Klammern einfügen
 
* auf der Bearbeitungsseite auf das Symbol '''Dateilink''' klicken und Bildadresse in die Klammern einfügen
 
* auf {{Register|Vorschau zeigen}} gehen bzw. {{Register|Seite speichern}}
 
* auf {{Register|Vorschau zeigen}} gehen bzw. {{Register|Seite speichern}}
−
 
+
* Anpassen des Bildes kann man mit Ändern der Pixel-Größe bzw. mit den Befehlen (left, right, center)
 +
* Bild sollte nicht den Text erschlagen und der Text nicht das Bild
 +
* Damit der nachfolgende Text nicht neben das Bild rutscht, kann man den Code '''<nowiki><br style="clear:both;"/></nowiki>'''  zwischen Text und Bild setzen
 +
* Du kannst Dir natürlich auch die Bild-Codes hier kopieren und einfach mit Deiner Bildadresse überschreiben.
  
  
Zeile 25: Zeile 26:
  
 
[[Bild:Diego Ribas da Cunha.jpg |200 px |Diego]]
 
[[Bild:Diego Ribas da Cunha.jpg |200 px |Diego]]
 +
<br style="clear:both;"/>
  
  
Zeile 30: Zeile 32:
  
  
−
'''<big>Pic mit Rahmen - px-Größe - Platzierung auf der Seite - Beschriftung</big>'''
+
'''<big>Pic mit Rahmen - Skalieren - Positionieren - Beschriften</big>'''
  
 
<pre><nowiki>
 
<pre><nowiki>
Zeile 39: Zeile 41:
  
 
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px |Diego]]
 
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px |Diego]]
 +
<br />
 +
<br />
 +
<br />
 +
<br />
 +
<br style="clear:both;"/>
  
  
 +
== Bilder verlinken (einfach) ==
  
  
  
 +
'''<big>Pic mit Verlinkungen auf eine andere Seite (interne Verlinkung) </big>'''
  
 +
<pre><nowiki>
 +
[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |  [[Diego]]]]
 +
</nowiki></pre>
  
  
  
 +
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px |[[Diego]]]]
 +
<br />
 +
<br />
 +
<br />
 +
<br />
 +
<br />
 +
<br style="clear:both;"/>
  
  
  
 +
'''<big>... oder auf eine Website (externe Verlinkung)</big>'''
  
 +
<pre><nowiki>
 +
[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |[http://www2.diego10.com.br/en/  Diego]]]
 +
</nowiki></pre>
  
  
 +
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px | [http://www2.diego10.com.br/en/  Diego]]]
 +
<br style="clear:both;"/>
  
  
  
−
== Bilder verlinken (einfach) ==
 
  
  
 +
== Animation ==
 +
Mit einen Klick auf das Bild kannst Du Dir anzeigen lassen, wie Bilder eingebunden werden.
  
−
'''<big>Pic mit Verlinkungen auf eine andere Seite (interne Verlinkung) </big>'''
 
  
−
<pre><nowiki>
 
−
[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |  [[Diego]]]]
 
−
</nowiki></pre>
 
  
  
−
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px |[[Diego]]]]
 
  
  
 +
[[Bild:Tutorial de bilder einbinden.gif | thumb | 300 px | center | Animation Bilder einbinden]]
 +
<br style="clear:both;"/>
  
  
Zeile 76: Zeile 99:
  
  
 +
== Fotogalerie ==
 +
<br />
  
  
 +
'''<big>Einfache Galerie </big>'''
  
 +
Mit dem Gallery-Code: '''<tt><nowiki><gallery>Bild:jpg</gallery></nowiki></tt>''' eine einfache Fotogalerie erstellen.
  
  
 +
* Bilder entsprechend ins Wiki laden
 +
* '''ohne Klammern und Bildlink''' die Bildadresse unter Galerie einbinden und falls erwünscht eine Bildunterschrift dazu setzen
  
 +
<pre><nowiki>
 +
<gallery>
 +
Bild:GasthauszudenSeparees.jpg | Kellergang im Worum. Hier gehts zu den Separees
 +
Bild:K-Bassin.jpg | Gerüchten zufolge das Privatklo von Hornet
 +
Bild:Sylvie_was_ist_das_denn.jpg | Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft
 +
Bild:Biergarten.jpg | Biergarten- After-grill-Party
 +
</gallery>
 +
</nowiki></pre>
  
 +
 +
<gallery>
 +
Bild:GasthauszudenSeparees.jpg|Kellergang im Worum. Hier gehts zu den Separees
 +
Bild:K-Bassin.jpg|Gerüchten zufolge das Privatklo von Hornet
 +
Bild:Sylvie_was_ist_das_denn.jpg|Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft
 +
Bild:Biergarten.jpg|Biergarten- After-grill-Party
 +
</gallery>
  
  
Zeile 88: Zeile 132:
  
  
 +
'''<big>Galerie zentrieren incl. Galerienamen</big>'''
  
−
'''<big>... oder auf eine Website (externe Verlinkung)</big>'''
 
  
 
<pre><nowiki>
 
<pre><nowiki>
−
[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |[http://www2.diego10.com.br/en/   Diego]]]
+
<center>
 +
<gallery caption="Kappa / Citibank">
 +
    Bild:08t.gif|<center>Torwart 1</center>
 +
    Bild:08h.jpg|<center>Home</center>
 +
    Bild:07h.jpg|<center>Away</center>
 +
    Bild:08e.jpg|<center>Event</center> 
 +
</gallery>
 +
</center>
 
</nowiki></pre>
 
</nowiki></pre>
  
  
−
[[Bild:Diego Ribas da Cunha.jpg| thumb | rigth | 200px | [http://www2.diego10.com.br/en/   Diego]]]
+
 
 +
 
 +
<center>
 +
<gallery caption="Kappa / Citibank">
 +
    Bild:08t.gif|<center>Torwart 1</center>
 +
    Bild:08h.jpg|<center>Home</center>
 +
    Bild:07h.jpg|<center>Away</center>
 +
    Bild:08e.jpg|<center>Event</center> 
 +
</gallery>
 +
</center>
 +
 
 +
 
 +
 
  
  
  
 +
'''<big>Pics nebeneinander einbinden via Tabellenformat</big>'''
  
 +
Was hier aussieht wie ''ein'' Bild, besteht aus drei pics. Wichtig hierbei: Die pics sollten schon beim Hochladen  etwa das gleiche Format besitzen. Kleinere Abweichungen können mittels Pixel-Angabe angeglichen werden.
  
  
 +
<pre><nowiki>
 +
{| align="center"
 +
|| [[Bild:Werder1.gif | 140 px]]
 +
|| [[Bild:Los jetzt Bremen Wanderers1.gif | 150px]]
 +
|| [[Bild:Werder2.gif  | 140 px]]
  
 +
|-
 +
|| Bildtitel
 +
|| Bildtitel
 +
|| Bildtitel
  
 +
|-
 +
|}
 +
</nowiki></pre>
 +
<br style="clear:both;"/>
  
  
  
 +
{| align="center"
 +
|| [[Bild:Werder1.gif | 140 px]]
 +
|| [[Bild:Los jetzt Bremen Wanderers1.gif | 150px]]
 +
|| [[Bild:Werder2.gif  | 140 px]]
 +
|-
 +
|}
  
  
 +
oder so:
  
 +
{| align="center"
 +
|| [[Bild:IkengNeu.jpg| 130 px]]
 +
|| [[Bild:OehrlNeu.jpg  | 150 px]]
 +
|| [[Bild:SchmidtNeu.jpg | 138 px]]
 +
|| [[Bild:Wiedwald2Neu.jpg | 110 px]]
 +
|| [[Bild:PerthelNeu.jpg | 118 px]]
 +
|| [[Bild:FutacsNeu.jpg | 120 px]]
  
−
== Erstellen einer Fotogalerie ==
+
|-
 +
|| Ikeng
 +
|| Oehrl
 +
|| Schmidt
 +
|| Wiedwald
 +
|| Pertel
 +
|| Futacs
  
−
In einem vorgegeben Format kannst Du auch eine sogenannte Fotogalerie erstellen.
+
|-
 +
|}
  
  
−
* Bilder entsprechend ins Wiki laden
 
−
* '''ohne Klammern''' die Bilder unter Galery einbinden und falls erwünscht eine Bildunterschrift dazu setzen
 
  
−
<pre><nowiki>
 
−
<gallery>
 
−
Bild:GasthauszudenSeparees.jpg | Kellergang im Worum. Hier gehts zu den Separees
 
−
Bild:K-Bassin.jpg | Gerüchten zufolge das Privatklo von Hornet
 
−
Bild:Sylvie_was_ist_das_denn.jpg | Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft
 
−
Bild:Biergarten.jpg | Biergarten- After-grill-Party
 
−
</gallery>
 
−
</nowiki></pre>
 
  
  
Zeile 133: Zeile 222:
  
  
−
<gallery>
 
−
Bild:GasthauszudenSeparees.jpg|Kellergang im Worum. Hier gehts zu den Separees
 
−
Bild:K-Bassin.jpg|Gerüchten zufolge das Privatklo von Hornet
 
−
Bild:Sylvie_was_ist_das_denn.jpg|Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft
 
−
Bild:Biergarten.jpg|Biergarten- After-grill-Party
 
−
</gallery>
 
  
  

Aktuelle Version vom 31. August 2009, 19:25 Uhr

Wiki-Hilfe - Tabellen erstellen - Formatierung, Schrift, Layout - Bilder einbinden und verlinken - Für Fortgeschrittene: Bilder verlinken - Links


Bilder einbinden

  • auf der Wiki-Hauptseite in der linken Menüleiste auf den Link    Hochladen    klicken
  • Quelldatei (Bild) von Deinem Server auswählen und hochladen
  • Bildadresse (über dem Bild) kopieren
  • auf der Bearbeitungsseite auf das Symbol Dateilink klicken und Bildadresse in die Klammern einfügen
  • auf    Vorschau zeigen    gehen bzw.    Seite speichern   
  • Anpassen des Bildes kann man mit Ändern der Pixel-Größe bzw. mit den Befehlen (left, right, center)
  • Bild sollte nicht den Text erschlagen und der Text nicht das Bild
  • Damit der nachfolgende Text nicht neben das Bild rutscht, kann man den Code <br style="clear:both;"/> zwischen Text und Bild setzen
  • Du kannst Dir natürlich auch die Bild-Codes hier kopieren und einfach mit Deiner Bildadresse überschreiben.




[[Bild:Diego Ribas da Cunha.jpg]]


Diego



Pic mit Rahmen - Skalieren - Positionieren - Beschriften 

[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |Diego]]


Diego







Bilder verlinken (einfach)

Pic mit Verlinkungen auf eine andere Seite (interne Verlinkung) 

[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |  [[Diego]]]]


Diego








... oder auf eine Website (externe Verlinkung) 

[[Bild:Diego Ribas da Cunha.jpg| thumb | right | 200px |[http://www2.diego10.com.br/en/   Diego]]]


Diego




Animation

Mit einen Klick auf das Bild kannst Du Dir anzeigen lassen, wie Bilder eingebunden werden.




Animation Bilder einbinden




Fotogalerie



Einfache Galerie

Mit dem Gallery-Code: <gallery>Bild:jpg</gallery> eine einfache Fotogalerie erstellen.


  • Bilder entsprechend ins Wiki laden
  • ohne Klammern und Bildlink die Bildadresse unter Galerie einbinden und falls erwünscht eine Bildunterschrift dazu setzen
<gallery>
Bild:GasthauszudenSeparees.jpg | Kellergang im Worum. Hier gehts zu den Separees
Bild:K-Bassin.jpg | Gerüchten zufolge das Privatklo von Hornet
Bild:Sylvie_was_ist_das_denn.jpg | Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft
Bild:Biergarten.jpg | Biergarten- After-grill-Party
</gallery>


  • GasthauszudenSeparees.jpg

    Kellergang im Worum. Hier gehts zu den Separees

  • K-Bassin.jpg

    Gerüchten zufolge das Privatklo von Hornet

  • Sylvie was ist das denn.jpg

    Als Fachkraft ist Sylvie eine Pflaume, aber als Pflaume eine Fachkraft

  • Biergarten- After-grill-Party



Galerie zentrieren incl. Galerienamen 


<center>
<gallery caption="Kappa / Citibank">
     Bild:08t.gif|<center>Torwart 1</center>
     Bild:08h.jpg|<center>Home</center>
     Bild:07h.jpg|<center>Away</center>
     Bild:08e.jpg|<center>Event</center>  
</gallery>
</center>



  • Kappa / Citibank
  • Torwart 1
  • Home
  • Away
  • Event




Pics nebeneinander einbinden via Tabellenformat

Was hier aussieht wie ein Bild, besteht aus drei pics. Wichtig hierbei: Die pics sollten schon beim Hochladen etwa das gleiche Format besitzen. Kleinere Abweichungen können mittels Pixel-Angabe angeglichen werden. 


{| align="center"
|| [[Bild:Werder1.gif | 140 px]] 
|| [[Bild:Los jetzt Bremen Wanderers1.gif | 150px]] 
|| [[Bild:Werder2.gif  | 140 px]]

|-
|| Bildtitel
|| Bildtitel
|| Bildtitel

|-
|}



Werder1.gif Los jetzt Bremen Wanderers1.gif Werder2.gif


oder so:

IkengNeu.jpg OehrlNeu.jpg SchmidtNeu.jpg Wiedwald2Neu.jpg PerthelNeu.jpg FutacsNeu.jpg
Ikeng Oehrl Schmidt Wiedwald Pertel Futacs
Abgerufen von „https://wiki.worum.org/index.php?title=Spickzettel_Bilder_einbinden&oldid=11317“