Is it possible to add a different background for each section in the navigation? I am transferring a website that I did for someone ages ago into wordpress.
OLD SITE:http://www.dahliadrive.com/
NEW SITE: http://dev1.randomlink.com/?page_id=292
Different Backgrounds for each section
(10 posts) (3 voices)-
Lara
MemberI'm bumping this again. I want to have different backgrounds for each section like on this site: http://www.dahliadrive.com/
The Bigfeature site in development is here: http://dev1.randomlink.com/
Posted 1 year ago # -
@Lara: There's a way to do this until it's implemented into the theme. In your bigfeature folder, copy/paste into the header.php file. The code creates a custom body class, based on the page name. See it in action here.
</head>
<!-- begin dynamic body class -->
<?php if (is_home()) { ?>
<body class="">
<?php } else { ?>
<body class="<?php echo $post->post_name; ?>">
<?php } ?>
<!-- end dynamic body class -->
<?php bf_top(); ?>In your theme (or child theme CSS), add this code below to target different pages and/or the container:
/* Background image for an About page */
html body.about {
background: url (images/bg-somefilename.png);
}/* Background image for a Contact page */
html body.contact {
background: url (images/bg-someimage.png);
}/* Background image for a Contact page - targeting the container */
html body.contact #container {
background: url (images/bg-someimage.png");
padding-top: 0;
}- ChuckPosted 1 year ago # -
Lara
MemberHello.
Thanks so much for taking the time to help!!! I tried this as you suggested and the background still doesn't show up (See screengrabs of what I did below). Perhaps I am missing the obvious ;) Do you see what I am doing wrong? Thanks a million.
Background: http://dev1.randomlink.com/wp-content/themes/topart/images/BG_inspiration.jpg
Header.php: http://dev1.randomlink.com/wp-content/themes/topart/images/example1.jpg
Style.css (in the topart theme): http://dev1.randomlink.com/wp-content/themes/topart/images/example2.jpgPosted 1 year ago #
Reply
You must log in to post.