Wordpress Thumbnails umgestalten (Rahmen)
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
artikel
aussehen
bild
code
dank
demo
entsprechenden rahmen
filter
funktionieren
hilfe
http
image
info
integrieren
interne funktion
kleinen bildern
rahmen
sagen
url
vorgang
-
Hallo
irgendwie finde ich nichts über Google, deshalb müsst ihr mal wieder helfen
Also ich würde gerne die Thumbnails für mein verwendetes Theme ändern, also quasi die Darstellung. Und zwar hätte ich sie gerne wie in diesem Theme: http://michael.tyson.id.au/about/ bzw. eben so ähnlich. Selbst wenn ich das css coden noch hinbekäme ich habe keine Ahnung wie ich meinem WP-Theme dann sagen kann das es das nutzen soll.
Ich würde mich über Hilfe wie immer freuen
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Da ist weder CSS, noch sonst etwas im Spiel. Siehe z.B.
http://michael.tyson.id.au/wp-content/michaelangelo-images/26540da398517dd0d10cfe40d15a72f1.jpg
Die Bilder wurden so erstellt, wie du sie siehst. -
Jepp, ich weiß aber es sollte so aussehen ;), also in diesem Theme:http://wordpress.org/extend/themes/elegant-grunge
-
Das ist auch nur ein Bild. So auf die Schnelle würde ich ja sagen, dass es nicht geht, aber eigentlich könnte man es mit CSS doch hinbekommen... CSS3 besitzt das Attribut border-image, wir arbeiten aber immernoch allesamt mit CSS2, sodass man tricksen müsste.
Schau dir mal diese Seite an. Vielleicht hilfts dir ja ein wenig ;) -
Danke für die Seite, die hat mich auf ein gutes Suchwort gebracht und da habe ich auch folgende Seite gefunden, aber wie bekomme ich es denn dann meinem WP-Theme gesagt.
http://blog.plasticmind.com/css/css-image-framing/
Und bei verlinktem Theme wie auch immer der Autor das gelöst hat, als ich das Theme aktiviert hatte waren auch meine Thumbs mit diesem "Schatten-Rahmen" versehen ;)
TanteEdit: also ich habe den Links wieder gefunden der mir mal über den Weg lief, das ist glaube sehr gut vielleicht schaff ichs damit:
http://www.webdesignerwall.com/tutorials/css-decorative-gallery/
Beitrag zuletzt geändert: 30.5.2010 1:31:00 von rotuganda -
Im Prinzip hast du Recht. Ich habe in der Zwischenzeit auch mal geguckt, ob sich da nicht noch leichter eine Lösung finden lässt. Letztlich bin ich zu folgendem Ergebnis gekommen:
<style> .img { float:left; padding:10px; background:url(http://img227.imageshack.us/img227/8228/flowerborder.png); background-repeat:no-repeat; } </style> <div class="img"> <img src="http://img690.imageshack.us/img690/4714/bildcv.jpg"> </div>
Das geht sicherlich noch schicker und besser, aber für den Anfang reicht das =)
EDIT:
Das ist doch schon besser ;) http://fabo.lima-city.de/frame/
Beitrag zuletzt geändert: 30.5.2010 2:29:48 von fabo -
Mit CSS3 kann man bereits browserabhängig Bilder rotieren und Schlagschatten erzeugen - das ist ja fast schon der ganze Effekt.
Dein WP-Theme musst du natürlich entsprechend ändern. Allerdings musste jetzt mal genau erklären, was du wo ändern willst. Im Theme Ordner findest du die style.css und entsprechende Dateien. Willst du etwa etwas auf der Hauptseite ändern, nimmst du dir die index.php vor.
Nützlich in Bezug auf CSS3:
- Info
- Browser-Checklist -
Es geht auch ohne CSS3. Siehe hier. Durch eine interne Funktion werden sämtliche Bilder geparsed und entsprechend "eingerahmt", wobei man den Vorgang auch manuell durchführen könnte.
-
fabo schrieb:
Das ist dann letztlich die sichere Variante - aber auch aufwändiger. In WordPress ließe sich das wohl am einfachsten über einen Filter gestalten, den man vor "the_content" hängt. Könnte man entweder als Plugin oder als Funktion in der functions.php unterbringen.
Es geht auch ohne CSS3. Siehe hier. Durch eine interne Funktion werden sämtliche Bilder geparsed und entsprechend "eingerahmt", wobei man den Vorgang auch manuell durchführen könnte.
Wie so etwas aussehen könnte, sieht man hier.
Die Rotation ist damit allerdings nicht gelöst - aber ich würde auch nicht an Details hängen. Je nach Anspruch sieht das ja schon recht nett aus:) Für größere Bilder müsste man ebenso den Rahmen vergrößern - allerdings wird ja schon mit max-width eine Maximalgröße gesetzt. -
Aufwändig ist das keineswegs und das, was ich oben gepostet habe, arbeitet mit genau einem solchen Filter, welcher sich auch problemlos ins WP integrieren lassen würde.
Dieser Filter unterscheidet zwischen großen und kleinen Bildern und wählt passend dazu den entsprechenden Rahmen (großer Rahmen und kleiner Rahmen).
Mit Hilfe von Regexen wird versucht, sämtliche Bilder entsprechend einzurahmen und das scheint so weit auch zu funktionieren.
Ich aktualisiere mal eben fix meine Demo, damit man sieht, wovon ich spreche =)
Beitrag zuletzt geändert: 30.5.2010 13:41:50 von fabo -
Was warscheinlch die sinnvollste lösung wäre, ist ein einfaches JQuery-Plugin.
Damit kann mit nur relativ geringen GOOGLE Code:
http://code.google.com/p/jquery-rotate/
Denke das JQuery einfach weitaus verbreiteter ist als CSS 3 und dessen spezialfunktionen...
Gruß
Daniel -
Danke euch allen für eure großartigen Antworten - ich spüre das es sich damit realisieren lässt. Aber ich weiß immer noch nicht wie genau *mächtigrotwerde*. Fabo wie hast du denn deinen Filter ralisiert, ich habe den Link von wektags angeschaut, aber ich bin irgendwie einfach zuunbegabt...wie mache ich einen solchen Filter?
Um die Frage nochmal zuklären, ich möchte einfach alle Bilder (ob groß, ob klein ob Thumb) mit einem solchen Rahmen versehen, im Content nicht auf der Startseite oder auch auf der Startseite das wäre mir dann egal. Und ihr schreibt ja das es geht:fabo schrieb: Aufwändig ist das keineswegs und das, was ich oben gepostet habe, arbeitet mit genau einem solchen Filter, welcher sich auch problemlos ins WP integrieren lassen würde.
Dieser Filter unterscheidet zwischen großen und kleinen Bildern und wählt passend dazu den entsprechenden Rahmen (großer Rahmen und kleiner Rahmen).
Mit Hilfe von Regexen wird versucht, sämtliche Bilder entsprechend einzurahmen und das scheint so weit auch zu funktionieren.
Ich aktualisiere mal eben fix meine Demo, damit man sieht, wovon ich spreche =)
Aber wie implementiere ich es denn in das WP-Theme?
Tut mir wirklich leid das ich mich irgendwie zu blöd anstelle! -
rotuganda schrieb: […], im Content nicht auf der Startseite oder auch auf der Startseite das wäre mir dann egal. […]
Die Startseite hat also keinen Inhalt;)
Du kannst solche Filter an deine Artikel und Seiten hängen. Wenn du einen Artikel/Seite verfasst und veröffentlichst, wird ein solcher Filter davorgeschaltet. Dann müsste wie fabo das gemacht hat, der Text nach Bildern abgesucht werden und die entsprechenden span-Elemente mit CSS-Klasse reingepflanzt werden.
Das ist eine Programmiertechnische Aufgabe - die Umsetzung kann als WP-Plugin (themeunabhängig) oder eben in der functions.php des jeweiligen Themes erfolgen. -
Ich melde mich nachher privat bei dir, rotuganda. Müssen ja eh noch was besprechen ;)
Hast du zufällig MSN oder ICQ? Falls ja, lass mir mal bitte deine Nummer bzw. Adresse zukommen. -
@wektags gibt es da ein nennenswertes Plugin? Wie das Grundsätzlich funktioniert habe ich verstanden wird ja auch in einem der beiden Links sehr gut erklärt, also das mit der span class aber wie ichs in mein Theme stecke ist mir immer noch schleierhaft.
Püüüü genau meine Startseite hat keinen content :p derzeit nich mal ne Datenbank :(
@fabo ;) - DANKE! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
