[TuT] Klickbare Buttons/Bilder im Threaddesign

07/04/2015 14:40 Awkness#1
Hallo Leute, ich zeige euch heute wie ihr zu so einem Threaddesign klickbare Bilder einfügen könnt.

Beispiel ( mit der Maus über die Buttons gehen )

[Only registered and activated users can see links. Click Here To Register...]
[Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...]
[Only registered and activated users can see links. Click Here To Register...]
[Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...][Only registered and activated users can see links. Click Here To Register...]
[Only registered and activated users can see links. Click Here To Register...]

=========================================

Schritt 1. Zuerst erstellen wir uns ein Threaddesign. Worin man auf solche Buttons wie oben draufklicken kann. ( Für Verlinkungen )

Schritt 2. Nun slicen wir das Threaddesign mit dem Slice-Tool in einzelne kleine Bilder.

[Only registered and activated users can see links. Click Here To Register...]

worauf ihr achten müsst ist, die einzelnen Reihen gerade zu slicen wenn ihr unterschiedliche Slice-Bilder habt werden diese später verrutschen wenn ihr sie auf epvp hochlädt.

Schritt 3. Wenn ihr alles ordentlich in einzelne Bilder gesliced habt, geht ihr auf "Unter Web speichern" und wählt unten auf Speichern "Alle Slices aus"

[Only registered and activated users can see links. Click Here To Register...]

Schritt 4. Wenn sich all eure einzelne Bilder gespeichert haben, lädt ihr diese nach der Reihe auf epvpimg.com hoch.

Schritt 5. erstellt schonmal im voraus so viele
Code:
[imglink][/imglink]
Codes ihr benötigt.

Information: Ihr müsst darauf aufpassen alles was in einer Reihe ist ohne einen Abstand eingefügt werden muss. Sprich wenn ihr in eurer 2ten Reihe die Buttons habt die ihr verlinken wollt, müsst ihr es so einfügen :

Code:
[imglink]bild1[/imglink][imglink]bild2[/imglink][imglink]bild3[/imglink]
und nicht so :

Code:
[imglink]bild1[/imglink]
[imglink]bild2[/imglink]
[imglink]bild3[/imglink]
[imglink]bild4[/imglink]
[imglink]bild5[/imglink]
Schritt 6. Fügt all eure einzelnen Bilder mit der Information von oben ein und wählt die Bilderlinks aus die ihr verlinken wollt geht dann auf

[Only registered and activated users can see links. Click Here To Register...]

und

[Only registered and activated users can see links. Click Here To Register...]

Schritt 7. Zum Schluss schaut nochmal über euren Thread unter "Vorschau" um Sicher zu gehen, dass da nix verrutscht ist oder sonstiges. Falls doch dann müsst ihr es versuchen um zu ändern.

====================================

Das wars dann auch mit dem Tutorial.
Hoffe es hat euch gefallen.

Ich habe um ehrlich zu sein mehrmals gebraucht um dieses Tutorial zu erstellen weil ich öfters beim slicen die Fehler gemacht habe, sodass die Bilder verrutscht sind.

Ich würde mich freuen, wenn ihr mir ein Feedback unter diesem Thread geben könntet. Das hat mich hier auch wenn's etwas ist was viele Designer schon können viel Aufwand gekostet. ( Mehr als ich erwartet hätte ) .

LG, Awkness.
07/05/2015 16:12 LekoArts#2
Schönes Tutorial, wird den Anfänger sicherlich helfen :)
Noch 2 Anmerkungen bzw. Verbesserungsvorschläge:

Um BB-Code-Beispiele zu zeigen, kannst du den No-Parse BB-Code benutzen - dann musst du nicht den Code ändern und sagen, man soll das k noch anfügen ;)
Code:
[NOPARSE][/NOPARSE]
Auch kannst du evtl. den Text ein wenig umändern: Wenn die Bilder nebeneinander sind, auch die Bilder im Code nebeneinander. Wenn dann eine neue "Zeile" beginnt, auch einen neuen Absatz für den Code benutzen.
07/05/2015 16:47 Daikota#3
schönes tut, hatte mich schon gefragt wie man das macht
07/05/2015 17:27 Awkness#4
Quote:
Originally Posted by LeKoArts View Post
Schönes Tutorial, wird den Anfänger sicherlich helfen :)
Noch 2 Anmerkungen bzw. Verbesserungsvorschläge:

Um BB-Code-Beispiele zu zeigen, kannst du den No-Parse BB-Code benutzen - dann musst du nicht den Code ändern und sagen, man soll das k noch anfügen ;)
Code:
[NOPARSE][/NOPARSE]
Auch kannst du evtl. den Text ein wenig umändern: Wenn die Bilder nebeneinander sind, auch die Bilder im Code nebeneinander. Wenn dann eine neue "Zeile" beginnt, auch einen neuen Absatz für den Code benutzen.
Ich danke dir das mit dem BB-Code. iCh habs mit allem versucht, mit dem Spoiler, der Quote doch DAS "Hashtag-Zeichen" neben hab ich nicht gemerkt/gewusst.

Quote:
Originally Posted by Daikota View Post
schönes tut, hatte mich schon gefragt wie man das macht
Gerne.
07/10/2015 08:34 .Zitrus#5
Echt gutes Tutorial! Ich suchte gerade nach einem solchen, denn ich arbeite gerade an einer Servervorstellung! Vielen Dank!
07/10/2015 14:39 ZNXCREATES#6
Danke dir!
Hab genau danach gesucht die letzten Tage :)

Danke dir!
Hab genau danach gesucht die letzten Tage :)
07/15/2015 01:37 Monster™#7
Gutes Tutorial. Was für ein Tool verwendest du da zum Slicen?
07/15/2015 14:48 Awkness#8
Quote:
Originally Posted by Monster™ View Post
Gutes Tutorial. Was für ein Tool verwendest du da zum Slicen?
Das ist das ganze normale Slice-Tool von Photoshop selber.

[Only registered and activated users can see links. Click Here To Register...]
07/19/2015 22:24 Goku.#9
Fehlt noch der Bereich mit Anchorlink und dann kann man zu deinem Tutorial nichts mehr hinzufügen. (Y)
06/07/2016 15:07 • Craix •#10
Sehr gutes Tutorial, danke dir
10/03/2022 19:06 jesusmaria1122#11
bei mir geht es leider nicht, die slices werden untereinander geposted, weil automatisch ein abstand gemacht wird, ich kann die links gar nicht nebeneinander schreiben, so wie du im beispiel, weil der link woh scheinbar zu lang ist und automatisch ein absatz gemacht wird. kannst du mir da vielleicht weiterhelfen?