Sidebar?

Karsten

Hallo zusammen,

irgend wie stehe ich auf dem Schlauch!?

In meinem Theme (E QUINOX) ist der Bereich geteilt, links Text und/oder Bilder und rechts ist auch noch ein Bereich wo etwas hinein kann, ich glaube Sidebar lt. Seiteninspektor.
Nur wie bekomme ich da was rein?

Wenn ich was eingebe steht das immer nur im linken Bereich.

Danke

Karsten

Oscar

Hier zu finden, im Seiteninspektor > Seitenleiste.

Der Eintrag muss erscheinen, wenn du die Seitenleiste aktiviert hast.

Karsten

Hallo,

ich möchte in die Sidebar 2 Bilder bzw. Ions in eine Zeile packen, bekomme aber den Abstand zueinander nicht hin.
Mit Leerzeichen funktioniert es nicht, Tab geht auch nicht.
Wie bekomme ich das hin?

Danke

bye,
Karsten

PS. Wofür ist eigentlich auf der linken Seite "Resources"
Was kommt da hinein?

"urmeli"

Nicht ganz sauber, aber machbar:

Nimm Bindestriche oder Punkte, die du dazwischen setzt und entsprechend dem Hintergrund einfärbst.

Oder etwas sauberer, indem du Leerzeichen mit der Zeichenfolge

 

erzwingst. Das geht auch mehrfach nacheinander. Ggfs. Musst du die Formatierung löschen.

marian

on 1329444392:

ich möchte in die Sidebar 2 Bilder bzw. Ions in eine Zeile packen, bekomme aber den Abstand zueinander nicht hin.
Mit Leerzeichen funktioniert es nicht, Tab geht auch nicht.
Wie bekomme ich das hin?
....
PS. Wofür ist eigentlich auf der linken Seite "Resources"
Was kommt da hinein?

Dann machen wir alles in einem Abwasch. Du musst aber den Code studieren

Da wo Resorces steht bringst du zwei Bilder. Wie die Bilder heissen weiss ich nicht ich mache nur einen Vorschlag: testbild01.jpg und testbild02.jpg
Für diese zwei Bilder kommt gleich einen Beispiel aber davor klickst du mit der rechten Maustaste da wo Resources steht und wählst "Ordner hinzufügen..." Den Namen (bitte ohne Leerzeichen und irgendwelche Umlaute oder Sonderzeichen wählst du als (sagen wir) bilder_neu
Und dadrin bringst du andere zwei Bilder die sollen heissen sagen wir testbild03.jpg und testbild04.jpg
Alle diese Bilder haben natürlich eine Breite und eine Höhe aber da ich nicht weiss wie groß deine Bilder sind, "nehme ich hier an" dass sie 200px Breite und 160px Höhe haben.

Jetzt erstellst du ERSTMAL (und das nur als Übung) eine HTML Seite und gibst das an:

[div class="karsten"]
[img class="imageStyle" alt="Testbild 01" src="%resource(testbild01.jpg)%" width="200" height="160" /]
[img class="imageStyle" alt="Testbild 02" src="%resource(testbild02.jpg)%" width="200" height="160" /]
[/div]

Die ersten zwei Bilder (wenn sie die Namen auch so haben wie ich in dem Code geschrieben habe) werden dargestellt. Gleich nebeneinander.
Jetzt geht es zu der "Entfernung" dieser Bilder.
Wenn du in dem Code am Anfang schaust dann siehst du ein div mir der Klasse karsten.
Der CSS Befehl heisst: den Bildern aus dem Berech mit der Klasse karsten sollen eine "Margin" DAVOR und DANACH von 10px bekommen.
Gehst in dem Feld benutzerdefinierten CSS aus dem Seiteninspektor in dem Reiter CSS und gibst diesen Code ein:

.karsten img {
    margin-left: 10px;
    margin-right: 10px;
}

Schaust du noch einmal und siehe da zwischen den Bildern eine "Zwischenteil. Natürlich von 20px (weil NACH dem ersten Bild und VOR dem zweiten Bild jeweils 10px sind (in dem Code irgendwelche margin löschen sind 10px weniger zw. den Bildern.

Jetzt die Bildern aus dem Resources Ordner bilder_neu
Gib mal diesen Code ein:

[div class="karsten"]
[img class="imageStyle" alt="Testbild 03" src="%resource(bilder_neu/testbild03.jpg)%" width="200" height="160" /]
[img class="imageStyle" alt="Testbild 04" src="%resource(bilder_neu/testbild04.jpg)%" width="200" height="160" /]
[/div]

Wieder meine Anmerkung wegen Namen der Bilder und Ordner. Stimmen sie (hast du Bilder neu benannt und da geschoben) werden die Bilder angezeigt. Wenn nicht dann musst du die Namen der Bilder in dem Code ändern.

Alles verstanden? Der Pfad zu den ersten zwei Bildern hieß %resource( und dann der Name des Bildes Nach dem Namen des Bildes kam noch )%
Bei den letzten zwei Bildern der Pfad hieß %resource(bilder_neu/ und dann der Name des Bildes. Am Ende wieder )%

Du sagst bestimmt... "Ja, ja, aber ich habe doch keine HTML Seite." Ja, ok, ok (auch die Seitenleiste kann als HTML bestimmt werden - siehe Zahnrad unten rechts - aber egal)... also text-formatiert oder gestylt...
Wenn du mein Code von hir kopierst und in einer text-formatierte Seite oder in einem text-formatierten Seitenteil einfügst dann:
1. den eingefügten Code auswählen
2. In Menü Format "Formatierung löschen" ZUERST anklicken
3. DANN auch in Menü Format "Formatierung ignorieren" anklicken.

Das ist alles (natürlich für eine Seitenleiste sind diese Bilder - 200px Breite - zu groß) aber das wirst du schon hinbekommen.

"urmeli"

Das, was Marian beschreibt, ist dann nicht nur ein bisschen sauberer, sondern ist richtig sauber...

...außerdem ist es ein gutes Beispiel dafür, wie Objekte in einer Webseite per HTML-Code und CSS-Deklaration eingebunden und positioniert werden. Diesem Muster folgt im Prinzip alles auf einer Webseite (solange es statisch bleibt, d.h. So lange es sich nicht verändert oder "bewegt").

Die DIV-Angaben definieren im Prinzip kleine Kästchen und deren Inhalt und die CSS-Deklaration schreibt vor, wo und wie diese Kästchen positioniert werden. Eigentlich sind die meisten Dinge, die du auf einer (statischen) Webseite siehst, lauter Kästchen, die zueinander angeordnet werden. Die dritte Code-Art ist dann JavaScript, das sorgt für "Bewegung". Und dann gibt es noch PHP für bestimmte Funktionen wie z.B. dem Absenden eines Kontaktformulars.

Resources ist ein Ordner innerhalb deines Projektes. Den Ordner würdest du natürlich mit einer exakten und ausformulierten Pfadangaben ("http://www.deineseite.de/resources/") ansprechen können, aber auch mit dem Code, den du bei Marian siehst: "...%resources (...)%". Das ist eigentlich eine Art abgekürzte Pfadangaben, aus der Rapidweaver beim Seitenexport eine "ordentliche" Verlinkung bastelt.

Ein Link mit %resources% hat einen praktischen Vorteil, weil bei einem noch nicht veröffentlichten Projekt die exakten Pfadangaben noch gar nicht festliegen. Die könnten je nachdem z.B. mit "http://www.deinezieladresse.de" beginnen, aber genauso gut auch mit "http://www.irgendeineadresse.bla" beginnen. Beim Seitenexport schaut sich Rapidweaver an, was für eine Adresse du in deiner Projektkonfigurstion eingegeben hast und "%resources%" ist eine Anweisung an Rapidweaver daraus einen Link zum Ordner Resources zu erstellen.

Jetzt klarer...?

Das, was ich in meinem vorherigen Post mit dem erzwungenen Leerzeichen beschrieben habe, ist allerdings auch ein praktikabler Workaround, wenn es mal schnell gehen soll, um z.B. in der Seitenleiste zwei gleichartige Objekte in einen bestimmten Abstand zueinander zu bringen.

Exakter ist es natürlich mit DIVs und CSS.

Karsten

Hallo,

1000 Dank für die hilfreichen Tips und die ausführliche Erklärung.
ABER das ist schon starker Tobak, da muss ich mich erstmal mit befassen und "reinfuchsen" wenn Ihr versteht
Ganz schön viel Aufwand für "nur" einen Abstand zwischen 2 Bildern. Aber sauber sollte es schon sein.

Ich werde mal probieren.

bye,
Karsten