DrupalCenter wird bunter
Eingetragen von eigentor (1424)am 31.12.2008 - 06:06 Uhr in
Das Salz in der Suppe für Posts auf einer Seite wie Drupalcenter sind (zumindest für mich) Bilder. Es ist grundsätzlich für jeden erlaubt, Bilder in einen Post einzubinden. (unser Filtered html erlaubt <img>). Nicht mehr ganz so angenehm ist das Hochladen der Bilder: wir haben zwar ein Image Assist an Bord, aber nicht für alle freigeschaltet (könnten wir drüber sprechen, es zumindest für User, die den ersten Dan nach authenticicated User erreicht haben, freizuschalten). Natürlich könnt Ihr Bilder bei euch irgendwo auf den Server hochladen und extern per <img src ="deinschönerserver.de/pfadzudeinemsuperbild"> enbinden, aber das ist ja aus verschiedenen Gründen nicht so schön.<p class="cleardiv"></p>
Wenn dann euer Server umzieht oder ihr aus Versehen das Bild darauf löscht oder verschiebt - schwupp ist DC wieder ein Stück weniger bunt und mancher Post liest sich seltsam weil das Bild fehlt. In diesem Falle gibt es immer noch die Möglichkeit, das Bild als Attachment an den Post anzuhängen (ist jetzt auch für Kommentare freigeschaltet). Kurz gucken, wie der Pfad ist, und schwupps kann man es einfügen.
Das Sahnehäubchen ist dann, das Bild schön zu floaten. Und hierfür machen wir uns eines der Little know secrets of Black history zunutze: Obwohl man in Filtered Html nur begrenzte Styling Tags eingeben kann, sind Klassen generell erlaubt. Daher habe ich ein paar Klassen definiert, die euch das Floaten leichter machen und noch ein bisschen Abstand machen zum Text. Ihr könnt die Klassen direkt dem Bild zuweisen oder einem drumgepackten span. Enfach mal ausprobieren:
.imagefloatleft
.imagefloatright
Tja, und dann - nun ist das Bild gefloatet, aber wenn der Post als Teaser angezeigt wird und nur wenig Text, guckt das Bild unten aus dem Post heraus oder verdrängt gar noch die nachfolgenden Beiträge. Oh je! Aber doch kein Problem, auch hierfür gibt es jetzt ein paar Klassen, aber bitte mit Vorsicht verwenden, sonst zerschiesst ihr (vorübergehend) die ganze Startseite, wenn ihr an der falschen Stelle cleart. Auch zu bedenken: immer an einer Stelle einbinden, bevor der Teaser abgeschnitten wird, sonst bringt es nicht viel. Am einfachsten so: <p class="clear-left"></p><Drupal Breaktag>(ich kann den breaktag hier nicht hinschreiben, wird nicht angezeigt) dann kann nichts schiefgehen. Einfach auch das mal probieren:
.cleardiv (hat ein clear:both drinne)
.clear-left
.clear-right
Als Element müss ihr ein <p> nehmen, denn div darf Filtered Html nicht, und span cleart nicht. Falls Ihr die Klassen nict angezeigt bekommt (sieht man auch daran, daß das Bild in diesem Post nicht gefloatet wird) dann einmal den Browsercache leeren.
Dann man tau: ran an die Palette und was schönes gemalt. Aber bitte keine nackten Männer, gell ;)
- Anmelden oder Registrieren um Kommentare zu schreiben
Auch wenn ich mich
am 31.12.2008 - 10:25 Uhr
Auch wenn ich mich natürlich frage was Herr Eigentor morgens um 6 Uhr zu tuen hat ;)
Die Css Eigenschaften sind nun auch in der gecachten CSS Datei
Könnte man nicht allgemein den![]()
Tag nehmen und dort z.b.
< img fl="left" src... / >und dann in einem Filter
img durch
< p class="clear-left"...usw ersetzenDas ist nun reine Spinnerei ;)
<bild1:left />Schaut im Anhanung nach Bildern, findet das erste und ersetzt den Code entsprechend
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Könntest Du Deine
am 31.12.2008 - 10:27 Uhr
Könntest Du Deine Stylesheet-Anweisungen zu den "Clear"-Klassen hier mal posten ?
Ich habe bei meiner Drupalseite nämlich auch das Problem der aus dem Teaser "heraushängenden" Bilder.
Würde mir sehr helfen.
Danke !
Steht doch alles hier.
am 31.12.2008 - 10:45 Uhr
Steht doch alles hier. Clear:both = nicht darf floaten; clear:left = nicht nach links floaten, aber rechts und clear:right genau andersrum. Aber nicht vergessen ein Block-Element muss diese Eigentschaft haben.
----------------------------------------
Alle Angaben ohne Gewähr!!:D
http://www.tobiasbaehr.de/
Gelöste Forenbeiträge mit [gelöst] im Titel ergänzen
Das Verhältnis anderen zu helfen muss höher sein, als von anderen Hilfe zu erfragen/erwarten.
Klassenbeschreibungen und so
am 31.12.2008 - 11:29 Uhr
Folgende Klassen werden verwendet:
.imagefloatleft {
float:left;
margin:0 15px 5px 0;
}
.imagefloatright {
float:right;
margin:0 0 5px 15px;
}
.cleardiv {
clear:both;
font-size:0;
height:0;
line-height:0;
padding:0.01px;
}
.clear-left {
clear:left;
font-size:0;
height:0;
line-height:0;
padding:0.01px;
}
.clear-right {
clear:right;
font-size:0;
height:0;
line-height:0;
padding:0.01px;
}
Und wenn ihr euch nicht so sicher seid, wo ihr legal schicke Fotos herbekommt (auch wenn die nicht komplett umsonst sind; dies kann man auch für andere Homepages gut gebrauchen, nicht nur fürs Drupalcenter, denke ich):
www.photocase.de
www.fotolia.de
www.istockphoto.com
http://www.sxc.hu/
Die kosten zwischen 1 und ein paar Euro pro Bild.
Komplett umsonst, wenn auch nicht ganz so schön:
http://en.wikipedia.org/wiki/Public_domain_image_resources
Mal davon ausgehend, daß Public Domain wirklich Public Domain ist.
Die hier http://www.public-domain-photos.com/people/10 sind wirklich nett.
Was man auch noch machen kann, ist mal auf flickr gezielt im Bereich creative Commons zu suchen. Denn da gibt es jede Menge Leute, die ihre Fotos bedingt freigeben - da muss man dann oft nur den Namen nennen, und sollte den Autor fragen, wie ers denn gerne hätte.
http://flickr.com/creativecommons/
In Google die Bildersuche anzuschmeissen und das was man findet, in der Website zu verwenden ist natürlich weniger legal.
Kölle alaaf!
und falls jemand icons
am 31.12.2008 - 11:57 Uhr
und falls jemand icons braucht kann ich nur
http://websvn.kde.org/trunk/KDE/kdeartwork/IconThemes/primary/scalable/
empfehlen, svg Icons mit SEHR schönem Aussehen unter der GPL und CC
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Währe es nicht einfacher,
am 01.01.2009 - 21:27 Uhr
Währe es nicht einfacher, das unter einem Teaser automatisch ein Div-Container mit clear:both; eingebaut wird? Dann ist das Problem mit dem Floaten erledigt. Man könte auch eine Klasse hinterlegen, welche automatisch Abstände bei Bildern innerhalb vom Content erzeugt. Dann kann man auf gewöhnliche Weise mit dem HTML Attribut align="left" arbeiten, wie die Editoren (FCKeditor oder TinyMCE)
Würde die ganze Sache wesendlich vereinfachen.
--------
Active-Media-Production
Individual Web Development and Design
--------
Active-Media-Production
Individual Web Development and Design
Noch etwas besser
am 01.01.2009 - 23:08 Uhr
Wenn man das Bild (bzw. den Quelltext des img-Tag, wir haben ja keine visuelle Darstellung der Bilder im Editor) markiert und den entsprechenden (und hoffentlich selbserklärenden) Button drückt, dann wird eine Span mit .imagefloatleft oder eben .imagefloatright drumgepackt - ratzfatz ist alles sauber gefloatet. Komfortabler ginge es nur noch mit einem richtigen Wysywyg-Editor, da denken wir mal drüber nach...
Die sind ja ziemliche Performancefresser, da das aber Javascript ist, dürfte es doch nur auf dem Rechner des Users Last verursachen, sehe ich das richtig?
Kölle alaaf!
allgemein finde ich wysiwyg
am 01.01.2009 - 23:15 Uhr
allgemein finde ich wysiwyg ja nicht so toll
Es braucht auch auf Serverseite mehr Arbeit... DEUTLICH mehr zum ausliefern ... ein rießen Modul Tiny oder FCK usw.
Sonst supper ARBEIT!
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Wegen des Traffics würde
am 02.01.2009 - 15:25 Uhr
Wegen des Traffics würde ich mir keine sorgen machen. Es müssen ja nicht alle User den Editor bekommen. Die jenigen welche keine Bilder einfügen dürfen können doch den BUEditor weiterhin bekommen.
Ich würde den FCK nehemen, in Verbindung mit IMCE läßt sich auch die Uploadmenge, und Verzeichniszugriffe optimal steuern. Außerdem erkennt der automatisch Word-text und kann den bereinigen.
--------
Active-Media-Production
Individual Web Development and Design
--------
Active-Media-Production
Individual Web Development and Design
naja um ehrlich zu sein, ich
am 02.01.2009 - 15:33 Uhr
naja um ehrlich zu sein, ich versehe denn Sinn HIER im Drupalcenter absolut nicht.
Denn 1. Image Attach tuts völlig
2. Uploadmenge sollte man mit dem normalen Uploadmodul wieder umgehen können
Was ist Word-text?
Zudem sollte jeder der Drupal kann zumindestens einigermaßen html beherschen
-> für mich ist der BUEEditor perfekt
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Richtig dereine. Wer die
am 02.01.2009 - 16:48 Uhr
Richtig dereine. Wer die paar HTML-Tags nicht kann bzw. nicht erlernen will. Kann gleich kehrt machen.
----------------------------------------
Alle Angaben ohne Gewähr!!:D
http://www.tobiasbaehr.de/
Gelöste Forenbeiträge mit [gelöst] im Titel ergänzen
Das Verhältnis anderen zu helfen muss höher sein, als von anderen Hilfe zu erfragen/erwarten.
Ja sogar ich kann das :)
am 02.01.2009 - 17:52 Uhr
Ja sogar ich kann das :) Zudem ist man bei wysiwyg Editoren nicht mehr klar über die Struktur man schaut nur auf das Aussehen
JA ich benutze Latex für Präsentationen ;)
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
ist es denn eigentlich
am 03.01.2009 - 19:08 Uhr
ist es denn eigentlich wirklich gewollt das jeder benutzer fullhtml benutzen darf?
kann man da nicht js reinschreiben?
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Nix Full
am 03.01.2009 - 22:28 Uhr
Full Html geht erst ab Book Editor
Kölle alaaf!
sicher? Filtered HTML Alle
am 03.01.2009 - 22:45 Uhr
sicher?
Filtered HTML Alle Rollen dürfen das Standardformat benutzenGUTEN Morgen erstmal ^^ meine Schuld!
--------------
Blog www.freeblogger.org: Deutscher IRC-Channel: irc.freenode.net #drupal.de ... Jabber-me: dwehner@im.calug.deXING
Warum wird eingentlich nicht
am 04.02.2009 - 00:49 Uhr
Warum wird eingentlich nicht das Modul IMCE für registrierte Anwender freigegeben. Dann kann man zu den erläuterungen im Forum Bilder mit Beispielen hochladen. Wenn man nur auf externe Bildquellen verlinken kann, besteht die Möglichkeit, das diese irgendwann nicht mehr verfügbar sind.
--------
Active-Media-Production
Individual Web Development and Design
--------
Active-Media-Production
Individual Web Development and Design
image float
am 18.07.2012 - 12:31 Uhr
Hallo Leute,
gibt es die Möglichkeit auch schon fertig in einem Modul ?
Ich könnte das gut gebrauchen.
danke.
Für solche Dinge solltest du
am 18.07.2012 - 12:53 Uhr
Für solche Dinge solltest du lieber im entsprechenden Unterforum ein neues Thema mit einer etwas ausführlicheren Beschreibung eröffnen.