• 0

How To Add A Category Description To Your Category Pages!


Question

Posted · Report post

I’m posting this how-to here in case anyone needs it since I think it’s pretty handy.

 

In case you have ever wondered how to add a category description to each of your category pages, here is how you do it! Yay. OK, here's what you need to do (I broke it up into chunks - you just follow the steps from start to finish).

 

PART 1: First you need to install/activate a section and a plugin

1. *If you already have the ContentBox section installed and activated you can skip this step*
To install ContentBox, go to PageLines > Store > Sections > Get New Sections > Top Free then click the "Install" button and then activate it. It won't show up in Drag & Drop if it's not activated!

 

2. Now go to Plugins > Add New and search "Shortcode Exec PHP" and click the "Install Now" link then once it installs activate it by clicking "Activate Plugin". Now you're done installing your stuff!

 

PART 2: Adding the ContentBox to the right place and adding your category description

 

3. Go to PageLines > Drag & Drop and select "Page Templates" OR "Content Area" (depends on which one you want) under "Select Template Area" and "Category" under "For Which Type of Page"

 

4. Drag the ContentBox section from the Available/Disabled Sections area on the right to the top of the Active Sections area on the left (you must arrange ContentBox at the top so that it displays at the top of the page). Now your category description has a home!

 

5. Now go to Post > Categories and mouseover whichever category you want to add a description to and click the "Edit" link.

 

6. Once you've done that, type it in the Description box directly below the "Parent" dropdown menu option and save it by clicking the "Update" button at the bottom. Alright! Your category description is all set! (If you have more categories to add descriptions to, just repeat this step)

 

PART 3: Now it's time to convert the PHP tag WordPress provides for adding category descriptions to templates to a shortcode that can be added to ContentBox!

 

7. Go to Tools > Shortcode Exec PHP on the left side of your Dashboard and scroll down. You're going to see an empty box that looks like this:
[attachment=550:Screen Shot 2013-01-24 at 11.52.24 AM.png]

 

8. In the field at the top, type in categ_des (short for "category description" so you know that's what the shortcode is going to be for) and then add the following code to the box EXACTLY as it is (don't add spaces or any extra code). It'll occupy just one line in that box (please see the Attached Thumbnail at the bottom of this post to see what the box should look like).

 

9. Now click on the "Save" button below the box and now you've got your shortcode! The shortcode is as shown at the top of the box with the brackets added on each side: [categ_des]

 

PART 4: Adding the shortcode to ContentBox and finishing it off!

 

10. Now go to PageLines > Page Options > Category Page and select ContentBox (note: if this section is showing up as inactive, please go to PageLines > Store > Sections > Your Added Sections and click the Activate button to activate it!).

 

11. In the Content Box Content area, add your shortcode [categ_des] so that it looks like this:
[attachment=552:Screen Shot 2013-01-24 at 12.02.03 PM.png]

 

Click "Save Options" and check out that spankin' new description at the top of your category page! YAY! Here's mine as an example:
[attachment=553:Screen Shot 2013-01-24 at 12.05.07 PM.png]
Note: I didn't make any adjustments with CSS which accounts for the spacing weirdness, but you can easily take care of any appearance issues using Custom CSS.

 

You're done! Time to celebrate with a few party kittens:

 

[attachment=554:Kitten-party-hats.jpg]

4 people like this

Share this post


Link to post
Share on other sites

27 answers to this question

  • 0

Posted · Report post

Hi there,

 

To color the background of that section, you'll need to target the p element of the #section.php. This will give you the following effect - http://screencast.com/t/r8FnnIbmk6zA

 

The only other option I can think of to include the title would be using a hook to insert the text prior to the category posts.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Catrina
Thank you very much for your excellent explanation ! !
I take note
wpml_mail.gif

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

This is absolutely fantastic. I thought finding a solution would be difficult, but this is perfect. Thank you!!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi there,

 

I cannot seem to populate the description box at all in any of my categories. When I place the mouse to put the cursor in the text box it won't populate and it just flashes with a blue line at the bottom of the box. Uber frustrating. Do you know why this might be?

 

Thanks,

 

John.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi.

 

It's probably a plugin conflict. Do you have many plugins? Particularly older ones? Deactivate all non-PageLines plugins and see if the issue resolves.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks guts got it working. In my category descriptions I got my silo builder set up but they are not showing. Have you to configure anything special in Pagelines for them to show?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I don't know about 3rd party premium plugins.  The process should work provided you've added the description to the category in Dashboard > Posts > Categories under each category. Unfortunately, I can't support the 3rd party plugin or even analyze what it's doing.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Ok thanks, I'll see if I can get it sorted

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Out of curiosity, does it work properly with the Silo Plugin deactivated?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks a lot!! Good advice!   :)

 

Anyone know how to change the CSS as well for "category description", so the CSS is the same as a "post loop"?

 

I would like the same CSS (white block) for the text (category description). 

My website: http://www.internetmarketing-advies.nl/zoekmachine-optimalisatie/

 

Hopefully someone knows how to fix this? 

 

best regards,

rowin 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rowin,

 

If you have firebug or chrome dev tools you can copy the css styles which are applied to the postloop and then apply them to the new title you've entered. #section.php .content-pad

 

Example of what's coloring the postloop currently - http://screencast.com/t/mSMQIcsi6CHi

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rowin,

 

If you have firebug or chrome dev tools you can copy the css styles which are applied to the postloop and then apply them to the new title you've entered. #section.php .content-pad

 

Example of what's coloring the postloop currently - http://screencast.com/t/mSMQIcsi6CHi

 

Hi James,

 

thanks for your answer. Sorry for my late reaction... I was busy, so hopefully you can help me out.

 

In the custom CSS I paste the following code:

 

 

section#content-pad {
padding: 20px;
margin-top: -14px;
margin-right: 0px;
background: rgba(255,255,255,0.85);
border-radius: 0.8em;
border-style: solid;
border-width: 1px;
border-color: blue;
box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.7), inset 1px 1px 4px 0px rgba(0,0,0,0.7);
}
 
There is no changing.... Is the above CSS wrong?
I also tried:
 
#section.php .content-pad {
padding: 20px;
margin-top: -14px;
margin-right: 0px;
background: rgba(255,255,255,0.85);
border-radius: 0.8em;
border-style: solid;
border-width: 1px;
border-color: blue;
box-shadow: 1px 2px 4px 0px rgba(0,0,0,0.7), inset 1px 1px 4px 0px rgba(0,0,0,0.7);
}
 
 
 
 
Thanks a lot... 
 
Rowin.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

And I use the plugin Shortcode Exec PHP for show up the description of my category's....

So I think It's somewhere in the css of this plugin, but I'm not shore??? Hopefully somebody can help me out!

 

If there is another option to show up the description of the category (and with the CSS of the postloop) this is also allright?!?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

This is genius! 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Yeah, we think James B is a genius too!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi there,

 

To color the background of that section, you'll need to target the p element of the #section.php. This will give you the following effect - http://screencast.com/t/r8FnnIbmk6zA

 

The only other option I can think of to include the title would be using a hook to insert the text prior to the category posts.

 

Hi James,

 

Thanks for your support. Looks good! How does this works exactly? Which (exactly) custom CSS I have to use and can I put this at "Custom CSS" at "sitesettings" ?

 

Thanks a lot!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

If you are using a child theme, you can do the following to add the category description below the title:

 

1. Copy the postsinfo folder from /pagelines/sections/ into your /child-theme/sections/ folder

2. Around line 29 of /child-theme/sections/postsinfo/section.php you will see something like:

elseif( is_category() ):
	printf( '%s <strong>"%s"</strong>', __( 'Currently viewing the category:', 'pagelines' ), single_cat_title( false, false ) );

3. Change this to:

elseif( is_category() ):
	printf( '%s <strong>"%s"</strong>', __( 'Currently viewing the category:', 'pagelines' ), single_cat_title( false, false ) );
	printf( '<div class="cat-desc">%s</div>', category_description() );

The description will be wrapped in a div with the class "cat-desc" for CSS purposes

2 people like this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I am using Pagelines Framework and would like to add a category description, but I am unable to access any of the sections in the Pagelines store, including ContentBox. Is there another way to do this? Does the Pagelines store still exist for Framework?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

PageLines Framework store is no more. Everything but DMS 2 is all but abandoned.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks for the response, albeit a bit doomed. I ended up using a Universal Sidebar in the category template with a category description widget, but am wondering if there is a solution that is more native to Pagelines Framework, for those of us still out there who have not yet taken the plunge into DMS.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks for the link. Question: are they any installation instructions and documentation?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi rpacker

Please, you can take a look to this

http://support.pagelines.me/docs/

By the way, you can find more information at forum with the "search..."

;)

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

These docs don't contain information about the current status of the Store, which is no longer functional. I just wanted help with the installation of the sections that I just had to download *separately* from the Store.

 

Thanks.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

To install them, you will want to exact the zip files and then use an FTP client. Then upload the folder of a section to the following directory:

 

wp-content/themes/child-theme/sections

 

For example: Lets say you download the ContentBox section and want to install it on your site. Following the steps above, your sections folder in your child theme should look like this:

 

child-theme/sections/content-box

 

That should work, as far as I remember.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now