Pricing table customization help

Ask the Community Customization
,
1

I am trying to do some customization with the Pricing table and assume I will need some custom CSS…but that is outside my paygrade.

Here is our webpage with the current iteration of my pricing table: https://www.premierweightsolutions.com/pricing

There are a couple of things I want to do:

  1. Change the font size of the Head Column
  2. Allow for different features within each column based off of which toggle is selected
  3. Change the padding for the columns as well (trying to make the head column more narrow)

Any help is greatly appreciated!

1 Like
2

Hello and welcome to the forum!

I’m so sorry for the late reply, but I’ll be happy to help you with the customization!


1-3. To change the font size and the padding for the first column, please replace your current code with the following one:

.eapps-pricing-table-column-1 .eapps-pricing-table-column-features-item {
   font-size: 25px !important;
   line-height: 28px;
}

.eapps-pricing-table-column-1 .eapps-pricing-table-column-features-item-inner {
  padding: 8px 10px;
}

You’re most welcome to adjust the values the way you need :slight_smile:

  1. Much as I’d love to help, unfortunately, such a behaviour is not supported in our Pricing Table widget. However, we have such a request in our wishlist, and you’re most welcome to vote for it here: Features specific to Annual subscription | Feature Wishlist.

Please let me know if it helped or if there’s anything else I could do for you!

3

I had the same question about changing the size of the font of the head table and found this post. Where do I find this code, and which of the variables do I change? I’d like to set the font size of feature columns to 15 (that is easy to do within the app), but now the head table is too small and I’d like to match that font size. Can you help me out?

1 Like
4

Hi @user8372 and welcome to the Community :wave:

Could you please specify what font size you’d like to have for the head column? We’ll be happy to look into this for you :slightly_smiling_face:

5

Thank you so much for following up. Had shot for 15, but everything gets a bit tight that way. Is it done with custom code, easy enough to try it?

1 Like
6

Please try to add this code to the Custom CSS field on the Appearance tab of your widget’s settings:

.eapps-pricing-table-column-3 .eapps-pricing-table-column-features-item-inner {
    font-size: 15px;
}

.eapps-pricing-table-column-1 .eapps-pricing-table-column-features-item {
   font-size: 15px !important;
}

Check it out and let me know if you like what you see :slightly_smiling_face:

1 Like
7

Works fantastic! Thank you!

2 Likes
8

Great!

You are very welcome :slightly_smiling_face:

9

You guys are better, faster and more relable than any contractor I have ever hired and I haven’t even hired you all!
Thank you! I am an affiliate and spreading the word!

2 Likes
10

Your comment has made our day! Thank you so much for your amazing feedback :heart: