SOLVED: Achtergrond afbeelding per pagina
Moderator: velden
SOLVED: Achtergrond afbeelding per pagina
Hoe kun je per pagina een ander achtergrond afbeelding instellen?
Ik las ergens:
You can put a smarty tag in the "Page Specific Metadata" field of a page, like {cms_stylesheet name='myspecialstylesheet'}
Dus een stylesheet gemaakt - bg01 - met alleen onderstaande regels erin. En {cms_stylesheet name='bg01'} in "Page Specific Metadata"
Maar dat werkt niet.
Wat doe ik fout?
***********
Waar is trouwens die Miniatuur en Afbeelding voor op de pagina -> Opties.
***********
body {
background: url(........bg01.jpg) no-repeat fixed center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Ik las ergens:
You can put a smarty tag in the "Page Specific Metadata" field of a page, like {cms_stylesheet name='myspecialstylesheet'}
Dus een stylesheet gemaakt - bg01 - met alleen onderstaande regels erin. En {cms_stylesheet name='bg01'} in "Page Specific Metadata"
Maar dat werkt niet.
Wat doe ik fout?
***********
Waar is trouwens die Miniatuur en Afbeelding voor op de pagina -> Opties.
***********
body {
background: url(........bg01.jpg) no-repeat fixed center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Last edited by Adheera on Tue Nov 27, 2012 9:06 am, edited 3 times in total.
Re: Achtergrond afbeelding per pagina
Deze vraag is al meerdere malen aan de orde geweest.
Ik zou persoonlijk eens even kijken naar de {content_image} tag. Die is waarschijnlijk perfect geschikt voor jouw doel. Geen gedoe met losse stylesheets en makkelijk te selecteren afbeelding per pagina.
Ik zou persoonlijk eens even kijken naar de {content_image} tag. Die is waarschijnlijk perfect geschikt voor jouw doel. Geen gedoe met losse stylesheets en makkelijk te selecteren afbeelding per pagina.
Re: Achtergrond afbeelding per pagina
{content_image block='afbeelding1' class='body'}
Maar hij pakt de class niet.
De afbeelding komt links bovenaan, boven de hele content... die zkt naar beneden.
na </__body> komt
<img class="body" alt="http://www.praktijkbewust-zijn.nl/uploa ... e-roos.jpg" name="afbeelding1" src="http://www.praktijkbewust-zijn.nl/uploa ... e-roos.jpg">
De style pakt ie niet.
Sorry als dit eerder gepost is. Ik ben al uren aan het zoeken, kan het niet vinden.
Maar hij pakt de class niet.
De afbeelding komt links bovenaan, boven de hele content... die zkt naar beneden.
na </__body> komt
<img class="body" alt="http://www.praktijkbewust-zijn.nl/uploa ... e-roos.jpg" name="afbeelding1" src="http://www.praktijkbewust-zijn.nl/uploa ... e-roos.jpg">
De style pakt ie niet.
Sorry als dit eerder gepost is. Ik ben al uren aan het zoeken, kan het niet vinden.
Re: Achtergrond afbeelding per pagina
Voorbeeld:
Ergens in de head-sectie van het template (tussen <head> en </head> dus):
Denk dat het zo wel ongeveer klopt.
Ergens in de head-sectie van het template (tussen <head> en </head> dus):
Code: Select all
{content_image block='page_image' label='Pagina achtergrond' urlonly=1 dir='images/achtergrond' assign='page_image'}
<style type="text\css">
{literal}
body {
background-image : url('{/literal}{$page_image}{literal}');
}
{/literal}
</style>
Re: Achtergrond afbeelding per pagina
YES, het werkt..
ook zonder {literal} in de style.
Werkte eerst niet, alles geprobeerd.... stond de slash verkeerd in <style type="text/css">
Tja, dan kun je lang puzzelen
Dank je wel, echt heel fijn.
{content_image block='page_image' label='Pagina achtergrond' urlonly=1 assign='page_image'}
<style type="text/css">
body {
background-image : url('{$page_image}');
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
ook zonder {literal} in de style.
Werkte eerst niet, alles geprobeerd.... stond de slash verkeerd in <style type="text/css">
Tja, dan kun je lang puzzelen
Dank je wel, echt heel fijn.
{content_image block='page_image' label='Pagina achtergrond' urlonly=1 assign='page_image'}
<style type="text/css">
body {
background-image : url('{$page_image}');
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
Re: SOLVED: Achtergrond afbeelding per pagina
Echt heel blij mee.
TOP, dank je wel
TOP, dank je wel
Re: SOLVED: Achtergrond afbeelding per pagina
Je kunt nu natuurlijk nog checken op de waarde van $page_image. Als die leeg is kun je ervoor kiezen een default achtergrond te tonen.
als voorbeeld natuurlijk
Code: Select all
background-image : url('{if $page_image}{$page_image}{else}{uploads_url}/template/defaultbackground.jpg{/if}';
Re: Achtergrond afbeelding per pagina
Helaas... werkt alleen in FF en dan nog... hij rekt 'm heel raar uit.
Chrome, Opera en Safari snappen het niet.
Chrome, Opera en Safari snappen het niet.
Last edited by Adheera on Mon Nov 26, 2012 3:54 pm, edited 1 time in total.
Re: Achtergrond afbeelding per pagina
Dat kan natuurlijk niet. Dan staat er een fout in de stylesheet ofzo. De output van cmsms is niet afhankelijk van de browser.Adheera wrote:Helaas... werkt alleen in FF
Chrome, Opera en Safari snappen het niet.
Het je een voorbeeld-link?
Re: Achtergrond afbeelding per pagina
http://www.praktijkbewust-zijn.nl/index.php
http://www.praktijkbewust-zijn.nl/voorstellen.html
Ik zie de hele style niet staan in de source van Chrome, in FF wel.
Met en zonder {literal}
http://www.praktijkbewust-zijn.nl/voorstellen.html
Ik zie de hele style niet staan in de source van Chrome, in FF wel.
Met en zonder {literal}
Re: Achtergrond afbeelding per pagina
----------
Last edited by deactivated010521 on Tue Mar 12, 2013 3:03 pm, edited 1 time in total.
Re: Achtergrond afbeelding per pagina
Alleen niet in IE, de andere browsers snappen het wel.
http://www.praktijkbewust-zijn.nl/ die staat buiten de CMS.
En dit was de 1e opzet, met dezelfde style in de head. Doet het ook overal.
http://adheera.nl/roos/index8.html
http://www.praktijkbewust-zijn.nl/ die staat buiten de CMS.
En dit was de 1e opzet, met dezelfde style in de head. Doet het ook overal.
http://adheera.nl/roos/index8.html
Re: Achtergrond afbeelding per pagina
De code staat (natuurlijk) wél in de source van beide browsers (Chrome en FF). In beide gevallen is overigens de url leeg.
Ik zie ook dat de quotes ontbreken binnen de url() maar weet niet of dat per se verplicht is.
Denk eraan dat je je browser goed refresht als je iets wijzigt in het template.
Ik zie ook dat de quotes ontbreken binnen de url() maar weet niet of dat per se verplicht is.
Code: Select all
<style type="text/css">
body {
background-image : url();
-webkit-background-size: cover;
-ms-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center center;
}
</style>
Re: Achtergrond afbeelding per pagina
Ah die kl.... cache...
Met of zonder quotes werkt het niet, die is ook leeg url() in alle browsers behalve FF.
Quotes zijn volgens mij ook niet verplicht.
Met of zonder quotes werkt het niet, die is ook leeg url() in alle browsers behalve FF.
Quotes zijn volgens mij ook niet verplicht.
velden wrote:De code staat (natuurlijk) wél in de source van beide browsers (Chrome en FF). In beide gevallen is overigens de url leeg.
Ik zie ook dat de quotes ontbreken binnen de url() maar weet niet of dat per se verplicht is.
Denk eraan dat je je browser goed refresht als je iets wijzigt in het template.Code: Select all
<style type="text/css"> body { background-image : url(); -webkit-background-size: cover; -ms-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; background-repeat: no-repeat; background-position: center center; } </style>
Re: Achtergrond afbeelding per pagina
Even voor de duidelijkheid in géén enkele browser verschijnt er een achtergrond op die pagina!
Tenzij je expliciet browser-specifieke code inbouwt (en die kans lijkt me klein) zal de output ook in alle gevallen hetzelfde zijn.
Er gaat dus duidelijk iets niet goed m.b.t. je implementatie van de {content_image} tag.
Wellicht kun je het betreffende deel van je template hier posten?
Het is natuurlijk ook wel belangrijk dat er daadwerkelijk een afbeelding is geselecteerd.
Tenzij je expliciet browser-specifieke code inbouwt (en die kans lijkt me klein) zal de output ook in alle gevallen hetzelfde zijn.
Er gaat dus duidelijk iets niet goed m.b.t. je implementatie van de {content_image} tag.
Wellicht kun je het betreffende deel van je template hier posten?
Het is natuurlijk ook wel belangrijk dat er daadwerkelijk een afbeelding is geselecteerd.