Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme »

[SOLVED] Styling my custom page template


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Nov 6, 2012, 01:41 PM
gr870sfunk's Avatar
gr870sfunk
 
108 posts · Mar 2011
Montgomery, AL
WP: 3.4.2
ATA: 3.7.9

I have created a custom template by copying and renaming the index.php to sample.php.

I know that to change the footer and/or header I would do the same thing with their respective php files as well.

I did the following to change styling aspects of the main page:
HTML Code:
body.page-template-sample-php {
background-color:#171719;
background-image:none;

body.page-template-sample-php h1{
color:#8616ab;
}

body.page-template-sample-php p{
font-family:Verdana, Geneva, sans-serif;
font-size:20px;
color:red;
}
My questions are:
1. what selector(s) would I use to change the center column background?
2. how am I supposed to alter (let's say) header2.php so that it contains only an image (no menu or anything else)? I do not really know any php so altering the actual code in the file is something i'm not too keen on trying.

Any help is greatly appreciated. Thanks!
  #2  
Old Nov 7, 2012, 06:17 AM
juggledad's Avatar
juggledad
 
22,263 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Quote:
I know that to change the footer and/or header I would do the same thing with their respective php files as well.
If you make copies of them be prepared to do some extra editing. You might want to readup on the get_header function - do a google search 'wordpress get_header'
Quote:
1. what selector(s) would I use to change the center column background?
The best way to figure this out is to use the FireBug extension in FireFox to examine the areas on the page. This will show you what CSS is being applied to the HTML elements and what ID's and classes are associated with the HTML elements so you can construct the CSS selectors nad rules you will need.
Quote:
2. how am I supposed to alter (let's say) header2.php so that it contains only an image (no menu or anything else)? I do not really know any php so altering the actual code in the file is something i'm not too keen on trying.
if you don't mind the menu being in the source, you can hide it using CSS and not have to have another 'header.php', you can even have a seperate header image with the other pages using a rotating header by using
HTML Code:
body.page-template-xxxxxxxxx-php div#imagecontainer {background: url("http://yourdomain.com/wp-content/uploads/2012/07/cropped-dragonfly3.jpg") no-repeat scroll left top transparent !important;}
body.page-template-xxxxxxxxx-php div#imagecontainer img {display:none !important;}
t
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Nov 7, 2012, 10:18 AM
gr870sfunk's Avatar
gr870sfunk
 
108 posts · Mar 2011
Montgomery, AL
Thanks JD! I have gotten that issue taken care of thanks to your help and some putzing around with the CSS.

I have come across another issue though. Currently, the right sidebar has no background on my site, but this sub-site I am creating (using the new page template "beyond.php") needs to have a plain old white background and some sort of border.

I read over this thread, but I don't understand how the footer would effect the sidebar.

Long story short, I don't know how to style the sidebar of this new page template. Many thanks!

EDIT:
Nevermind. I figured it out.
HTML Code:
body.page-id-2111 #right{
 background-color: #FFF;
}

Last edited by gr870sfunk; Nov 7, 2012 at 10:29 AM.
  #4  
Old Nov 7, 2012, 10:30 AM
juggledad's Avatar
juggledad
 
22,263 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
what is the url of the page in question?
__________________
"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; Nov 8, 2012 at 09:48 AM.
  #5  
Old Nov 8, 2012, 09:08 AM
gr870sfunk's Avatar
gr870sfunk
 
108 posts · Mar 2011
Montgomery, AL
http://www.energyfairness.org/beyond-affordable pw: Emily2012

The problem I'm having now is how to change the width of the center column and sidebar in the new page template.

EDIT:
again, after some more research, I have solved the sidebar width problem using .colthree as my selector.

HTML Code:
body.page-template-beyond-php .colthree{
background-color: #FFF;
width:450px !important;
}

Last edited by gr870sfunk; Nov 8, 2012 at 09:15 AM.
  #6  
Old Nov 8, 2012, 09:51 AM
juggledad's Avatar
juggledad
 
22,263 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
good job! any other issues?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Nov 8, 2012, 11:13 AM
gr870sfunk's Avatar
gr870sfunk
 
108 posts · Mar 2011
Montgomery, AL
Not as of now, but Lord only knows what I might run into. I've moved onto the widgets for the sidebar, so I think i'm good to go on the over page template layout.

I feel kinds stupid for posting and then answering my own questions, but I know if i've run into these problem someone else has or will. Hopefully this will help some folks out.

Bookmarks

Tags
center column, custom page template, header.php and footer.php, index.php

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
HOWTO: a 'Custom Query' PAGE template juggledad Atahualpa 3 Wordpress theme 1 Jul 15, 2010 06:07 PM


All times are GMT -6. The time now is 07:49 PM.


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