PHP in CSS met Wordpress

donderdag 21 april 2011 19:18

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Ik ben een website aan het maken die op Wordpress draait. Met Artisteer heb ik een template gemaakt en alles werkt naar behoren.

Nu wil ik echter dat elke pagina z'n eigen header image heeft. De plugin "Dynamic Headers" krijg ik niet aan de praat, omdat het niet duidelijk is waar de betreffende code ingevoerd moet worden. Ik krijg het niet aan de praat.

Dus dan maar zelf gaan coden. Niet zo lastig: gewoon paginatitel opvragen, daar een jpg aan koppelen en als die niet bestaat terugvallen op de default header.

Nu beginnen de problemen:

Als ik de code in de header zet, dan wordt deze niet uitgevoerd. Test: als ik gewoon handmatig css code invoer, wordt het ook niet uitgevoerd.

Dus dan maar de php code in het css bestand, wat mij betreft ook overzichtelijker. Dus heb ik "AddType application/x-httpd-php .css" toegevoegd aan .htaccess, zodat php code in css bestanden uitgevoerd kan worden. Als ik dit niet doe, wordt de stylesheet niet geladen en krijg ik de site in plain html.

Aan het begin van de css heb ik "header('Content-type: text/css');" gezet, zodat het toch duidelijk is dat er een stylesheet geladen wordt.

Als ik de content-type opgeef, wordt de stylesheet uitgevoerd zonder opmaak van letters, als ik de content-type niet opgeef, wordt de stylesheet goed uitgevoerd.

Maar in beide gevallen lijkt elke vorm van php code niet uitgevoerd te worden. Het wordt simpelweg overgeslagen. Uiteraard gebruik ik gewoon correcte php code, zoals:

PHP:

1
2
3

<?php
echo "background-image: url('images/header.jpg');";
?>

Als ik (in echte css) de bestandsnaam verander naar die van een andere header image, dan wordt deze gewoon feilloos (op elke pagina) weergegeven.

Ik word er niet goed van, wat doe ik fout???

Of is er een andere manier hoe ik voor elke pagina een andere header image kan laden?

donderdag 21 april 2011 19:20

Acties:

0 Henk 'm!

keejoz

Kies als header een header.php file die de afbeelding zelf terug feed.

[ Voor 8% gewijzigd door keejoz op 21-04-2011 19:21 ]

donderdag 21 april 2011 19:24

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Ik heb een header.php en wat bedoel je met "die de zelf terug feed"?

En in die header.php staat de volgende code:

HTML:

1	<link rel="stylesheet" href="<?php bloginfo('stylesheet_url') ?>" type="text/css" media="screen" />

Maar waar kan ik input van "bloginfo('stylesheet_url')" niet vinden. Anders probeer ik gewoon style.css te hernoemen naar style.php.

[ Voor 69% gewijzigd door Verwijderd op 21-04-2011 19:26 ]

donderdag 21 april 2011 19:36

Acties:

0 Henk 'm!

xehbit

☄

Je zou het kunnen proberen door het zo te doen:

deze onderstaande regel in je .htaccess plaatsen:

code:

1	RewriteRule ^template/style.css ./template/style.php

Dat probleem had ik eerder ook ooit volgens mij, Ik dacht dat het te maken had met de extensie (correct me if i am wrong

) MAar zo zou het moeten lukken. Succes!!

donderdag 21 april 2011 20:08

Acties:

0 Henk 'm!

keejoz

http://www.devscripts.net/browse/46.php

Maar dan minder random. Nu heb je toch genoeg tips gekregen he

[ Voor 45% gewijzigd door keejoz op 21-04-2011 20:09 ]

vrijdag 22 april 2011 02:28

Acties:

0 Henk 'm!

_Thanatos_

Ja, en kaal

Je wilt toch dat CSS files statisch zijn of wil je echt je site traag maken?

Statische files hebben veel betere caching. Op de client omdat je een far-future expiration date kunt gebruiken, en op de server, omdat het bestand in de filecache komt (in het fysieke geheugen dus) en daarna rechtstreeks naar een client gepompt wordt, ipv eerst allerlei dingen te parsen en dan es een keer te ouputten.

Verschillende header images is heel mooi, maar maak of gewoon een keuze, of zet alle mogelijke headers (of wat dan ook) alvast klaar en wissel van met een class op <html> of <body>.

[ Voor 18% gewijzigd door _Thanatos_ op 22-04-2011 02:30 ]

日本！🎌

vrijdag 22 april 2011 07:44

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

keejoz schreef op donderdag 21 april 2011 @ 20:08:
http://www.devscripts.net/browse/46.php

Maar dan minder random. Nu heb je toch genoeg tips gekregen he

Wat heeft dit er meer te maken? Ik schrijf dat ik de code heb geproduceerd, maar dat het wordt niet uitgevoerd. En op de door jouw aangedragen link kan ik helemaal niets vinden over hoe php code uit te voeren in een css bestand.

_Thanatos_ schreef op vrijdag 22 april 2011 @ 02:28:
Je wilt toch dat CSS files statisch zijn of wil je echt je site traag maken?

Statische files hebben veel betere caching. Op de client omdat je een far-future expiration date kunt gebruiken, en op de server, omdat het bestand in de filecache komt (in het fysieke geheugen dus) en daarna rechtstreeks naar een client gepompt wordt, ipv eerst allerlei dingen te parsen en dan es een keer te ouputten.

Hoewel de website op het moment maximaal 50 bezoekers per dag heeft en ik weinig problemen voorzie, is het inderdaad toch niet de meest charmante oplossing.

Verschillende header images is heel mooi, maar maak of gewoon een keuze, of zet alle mogelijke headers (of wat dan ook) alvast klaar en wissel van met een class op <html> of <body>.

Ik heb dus een keuze gemaakt. We leven niet in 1997 en elke pagina heeft een ander plaatje bovenaan. Dat is alles wat ik wil.

Maar je bedoelt eigenlijk dat ik dynamisch een class voor de header laat bepalen en dan voor elke bestaande class een stukje eigen css code maak? Dat is inderdaad ook een optie.

vrijdag 22 april 2011 07:49

Acties:

0 Henk 'm!

Rob

Je zou de div van de header kunnen vullen met behulp van javascript

In the beginning the Internet was a bunch of smart users with dumb terminals. Now...

vrijdag 22 april 2011 07:55

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Dat was inderdaad waar _Thanatos_ ook naar wees, maar nu ben ik het met PHP aan het doen. Ik ben niet zo thuis in javascript.

vrijdag 22 april 2011 08:09

Acties:

0 Henk 'm!

OkkE

CSS influencer :+

Je CSS file als PHP gaan parsen zou ik ook niet doen, al was het maar omdat het in dit geval best simpeler kan.

Ik zou kiezen tussen twee opties.

1. Weinig verschillende images
Print een speciale class op je <body> per pagina. Via je CSS kan je dan aan die class een header image hangen.

2. Veel verschillende images (bijv. 10+)
Print de CSS voor de image rechtstreeks in je <body>, dus zo:
<body style="background-image:url(<?=$headerImage; ?>);">

Rob schreef op vrijdag 22 april 2011 @ 07:49:
Je zou de div van de header kunnen vullen met behulp van javascript

Het kan met Javascript, maar aangezien het ook prima op is te lossen met CSS (wat daar voor bedoelt is), zou ik dat ook gebruiken.

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

vrijdag 22 april 2011 08:18

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Op het moment ben ik met het volgende bezig:

page.php

PHP:

<?php
$page_w = trim($_SERVER["REQUEST_URI"],"/");
echo '<div class="art-header-jpeg-' . $page_w . '"></div>';
?>

En dan natuurlijk in style.css bijvoorbeeld:

Cascading Stylesheet:

div.art-header-jpeg-contact
{
background-image: url('images/header-contact.jpg');
}

En dit werkt. Nu nog even alle code invoeren en een fallback inbouwen voor als de betreffende css style niet bestaat. Anders wordt er geen afbeelding weergegeven.

vrijdag 22 april 2011 08:39

Acties:

0 Henk 'm!

Bosmonster

*zucht*

Css

Cascading Stylesheet:

div.art-header {
   background-image: url('images/header-default.jpg');
}

div.art-header.contact { 
   background-image: url('images/header-contact.jpg'); 
}

Daar hoef je nu niet echt ingewikkeld voor te gaan doen

vrijdag 22 april 2011 08:43

Acties:

0 Henk 'm!

Deef_K

Waarom zo moeilijk doen? Maak gewoon verschillende templates, uit mijn hoofd moet je page.php kopiëren en dan beginnen met:

code:

<?php
/*
Template Name: ....
*/
?>

Iedere pagina een eigen header geven en voila.

vrijdag 22 april 2011 08:47

Acties:

0 Henk 'm!

Bosmonster

*zucht*

Css

Overigens: Als dit beheerbare afbeeldingen zijn per pagina wil je het niet via een externe CSS oplossen ivm caching. Je zou dan caching kunnen uitzetten, maar dat wil je natuurlijk ook niet voor dat soort afbeeldingen.

Handigste is het gewoon in een style-attribuut parsen.

vrijdag 22 april 2011 08:54

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Ik heb het nu gedaan zoals in mijn vorige post beschreven is. Ik heb alle verschillende style attributen in de stylesheet gezet en met behulp van php wordt de juiste style aangevraagd. Het werkt perfect, stom dat ik hier niet eerder op kwam.

Onderwerpen