If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Featured templates

WordPress Cherry 3.x. How to make specific post fullwidth

Hello! This video tutorial shows how to make specific post fullwidth in WordPress CherryFramework 3 templates.

WordPress Cherry 3.x. How to make specific post fullwidth

Single post page usually includes the content area and the sidebar:

wordpress_how_to_make_specific_post_fullwidth_1

You may want to get rid of the sidebar and force the post content to occupy the whole screen. This can be easily done using several simple CSS rules.

Let’s learn how to do this.

  1. Using Firebug extension in Firefox or Inspect Element feature of your browser look for the sidebar class:

    wordpress_how_to_make_specific_post_fullwidth_2

  2. Then, find the content area class in the same way:

    wordpress_how_to_make_specific_post_fullwidth_3

  3. Now, let’s find specific class for single posts pages:

    wordpress_how_to_make_specific_post_fullwidth_4

The specific post page class is: postid-1910. In case you would like to perform changes to all the single posts pages, you should use the single-post class.

Now that we know names of classes, we can add required CSS rules to remove the sidebar and stretch the content fullwidth.

  1. Navigate to Appearance -> Editor in your WordPress admin panel:

    wordpress_how_to_make_specific_post_fullwidth_5

  2. On the appeared style.css file screen add the following code at the very bottom of the file:

.postid-1910 #sidebar {
 display: none;
}
.postid-1910 #content {
 width: 100%;
}

Click the “Update File” button below to apply changes:

wordpress_how_to_make_specific_post_fullwidth_6

Navigate to your site front-end and refresh the page to see changes.

You can see the post content is displayed fullwidth now:

wordpress_how_to_make_specific_post_fullwidth_7

This is the end of the tutorial, you have learnt how to make specific post fullwidth in your WordPress CherryFramework 3 template.

Feel free to check the detailed video tutorial below:

WordPress Cherry 3.x. How to make specific post fullwidth