Jump to content


Photo
- - - - -

Can you style a page entry content different to a post entry content


Best Answer Danny , 22 October 2013 - 10:23 AM

Use the following to prefix your custom CSS for each.

 

Post = .type-post { background-color: red; }

Page = .type-page { background-color: blue; }

Go to the full post


  • Please log in to reply
7 replies to this topic

#1 brenb

brenb

    Advocate

  • Members

  • 308 posts
  • Country: Country Flag

Posted 21 October 2013 - 11:27 AM

I need to style alll my post entry content backgrounds differently to my page post entry content backgrounds

Is this possible as they are both .entry_content

however i did notice that a class is different on a page as opposed to a post

 

class = "post-181 page type-page status-publish hentry fpost post-number-1 instock"

 

the page type is either post or page depending.

so tried using this in the css and didn't work.

just wondering if it's at all possible

 

 

article .page type-page .entry_content{
background-color: #FFF;
padding:10px;
line-height: normal; 
box-shadow: 3px 3px 1px rgba(0, 0, 0, 0.2); 
}


#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 15907 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 21 October 2013 - 12:23 PM

Hi,

 

Each page, post, category etc.. are given a unique class in the body tag, this allows you to use that class to give that specific post, category, page etc.. unique styling.

Therefore, if you wish to give a specific post a pink background color, you would need to inspect the body tag so that you get the correct class and ID and then use that in your custom CSS, The <article> tag also has the post id class and ID which you can use for example:

 

 .post-369 {
background: #FFC0CB;
}

 

Will give a post that has an ID of 369 a pink background.

 

http://d.pr/i/TS3g



#3 brenb

brenb

    Advocate

  • Members

  • 308 posts
  • Country: Country Flag

Posted 21 October 2013 - 02:42 PM

Hi Danny,

Thanks for that but don't want to style a specific post, I want to style all post (content post loop)  but I want to style them different to a page (content post loop)

Currently I have this style which applies a white background with a box shadow to all post loop content on pages and posts.

 

 

.hentry-pad{
background-color: #FFF;
line-height: normal;
box-shadow: 3px 3px 1px rgba(0, 0, 0, 0.2);
margin-left: 4%;
padding: 15px;
}
 
When I was using pagelines framework I could apply a different style to global page (content post loop) and to global post  (content post loop) by using this style but it doesn't work for DMS
 
body.single-post section#postloop {
background-color: #fff;
box-shadow: 0px 0px 3px #cccccc, inset 0 0 5px rgba(0, 0, 0, 0.05);
min-height: 150px;
border: 1px solid #FFF;
padding-top: 0px;
padding-right: 35px;
padding-bottom: 10px;
padding-left: 35px;
}
 


#4 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 22 October 2013 - 12:41 AM

Hi there,

 

Try the following

 

.single-post article {
background: blue;
}
 



#5 brenb

brenb

    Advocate

  • Members

  • 308 posts
  • Country: Country Flag

Posted 22 October 2013 - 09:04 AM

Hi James.

Tried that but it applies a blue background to all page and post content loop area.

I was able to do this no problem in pagelines framework, I really hope there is a solution.



#6 Danny

Danny

    Is Awesome!

  • Moderators
  • 15907 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 22 October 2013 - 10:23 AM   Best Answer

Use the following to prefix your custom CSS for each.

 

Post = .type-post { background-color: red; }

Page = .type-page { background-color: blue; }



#7 brenb

brenb

    Advocate

  • Members

  • 308 posts
  • Country: Country Flag

Posted 22 October 2013 - 03:46 PM

Danny,

Can't thank you enough, spent a good few hours trying to work this out and should have gone right back to basics.

Sincere thanks



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 25 October 2013 - 01:57 AM

He taught me a new one with that too!

 

Glad he was able to help.  He's great!