Sep 162014
 

Add Pricing Table To Suffusion Design shows you how to set up Featured Label Text, Font Sizes, Background Colors, Font Colors and more.

Last Updated: August 8, 2018

Latest News: I have updated the documentation.

The following post shows you how to customize the tables by adding color to the borders, fonts, buttons and more.

Add Pricing Table To Suffusion Tutorials:

Add Pricing Table To Suffusion Design

Step 1 ) Go to Pricing Tables -> Add New -> Design to set up the following options. See image below.

Table Design

  • General Settings
  • Font Sizes
  • Button Colors
  • Custom CSS
  • Save & Preview
  • Save
  • Deploy (Get Shortcode)

pricing-table-design-settings

Step 2 ) The following image General Settings allows you to set up the following options.

General Settings

  • Featured Label Text
  • Border Radius
  • Automatically match Row Height

pricing-table-design-general-settings

Step 3 ) The following image Font Sizes allows you to set up the following options.

Font Sizes

  • Featured Label Font Size
  • Plan Name Font Size
  • Price Font Size
  • Bullet Item Font Size
  • Button Font Size

pricing-table-design-font-sizes

Step 4 ) The following image Button Colors allows you to set up the following options.

Button Color (Unfeatured Columns)

  • Button Color
  • Button Border Color
  • Button Hover Color
  • Button Font Color

Button Color (Featured Column)

  • Featured-Button Color
  • Featured-Button Border Color
  • Featured-Button Hover Color
  • Featured-Button Font Color

pricing-table-design-button-colors

Step 5 ) The following image Custom CSS allows you to enter custom css to customize your tables further.

Custom CSS

  • Custom Pricing Table Css

pricing-table-design-custom-css

Click on the following URL Template to continue setting up the table plugin.

If you have any questions please let me know. I will be updating this tutorial from time to time so come back for the latest news.

Enjoy.

Manuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)