hi,
hab folgendes anliegen und zwar kann ich derzeit nur bilder und text untereinander anordnen... gibt es aber eine möglichkeit im WYSIWYG-Editor quasi Text und Bild nebeneinander oder fließend miteinander zu positionieren, durch hacks oder anderes..
für hilfe danke im vorraus...
mfg neogine
Text um das bild fließen lassen...
-
-
- Gerade eben
- Anzeige
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
- ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
- ✔️ Deutsche Server & DSGVO-konform
- ✔️ Persönlicher Support (kein 0815-Ticket-System)
-
Mittels CSS z.B.
Code.enrty img { float: left/right/im Weltraum; padding: ein bisschen hiervon; margin: vielleicht auch noch ein bisschen davon; border: 1px bis unendlich groß durchgehend in pink; }So würde jedes Bild in deinen Beiträgen den entsprechenden Werte nach durch die Bloggeschichte "fließen".
-
wäre alles kein problem, wenn ich nicht nur so ein code-vollnoob wäre...
das ist der blog: http://www.shit-avenue.de -
Zitat von peti
Mittels CSS z.B.
Code.enrty img { float: left/right/im Weltraum; padding: ein bisschen hiervon; margin: vielleicht auch noch ein bisschen davon; border: 1px bis unendlich groß durchgehend in pink; }So würde jedes Bild in deinen Beiträgen den entsprechenden Werte nach durch die Bloggeschichte "fließen".
hab des eingebaut und es funzt nicht^^ toll.. -
Vorab, willst du das bei allen Bilder der Text umher fließt oder nur bei Bestimmten, Auserwählten?
-
-
Na jut. Wenn du einen Beitrag schreibst und ein Bild mit hineinsetzt:
<img src="quelle:bild" alt="geiles bild" [COLOR=DarkRed]class="floated-img"[/COLOR] />
definierst du für das Bild die Klasse "floated-img".
[COLOR=DarkRed]class="floated-img"[/COLOR]
Dann fügst du Folgendes deiner Stylesheet hinzu:
Code.floated-img { border: 5px solid white; /* Bastelt einen 5px breiten, weißen Rand ums Bild */ float: right; /* Lässt das Bild rechts vom Text durch die Gegend schweben */ margin: 5px 10px; /* Abstand des Bildes zum Text - 5px jeweils oben und unten und 10px links und rechts */ }Du kannst beliebig den Namen der Klasse ändern, wenn du willst. Hauptsache es stimmt in der Stylesheet sowie in der Klassenangabe des Bildes überein.
-
Zitat von petiAlles anzeigen
Na jut. Wenn du einen Beitrag schreibst und ein Bild mit hineinsetzt:
<img src="quelle:bild" alt="geiles bild" [COLOR=darkred]class="floated-img"[/COLOR] />
definierst du für das Bild die Klasse "floated-img".
[COLOR=darkred]class="floated-img"[/COLOR]
Dann fügst du Folgendes deiner Stylesheet hinzu:
Code.floated-img { border: 5px solid white; /* Bastelt einen 5px breiten, weißen Rand ums Bild */ float: right; /* Lässt das Bild rechts vom Text durch die Gegend schweben */ margin: 5px 10px; /* Abstand des Bildes zum Text - 5px jeweils oben und unten und 10px links und rechts */ }
Du kannst beliebig den Namen der Klasse ändern, wenn du willst. Hauptsache es stimmt in der Stylesheet sowie in der Klassenangabe des Bildes überein.
es geht!! danke!!
aber mir schwebt noch vor das einfacher zu gestalten und zwar, weil ich auch leute habe im blog die vom coden keine ahnung haben(wie ich^^):
quasi codewirrwarr zu kurzformel:
<img-flies> ------ >> <img src="
<img-fließ-end> ----- >> " alt=“bildtitel“ class="floated-img-right">
so das man wenn man ein bild zum fließen bringen will eben nur...
<img-fließ>url-zum-bild<img-fließ-end> ... angeben muss.
Wie kann man/ich das umsetzten? -
das <img></img> tag ist ein html-tag, das natürlich auch so bleiben muss.
ABER, und hier möchte ich an die blog-wordpress pros meine frage richten:
man kann doch beim Beitrag schreiben ein Bild hochladen und an den Editor senden. So, dann kann man das Bild anklicken und auf editieren in der Toolleiste klicken. Wunderbar soweit :)
ginge es, in das Dropdown von "Ausrichtung" eine entsprechende float-auswahl einzufügen?
Wenn nicht, welche Möglichkeiten gibt es außerdem für Blogger (nicht für admins) die ned so ahnung haben, ihre bilder rund um den text zu positionieren?
Danke vielmals für Antworten und auch denen da oben für die Hilfe :)
-
Es gibt im WYSIWYG-Editor die Schaltflächen für die Ausrichtung. Die fügen eine Klasse (imageleft, imageright und centered IIRC) zum Bild hinzu, die man per CSS entsprechend formatieren kann.
Für den einfachen Editor hab ich mir entsprechende Quicktags (wp-includes/js/quicktags.js) erstellt.
-
alles klar, danke, also bau ich per css einfach die auswahlmöglichkeiten um, die eh schon angeboten werden... geht natürlich auch :)
-
doh, zu früh gefreut...
im WYSIWYG Editor vergibt er keine Klassen für die Positionierung sondern er vergibt dem img-tag das attribut "align", welches er dann je nach bedarf ändert. funktioniert natürlich genau gar nicht, und per css kann mans auch nicht anprechen.
jetzt hast du mich neugierig gemacht was quicktags sind, und inwiefern man das als admin einem laien zumuten kann, klingt ja eigentlich nicht schlecht...
eine andere frage/idee brennt mir auf der zunge (fingern?):
gibt es ein plugin zum stylen von einträgen? ist mir jetzt so eingefallen, wenns unglaublich dämlich anmutet, bitte einfach ignorieren :P -
irgendwie würde mich das auch interessierern aber leider ging es hier ja nicht weiter :)
*push* :) -
hallo nochmal... ich habe jetzt mak rumprobiert aber leider kein positives ergebnis bei mir :(
ich habe folgendes vor und zwar möchte ich in einen artikel einfach eiin bild über die picasa gallery einfügen und dann soll da einfach der text rum gehen.
ich habe in der style.css folgedes hinzugefügt:.img-float-left {
float:left;
margin-right:5px;
margin-bottom:5px;
margin-top:5px
}und dann die bild quelle wie folgt bearbeitet (das fettgeschriebe):
<a title="Segeln 018.jpg" rel="lightbox[post71]" href="http://lh3.ggpht.com/marczunder/SLz….jpg?imgmax=800"><img src="http://lh3.ggpht.com/marczunder/SLz…egeln%20018.jpg" alt="Segeln 018.jpg class=img-float-left"/></a>
was mach ich falsch oder geht das mit dem picasadinger nicht ?
-
an dieser stelle muss ich nochmal nachhaken, ich habe auch das problem das ich text neben oder um eine oder mehr grafiken haben möchte ... im prinziep wie http://www.airbrush-design-schlesinger.de/ bei preise.
wie gesagt es muss nicht eine scrollfunktion eingebaut werden, wenn der text um die bilder fließt erfüllt das zweck vieleicht sogar noch besser.
ich sollte vieleicht noch anmerken das auch ich von code keine ahnung habe.
also im html-bereich der artikelerstellung ginge ja noch, aber wo finde ich die css und wo muss dann die änderungen genau vornehmen?
bin für jede hilfe dankbar.mfg choco
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!