• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2762

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Premium Access
  • Log in

Fixing P Class Note & Alert Content Boxes After Changing Themes

Changing from Thesis to Genesis can cause problems.

I know Chris Pearson uses P Class for his alert and note boxes.

The CSS is built into the theme so you only need to add the code in your HTML/Text editor like this:

P Class Content Boxes

These boxes might not work depending on which framework you move to and which child theme you install.

The Fix.

I know after moving from Thesis to Genesis my boxes where a bit messed up.

The border was right next to the text because there wasn’t any CSS code supporting the boxes.

I have been fixing them manually over the last year but still haven’t finished so i came up with this solution.

Add this code to your child theme’s style.css file.

.note {
background: #F5F6CE;
border: 1px solid #F3E2A9;
display: block;
padding: 20px;
}

.alert {
background: #F6CECE;
border: 1px solid #F5A9A9;
margin: 0 0 25px;
overflow: hidden;
padding: 20px;
}

You’ll notice the code in blue is different.

You can change this depending on the result which depends on your new theme.

You could also keep them all the same color if you new link color doesn’t go well with the yellow note boxes or red alert boxes.

This is something i have done because of the new link color clashing with yellow and red.

Now all the old boxes i created while using Thesis are grey which pretty much goes with any link color.

Creating Content Boxes

If you haven’t created any colored content boxes you have 2 choices

  • Install a plugin and use shortcodes
  • Add CSS code for colored content boxes to your child themes style.css file.
Subscribe for new Tutorials

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
 

Loading Comments...
 

You must be logged in to post a comment.