0

I want to know how to stylize pages that display specific post content in Wordpress. For example, if I have categories Horror and Comedy, how to stylize (change template and css) pages in a way that all posts that are members of category Horror be stylized differently for any post from category Comedy? If a page should display post from Horror category, then give me one page style, if a page should display post from Comedy category, then give me the other page style. Thanks in advance.

2 Answers 2

0

Assuming you have one post with only one category assigned, you can edit the single post page (post.php or single.php depending on your theme) to add an HTML ID to the main class. You will have to use the get_the_category() function. Your PHP code will look something like this:

<article id="category-
<?php 
$category = get_the_category();

if ( ! empty( $categories ) ) {
    echo esc_html( $categories[0]->name );   
}
else { echo "default"; }
?>"
class="single-post">
........
.....
</article>

this will create a dynamic id for a post with the category name. Suppose a post has a category "Horror" then the HTML ID for the main div will be "category-horror". You can use this id in your CSS to add different styles to this on other HTML elements inside this. Something like this:

#category-horror .single-post {
margin-top: 10%; }

Hope this helps.

2
  • thanks. Where should I put this code? Mar 29, 2017 at 6:54
  • @NancyBrown you will have to add this code in single post page depending on your theme. For example, if you are using the "twentyeleven" theme you will have to put this code in single.php
    – Sid
    Mar 30, 2017 at 5:04
0
1) you can create 2 custom template with 2 different layout.
2) Right now when you call single page template there put code like this. 

For Example :

if(is_category( 'Horror' )){
  get_template_part( // get your custom template );
}elseif(is_category( 'Comedy' )){
  get_template_part( // get your custom template );
}else{
  get_template_part( // Default template );
}

https://developer.wordpress.org/reference/functions/get_template_part/ https://developer.wordpress.org/reference/functions/is_category/

NOTE : i am not sure about this because it's depend on themes.

I hope it's useful.

1
  • thanks. Where should I put this code? Mar 29, 2017 at 7:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.