Archived

This topic is now archived and is closed to further replies.

  • 0

Help with creating different css tags for posts page single post

Question

Posted · Report post

Working with Platform Pro, the Posts Page shares the same CSS with the single post page. I want to style the single post page differently than the many posts page. Anyone done this? Head me in the right direction? I imagine it is a matter of adjusting the PHP code to create a different css tag on the Many posts page, then create the necessary css to support it. For what it is worth, this is what I have done: (Single Post Page) 2rQAa.png This is the cause, the multi-post page now has the same CSS: (Multi-post page) 8ORLj.png I want that multi-post page to have the this look: (desired look) xBohE.png (this is the original platform pro css styling)

Share this post


Link to post
Share on other sites

5 answers to this question

Posted · Report post

I haven't attempted to making the changes to any .php code yet. The changes I've made are only to the current .css styles available. I'm a css guy, but not a .php guy. So I'm slowly beginning to understand what is going on in the php files.... If/when I figure this out, I'll post my solution. I was hopeful someone else had already done this before. Cheers!

Share this post


Link to post
Share on other sites

Posted · Report post

Looks like I ran into a larger issue as the multi-post page and single-post page are both delivered via the 'template.postloop.php' file. They are both using the WP Loop... Ugh! This is where it all happens: <?php pagelines_register_hook( 'pagelines_loop_post_header_start', 'theloop' ); //hook ?> <div class="post-title-section fix"> <div class="post-title fix"> <h2> " rel="bookmark" title="<?php _e('Permanent Link to','pagelines');?> <?php the_title_attribute(); ?>"><?php pagelines_register_hook( 'pagelines_loop_posttitle_start', 'theloop' ); //hook the_title(); ?> </h2> Any .php junkies out there who could help with an if/then that switches between two css styles for whether there are multiple posts or just a single post? Greatly appreciated!

Share this post


Link to post
Share on other sites

Posted · Report post

The beautiful thing about WordPress is that it is a CSS lover's dream. Every single post has a class attached to the body. For example here is just a sample of many classes applied to a single post on my local machine. body class="single single-post postid-741 logged-in fixed_width" The blog page similarily has a class of "blog" :)

Share this post


Link to post
Share on other sites

Posted · Report post

Solved, thanks Adam for getting me back on track! For anyone else who stumbles on this topic and needs extra help, this was the code I used to style my single posts differently than the multi-post page. Added to the custom code section in the theme settings. (Btw, these are all new css rules, they are not provided by the theme) body.single.single-post h2{ font-size: 2em; line-height: 1em; margin:0px; padding: 4px; text-transform: none; letter-spacing: -.02em; background-color: black; color: white; } body.single.single-post h2 a{ color: white; } body.single.single-post h2 a:hover{ text-decoration: underline; color: #999999; }

Share this post


Link to post
Share on other sites

Posted · Report post

You're correct, you would have to adjust some of the code within the individual post page and multiple posts page and then create the CSS to support the two. Are the changes you've made so far for the single post page complete or will you be doing more to it?

Share this post


Link to post
Share on other sites