Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

[SOLVED] Separate Headers for Posts and Pages


  #1  
Old May 7, 2010, 09:00 AM
arothafel
 
19 posts · Mar 2010
I'm sure this is already solved somewhere, but I can't seem to find it. I already have a header for my main posts. But, for "Pages" I'd like to use a separate header image/configuration. Can someone lead me in the right direction? Thanks in advance, -- Art
  #2  
Old May 7, 2010, 09:15 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
http://forum.bytesforall.com/showthr...t=header+image
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old May 7, 2010, 03:15 PM
arothafel
 
19 posts · Mar 2010
Quote:
you can now use the postid-638 for this post in the css so the headerimage override would be
HTML Code:

body.postid-638 div#imagecontainer {
background-image: url(http://yourdomain.com/wordpress/wp-c...s/yourpage.jpg) !important;}

I am so sorry to be this dense.... but, I viewed the page and then (with FireFox) I viewed the "page source" and found <body ... statement..

So (and this is the dense part) where do I go to actually find that HTML code. I don't know where the CSS is. Is it through ATO or do I actually go into the server files. If it's the server files, what folder?

Thanks in advance.
FYI.. this is the site: http://blog.privatelabelfitness.com/ and I want to use a static image for this page (s) http://blog.privatelabelfitness.com/?page_id=629

Thanks in advance.- Art
  #4  
Old May 7, 2010, 04:19 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
use that CSS selector/rule as a guide to create your own and then you put them at ATO->Add Html/CSS Inserts->CSS Inserts
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by juggledad; May 8, 2010 at 03:55 PM.
  #5  
Old May 8, 2010, 03:11 PM
arothafel
 
19 posts · Mar 2010
O.K. I added the static header image to the server and then went to:

ATO->Add Html/CSS Inserts->SCC Inserts (Should that be CSS Inserts or am I missing something?) and added this html:


HTML Code:
body class="page page-id-629 div#imagecontainer {
background-image: url(http://blog.privatelabelfitness.com/wp-content/themes/atahualpa/images/WM_Banner_01.jpg) !important;}
I also tried this:

HTML Code:
body.pageid-629 div#imagecontainer {
background-image: url(http://blog.privatelabelfitness.com/wp-content/themes/atahualpa/images/WM_Banner_01.jpg) !important;}
But, neither work. What am I doing wrong?

Thanks in advance,
Art

Last edited by arothafel; May 8, 2010 at 03:50 PM. Reason: additional attempt to resolve
  #6  
Old May 8, 2010, 04:00 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
your so close, it's the little things that will get you, like the missing hyphen.
the class for a page is not 'pageid-629', it's ''page-id-629' so try
HTML Code:
body.page-id-629 div#imagecontainer {.......
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old May 8, 2010, 04:59 PM
arothafel
 
19 posts · Mar 2010
Interesting.... it worked.. BUT...

Take a look at the result..

http://blog.privatelabelfitness.com/?page_id=629

it put the text image (Weight-Management Marketing) between the original rotating header images...
Am I running into difficulty because of the rotating header configuration I use for the parent?
  #8  
Old May 9, 2010, 05:46 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Well you didn't mention that you had modified the rotating header code! The smooth transistion code is causing the problem, but there is a get around. At ATO->Style & edit HEADER AREA->Configure Header Area replace '%image' with '%image <div id="myimage"></div>' then cange the CSS Insert to the following
HTML Code:
body.page-id-629 div#myimage {
background-image:url('http://blog.privatelabelfitness.com/wp-content/themes/atahualpa/images/WM_Banner_01.jpg') !important;
position:relative;
margin:0;
padding:0;
height:350px;

}
body.page-id-629 div#imagecontainer {
display:none;
}
basically thid hides the rotation image area and displays the a new image ares.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #9  
Old May 9, 2010, 08:58 AM
arothafel
 
19 posts · Mar 2010
Yup.... That did it!
JD, you are amazing. I don't know how you know all this stuff, but you do... and I'm thankful for your expertise. Another $20 on the way. The best money I've ever spent!!

Art
  #10  
Old May 9, 2010, 11:04 AM
arothafel
 
19 posts · Mar 2010
Pages and Posts - Separate Headers

I will be using multiple pages (50-60) with the new code you provided (works fantastic), but is there a simpler way to add multiple pages or do I need to insert this entire html for each new page that contains the same separate header? In other words, is there a way to line list all the page ids?

HTML Code:
body.page-id-629 div#myimage {
background-image:url('http://blog.privatelabelfitness.com/wp-content/themes/atahualpa/images/WM_Banner_01.jpg') !important;
position:relative;
margin:0;
padding:0;
height:350px;

}
body.page-id-629 div#imagecontainer {
display:none;
}

Last edited by juggledad; May 9, 2010 at 12:28 PM.
  #11  
Old May 9, 2010, 12:31 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Lets say page 629, 630, 645 and 712 all use the same header, you could code
HTML Code:
body.page-id-629 div#myimage,
body.page-id-630 div#myimage,
body.page-id-645 div#myimage,
body.page-id-712 div#myimage {
background-image:url('http://blog.privatelabelfitness.com/wp-content/themes/atahualpa/images/WM_Banner_01.jpg') !important;
position:relative;
margin:0;
padding:0;
height:350px;

}
body.page-id-629 div#imagecontainer,
body.page-id-630 div#imagecontainer,
body.page-id-645 div#imagecontainer,
body.page-id-712 div#imagecontainer {
display:none;
}
you could put all the pages into the one {display:none;}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #12  
Old May 9, 2010, 02:03 PM
arothafel
 
19 posts · Mar 2010
Brilliant JD....! Thanks again. Hopefully, we can now close this thread.

Art

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Adding space in category meny bar + separate RSS for separate categories? jenny_li Page & Category Menu Bars 2 May 10, 2010 06:57 AM
Making separate pages to display posts by category; also, how to embed WP page Eric Bobrow Atahualpa 3 Wordpress theme 1 Dec 2, 2009 01:34 AM
Post headers on homepage - Link to pages instead? ray-zin Atahualpa 3 Wordpress theme 4 Mar 11, 2009 04:45 PM
Static Home page, separate tab for posts pbravin Page & Category Menu Bars 1 Feb 24, 2009 08:55 AM


All times are GMT -6. The time now is 11:19 AM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.