Layouts coden

Thema: Layouts coden Do März 05, 2009 8:08 am

Achtung, seit einer Umstellung ist diese Anleitung leider unbrauchbar. Eine aktuelle gibt es hier
Diese Anleitung funktioniert mit Firefox und dem Internet Explorer. Mit Chrome leider nicht. Andere Browser hab ich noch nicht getestet, eine Rückmeldung wäre nett.

Du brauchst ein Hintergrundbild, das im Internet hochgeladen wurde. Achte darauf, dass du genau die Adresse des Bildes hast und nicht nur die Adresse der Seite, die es anzeigt.
Bei Imageshack wäre das diese Adresse
Layouts coden Hochladenimageshack

Merke dir die Höhe und Breite des Bildes. Du findest die Werte, wenn du mit der rechten Maustaste auf das Bild klickst und dann auf Eigenschaften gehst. Die erste Zahl ist die Breite, die zweite die Höhe.

Rufe dein Profil auf und klicke auf Modifizieren. Klicke auf HTML-Modus und kopiere dir dann diesen Code in das Textfeld

Code:: <div style="background: url(#URL#) no-repeat; width: #Breite#px; height: #Höhe#px; position: relative;">

Ersetze #URL# durch die Adresse deines Hintergrundbildes und #Höhe# und #Breite# durch die entsprechenden Werte. Achte darauf, dass du auch die # ersetzt, nicht nur das Wort.

Kopiere dann diesen Code so oft unter den vorherigen wie du Textfelder haben willst.

Code:: <div style="width: 100px; height: 100px; position: absolute; top: 25px; left: 25px; overflow: auto;">a</div>

Und zum Schluss setze noch dies darunter.

Code:: </div>

Wechsle wieder in den Normalmodus und klicke auf das a. An der Stelle wird ein Kasten markiert.
Layouts coden Scrollbox

Im Firefox kannst du, wenn du auf das Feld links oben über dem Kasten klickst, den Kasten verschieben.
Mit Hilfe der weißen Quadrate kannst du es auf die richtige Größe ziehen.
Im Internet Explorer hast du nur die weißen Quadrate, aber damit kannst du dir das Feld auch zurechtschieben. Zieh erst die untere rechte Ecke an die Stelle, wo sie sitzen soll und danach die linke obere Ecke.

Fülle den Kasten mit Text. Im Internet Explorer musst du den Kasten dafür erst doppelt anklicken.

Verfahre mit den restlichen Textfenstern genauso.

Speichere.

Fertig smile

Thema: Re: Layouts coden Fr März 13, 2009 6:09 am

Gar keine Kommentare? Ist irgendwas unklar?

Thema: Re: Layouts coden So März 15, 2009 6:36 am

Super erklärt Cair! smile

Ich hatte es immer mit NVU gemacht, total umständlich! <.<

Thema: Re: Layouts coden Mi März 25, 2009 6:16 am

Heeehee. Jetzt hab ich das auch mal geschafft : )
Dankeschön Cairlinn

Thema: Re: Layouts coden Fr März 27, 2009 10:53 pm

Tja, jetzt kann ich auch endlich Lays coden... da NVU bei mir ja nicht funzt. :P

Thema: Re: Layouts coden Sa März 28, 2009 8:56 am

Super Tut, mit NVU krieg ichs irgendwie nicht hin!

Gast

Hey! hat super funktioniert .. Danke!!
glg
Lele

Thema: Re: Layouts coden So Apr 05, 2009 6:45 am

Vielen Dank Cairlinn!
Jetzt kann ich endlich selber coden. Und es macht irgendwie voll Spaß.
Auch wenns nicht klappt. Dann macht das Fehlersuchen Spaß. zwinker

*happy*

Thema: Re: Layouts coden So Apr 05, 2009 6:50 am

Voll cool!
Danke für die tolle Anleitung,
hab mir rasch was gebastelt für mein RZ. LOL

Ist nicht gerade schön,
aber fürs Erste reichts lach

Lg blugirl007

Gast

Ich habs gemacht ... aber bei mir kommt das Layout nicht heul

ich kapier das iwie immer noch nicht mit dem #URL# ersetzen .... kannst dus mir nochmal erklären ??

Thema: Re: Layouts coden So Apr 12, 2009 3:54 am

Du musst nur da, wo #URL# steht, die Adresse eintragen, die dein Bild hat. Also das, was mit http:// anfängt.

Gast

Erstmal sehr gutes Tut ^-^
weiter so!
doch ich habe ein kleines Problem.
So sieht das Lay aus:
in der Vorschau allerdings so:

Mein code ist folgendermaßen:

Code:: <div style="background: transparent url(http://i131.photobucket.com/albums/p319/magicgirly/graphics/Layouts/sternentaenzer-2.png) no-repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 550px; height: 988px;"></div>

<div style="overflow: auto; width: 188px; height: 228px; position: absolute; top: 191px; left: 61px;"><div style="text-align: center;"><span style="color: rgb(86, 129, 172);">in meinem kleinen Reitzentrum *~Sternentänzer~*. Ich habe es gerade neu geöffnet und werde mich die erste Zeit nur mit Landwirtschaft befassen.</span><br style="color: rgb(86, 129, 172);"><span style="color: rgb(86, 129, 172);">Über Tipps freue ich mich immer, da ich noch ziemlich neu in diesem Gebiet bin.</span><br style="color: rgb(86, 129, 172);"><span style="color: rgb(86, 129, 172);">lg Ilu  </span><br></div><br></div>

<div style="overflow: auto; width: 495px; height: 160px; position: absolute; top: 788px; left: 79px;"><ul><li style="color: rgb(86, 129, 172);">großen fruchtbaren Wiesen als Weide</li><li style="color: rgb(86, 129, 172);">vorrätigem Mash</li><li style="color: rgb(86, 129, 172);">ein großer Vorrat an Karotten</li><li style="color: rgb(86, 129, 172);">genügend Angestellte in allen Bereichen</li></ul></div>

<div style="overflow: auto; width: 501px; height: 164px; position: absolute; top: 531px; left: 68px;"><ul><li style="color: rgb(86, 129, 172);">2 kleine aber saubere Boxen mit Stroh</li><li style="color: rgb(86, 129, 172);">ein Gewächshaus mit ganzjährigem Anbau von Karotten und Mashzutaten.</li><li style="color: rgb(86, 129, 172);">eine kleine aber fruchtbare Wiese als Weideland</li></ul></div>

schonmal dankeschön ^-^
wäre sehr nett wenn mir jemand helfen könnte

Gast

huch, tut mir Leid traurig

Warum sind die so verschoben?
nochmal dnake zwinker

Thema: Re: Layouts coden Mi Apr 15, 2009 8:23 am

Das erste </div> musst du rausnehmen und ganz nach hinten setzen

Gast

funktioniert leider noch immer nicht :/
aber danke für die schnelle antwort

ich versuche jetzt nochmal die links zu posten
so sieht es aus:

Code:: http://www.howrse.de/centre/fiche?id=201978

so sieht es in der Vorschau aus

Code:: http://i131.photobucket.com/albums/p319/magicgirly/Other/reitzentrumfehler.png

Thema: Re: Layouts coden Mi Apr 15, 2009 8:53 am

Sehr seltsam o.O Ein paar Pixel unterscheidet sich das bei mir auch immer, aber so extrem ist mir das noch nicht untergekommen.
Ich hab dir mal die richtigen Zahlen eingesetzt

Code:: <div style="background: transparent url(http://i131.photobucket.com/albums/p319/magicgirly/graphics/Layouts/sternentaenzer-2.png) no-repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 550px; height: 988px;">

<div style="overflow: auto; width: 188px; height: 228px; position: absolute; left: 61px; top: 155px;"><div style="text-align: center;"><span style="color: rgb(86, 129, 172);">in meinem kleinen Reitzentrum *~Sternentänzer~*. Ich habe es gerade neu geöffnet und werde mich die erste Zeit nur mit Landwirtschaft befassen.</span><br style="color: rgb(86, 129, 172);"/><span style="color: rgb(86, 129, 172);">Über Tipps freue ich mich immer, da ich noch ziemlich neu in diesem Gebiet bin.</span><br style="color: rgb(86, 129, 172);"/><span style="color: rgb(86, 129, 172);">lg Ilu </span><br/></div><br/></div>

<div style="overflow: auto; width: 495px; height: 160px; position: absolute; left: 61px; top: 755px;"><ul><li style="color: rgb(86, 129, 172);">großen fruchtbaren Wiesen als Weide</li><li style="color: rgb(86, 129, 172);">vorrätigem Mash</li><li style="color: rgb(86, 129, 172);">ein großer Vorrat an Karotten</li><li style="color: rgb(86, 129, 172);">genügend Angestellte in allen Bereichen</li></ul></div>

<div style="overflow: auto; width: 501px; height: 164px; position: absolute; top: 494px; left: 60px;"><ul><li style="color: rgb(86, 129, 172);">2 kleine aber saubere Boxen mit Stroh</li><li style="color: rgb(86, 129, 172);">ein Gewächshaus mit ganzjährigem Anbau von Karotten und Mashzutaten.</li><li style="color: rgb(86, 129, 172);">eine kleine aber fruchtbare Wiese als Weideland</li></ul></div></div>

Gast

Dankeschön ^-^
ich kenn mich zwar auch etwas mit html aus (von anderen seiten) aber auch ich finde keinen Fehler. Ich habe ja deinen Code kopiert.
Nunja ich hatte es auch mal richtig, allerdings war dann die Vorschau total verrutscht.
*deinen Code ausprobier*

Gast

bei mir klappt das irgendwie nicht schnüff

gruss CarmenR

Gast

Was genau klappt nicht?

Gast

Ich mache das so wie es da steht, aber wenn ich dann wieder in den normal modus gehe, dann is da nix, da steht dann nur ein kleingeschriebenes a, aber kein bild is da

Gast

Hast du dann auf das "a" geklickt? Welches Bild meinst du? Das Layout?

Thema: Re: Layouts coden Di Apr 21, 2009 6:00 am

mach mal bitte nen screen und/oder stell den html-code rein (wäre mir lieber^ yep

Thema: Re: Layouts coden Di Apr 21, 2009 6:10 am

So, habe mich mal hier erst angemeldet.

Also, ich möchte ein Hintergrundbild in meinen Reitzentrum Profil machen.

Habe also das Bild hochgeladen, und genau so gemacht, wie es hier steht.

Dann is da nur noch das hier zu sehn (nachdem ich wieder auf normal modus dann gegangen bin, ein a stand dann da zwar aber das konnte man nicht anklicken und auch war da kein bild zu sehn)

<DIV style="background: url(http://www.piccube.de/bilder_speicher/thumbs/PICCUBE_d7e5ac9f0b.jpg
) no-repeat; width: #250#px; height: #175#px;">

2</DIV>

so habe ich das aber nicht eingegeben

sondern ich gab folgendes ein

<div style="background: url(http://www.piccube.de/bilder_speicher/thumbs/PICCUBE_d7e5ac9f0b.jpg
) no-repeat; width: #250#px; height: #175#px;">

<div style="width: 100px; height: 100px; position: absolute; top: 25px; left: 25px; overflow: auto">a</div>

<div style="width: 100px; height: 100px; position: absolute; top: 25px; left: 25px; overflow: auto">a</div>

<div style="width: 100px; height: 100px; position: absolute; top: 25px; left: 25px; overflow: auto">a</div>

dann /div>

Thema: Re: Layouts coden Di Apr 21, 2009 6:19 am

ok, ich schau nacher wenn ich an meinem laptop sitze zwinker

Thema: Re: Layouts coden Di Apr 21, 2009 7:55 am

hast du den hintergrund vielleicht auch etwas größer?

» Layouts Coden
» Layouts coden
» Layouts -coden!!
» Layouts coden???
» [TUT]: Layouts coden mit NVU