Weil ich mich gerade selbst damit auseinandersetzen musste, gibt\u2019s hier nen kleinen Schnipsel wie man mittels PHP (und nat\u00fcrlich CSS) wechselnde Hintergrundgrafiken in eine Website einbaut. Den Disclaimer von wegen Grafikgr\u00f6\u00dfe, Ladezeiten etc. erspare ich mir hier aber.<\/p>\n
<\/p>\n
Der Trick besteht darin, im HTML kein Stylesheet zu verlinken, sondern eine PHP, die das Stylesheet beinhaltet. Die Verlinkung erfolgt wie gewohnt im Diese Wichtig ist die Zeile In der gleichen Datei lassen sich auch alle weiteren CSS-Anweisungen einbinden. Nat\u00fcrlich k\u00f6nnte man die Zufallsauswahl in eine eigene .php-Datei fassen und diese dann entsprechend aufrufen, was aber die Zahl der Verlinkungen erh\u00f6hen w\u00fcrde und \u00fcberhaupt: Warum denn kompliziert, wenn es auch einfach geht?<\/p>\n","protected":false},"excerpt":{"rendered":" Weil ich mich gerade selbst damit auseinandersetzen musste, gibt\u2019s hier nen kleinen Schnipsel wie man mittels PHP (und nat\u00fcrlich CSS) wechselnde Hintergrundgrafiken in eine Website einbaut. Den Disclaimer von wegen Grafikgr\u00f6\u00dfe, Ladezeiten etc. erspare ich mir hier aber.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10,11],"tags":[38,72,114],"class_list":["post-451","post","type-post","status-publish","format-standard","hentry","category-technik-it","category-web-webdesign","tag-css","tag-html","tag-php","post-preview"],"_links":{"self":[{"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/posts\/451","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/comments?post=451"}],"version-history":[{"count":0,"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/posts\/451\/revisions"}],"wp:attachment":[{"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/media?parent=451"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/categories?post=451"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/florianko.de\/blog\/wp-json\/wp\/v2\/tags?post=451"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}head<\/code>-Teil der Seite, nur dass die Datei eben nicht style.css<\/code>, sondern style.php<\/code> hei\u00dft:<\/p>\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"style.php\" media=\"screen, projection\" \/><\/pre>\n
style.php<\/code>-Datei kann dann etwa so aussehen:<\/p>\n<?php\n header('content-type:text\/css');\n\n $bild = mt_rand ( 1, 5 );\n $src = '\/Bilder\/Background'.$bild.'.jpg';\n?>\n\nbody{\n background-image: url(<? echo $src; ?>);\n background-repeat: no-repeat;\n}<\/pre>\nheader('content-type:text\/css');<\/code>, damit das CSS richtig ankommt. Danach wird eine Zufallszahl zwischen 1 und 5 erzeugt — entsprechend der Anzahl an Bildern, die man abwechseln m\u00f6chte. Bei $src<\/code> wird schlie\u00dflich der Pfad zu den Bildern hinterlegt, die nach dem Schema BackgroundX.jpg<\/code> gespeichert sind, wobei das X<\/code> die entsprechende Nummer widerspiegelt. Das funktioniert \u00fcbrigens nicht nur mit dem body<\/code>-Element, sondern auch mit div<\/code> etc.<\/p>\n