Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Center area post/pages »

How can I style my posts only, and not pages?


  #1  
Old Feb 15, 2011, 02:12 PM
mactony
 
67 posts · Jan 2009
Hello! It's been a while since I've posted here, hope everyone is doing well. Looks like business is booming at BFA!

I have a home page of static content, and a "News" page for my blog posts. I would like to add a border and different color background for each individual post, that is, the post "container" with the headline, byline, body, etc. When I try to do this under ATO, the border and background appear on my static pages as well.

Here is the URL of the static page:
http://www.midriffrecords.com

And here is the URL of the post page:
http://www.midriffrecords.com/news

I feel like the answer is right in front of me, but I can't see it.

Thanks!

Tony
  #2  
Old Feb 15, 2011, 02:29 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
As you may know, pages are just special posts which is why the styling applys to both. If you want it different what you can do is add CSS inserts and start the CSS Selector with 'body.page' so lets say you want to change the center area color to red for a page, you could use
HTML Code:
body.page #middle .page {background: red;}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Feb 15, 2011, 02:55 PM
mactony
 
67 posts · Jan 2009
OK, I see. So would you advise styling the pages via CSS inserts, and use ATO for the posts?

Also, is there a place to find which selectors I would need to modify (for instance, I would not know to add the "#middle" tag)? Or are the ones you have given the only ones I'll need?

Thanks so much for such a fast response!
  #4  
Old Feb 15, 2011, 03:19 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Well you may need more depending on what you want to do. A good tool is FireBug in FireFox so you can examine the elements of the page and see the css that changes them.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Feb 16, 2011, 07:30 AM
mactony
 
67 posts · Jan 2009
I forgot about Firebug! Excellent suggestions. Thanks, I should be good to go now!

  #6  
Old Feb 17, 2011, 02:20 PM
mactony
 
67 posts · Jan 2009
OK, I spoke too soon! Not quite working out, and I think I am just not getting the right selector in the CSS. Maybe I can "show my work" and you can lend some insight?

I updated my ATO so that all post containers would have a border: 1px solid #999999.

I then updated my external CSS, trying the following:

body.page #middle .page
body.page #middle div.page
body.page div.page

all set with a border: none;

But it still is not removing the border on the static page. I have attached a png with the Firebug readout of the HTML and CSS. I have a feeling I am just not finding the right selector.

Do you have any advice? Thanks!

Tony
Attached Thumbnails
Click image for larger version

Name:	Screen shot 2011-02-17 at 4.16.18 PM.jpg
Views:	593
Size:	172.9 KB
ID:	1165  
  #7  
Old Feb 17, 2011, 03:38 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Quote:
I then updated my external CSS, trying the following:

body.page #middle .page
body.page #middle div.page
body.page div.page

all set with a border: none;
what is the EXACT syntax you used (more errors are caused by typos...)
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #8  
Old Feb 17, 2011, 04:01 PM
mactony
 
67 posts · Jan 2009
i tried each of these variations separately:
body.page #middle .page
{
border: none;
}

body.page #middle div.page
{
border: none;
}

body.page div.page
{
border: none;
}

I also tried each one with
{
border: 0px solid #999999;
}
(That may have been when I started to feel my mind slipping away...)
  #9  
Old Feb 17, 2011, 06:24 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
I'm confused, you said
Quote:
updated my ATO so that all post containers would have a border: 1px solid #999999.
but I only see two references in the CSS to 999999. One is on 'table#wp-calendar th {' and the other is on
input.textbox for WPG2 */
input.text,
input.textbox,
input.password,
input.file,
input.TextField,
textarea {
and I don't see any 'body...' CSS Inserts at all.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #10  
Old Feb 17, 2011, 07:18 PM
mactony
 
67 posts · Jan 2009
Apologies for the confusion. I have removed the #999999 border from my ATO, until I figure out this issue. Right now, the border is not in my ATO or my external CSS (which is midriffrecords.com/midriff.css). Otherwise I would have the border appearing on all my pages, which I don't want, until I can figure out how to selectively apply it.

I was hoping that the screen capture I supplied might help as a clue to determine which selector I should be using. On the lower right of the screen capture, the border appears in the ATO-generated CSS in the Firebug window, and I was wondering if that might be a clue as to what selector I should be trying to modify under my external CSS.

The CSS I supplied in my previous post was just a rundown of what I had previously entered into my CSS, and had not helped in removing the border on my static pages. It is no longer included in my CSS.

I hope this helps to clarify! Sorry again about the confusion. Thanks for all your efforts!
  #11  
Old Feb 18, 2011, 05:55 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
please do this.
Set your border around the posts as you want it, then export your settings (ato->export/import settings) and attach it to a reply and I'll take a look.

(if you first do an export, then make the changes and do a second export, you can just re import the first to get back to where you were)
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #12  
Old Feb 18, 2011, 08:10 AM
mactony
 
67 posts · Jan 2009
Excellent idea! Exported settings attached.

A reminder that I also use http://www.midriffrecords.com/midriff.css for the majority of my CSS instead of the HTML/CSS inserts

Thanks again!

Tony
Attached Files
File Type: txt ata-wwwmidriffrecordscom-20110218.txt (16.8 KB, 786 views)
  #13  
Old Feb 18, 2011, 08:46 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
add this to CSS Inserts
HTML Code:
body.page div.page,
body.page div.page .post-bodycopy {
	border: solid 0px red;
}
I would make sure you add any CSS for the theme in CSS Inserts instead of your external CSS. They will carry over during updates, it's less confusing and it you ever change themes, they will not be in the external style sheet which could conflict with the new theme. Just my two cents.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #14  
Old Feb 19, 2011, 01:04 PM
mactony
 
67 posts · Jan 2009
Worked like a charm! Thank you so much!

I also took your advice and replaced the CSS into the inserts panel. Thanks again!

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Style POSTS and PAGES - widths not correct in IE WhitePhantom Center area post/pages 4 Nov 4, 2010 04:36 PM
Problems editing "Style POSTS & PAGES" jeffreyellis Center area post/pages 1 Aug 6, 2010 07:04 PM
[SOLVED] Confusing "Style Posts and Pages"- there is no main tab "Text & Link Styling treeplant Center area post/pages 4 Apr 5, 2010 07:49 AM
[SOLVED] How to create grid style for the posts m0r6h3us Post-Kicker, -Byline & -Footer 18 Nov 19, 2009 01:37 PM
Editing the table style and in the posts kirinafa Atahualpa 3 Wordpress theme 1 Mar 1, 2009 03:54 PM


All times are GMT -6. The time now is 05:20 PM.


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