How Do You Modify The Pricing Table in Centric Pro?

[Ikigai]

Hey guys,

I only have two products for my site, but the pricing table comes with three options.

I removed the last one and changing the div class from "one-third first" to "one-half first" and I was able to get a 2-column pricing table, but the formatting (and everything else) went awry.

Here's the site (I left it as three column): gettheprogram.groombuilder.com

Has anyone made this custom modification before? Any suggestions would be greatly appreciated. 🙂

Thanks!

[Carlo]

Hi Ikigai. The pricing table isn't designed to be two-column. You'd need to rewrite the code.

---

Comprehensive, easy to follow Genesis documentation

[Ikigai]

Sounds good. Unfortunately, I'm such a beginner at this that I don't know how to do that. Do you by chance know what I should switch it with?

[RitzyThemes]

Hi lkigai!

find and replace the following code;

<div class="pricing-table">
	<div class="one-half first">
		<div class="price-heading">
			<h4 class="price-title">GroomBuilder Premium</h4>
			<div class="price">
				<span class="sup">$</span>
				<span class="amt">19</span>
				<span class="sub">/week</span>
			</div>
		</div>
		
		<ul>
			<li>8-Week Exercise Program</li>
			<li>Access to All Video Tutorials</li>
			<li>3 Customized Meal Plans</li>
			<li>Fat Loss / Muscle Gain / Hybrid</li>
		</ul>
		
		<a class="button" href="#">Buy Now</a>
	</div>
	<div class="one-half">
		<div class="price-heading">
			<h4 class="price-title">GroomBuilder Elite</h4>
			<div class="price">
				<span class="sup">$</span>
				<span class="amt">29</span>
				<span class="sub">/week</span>
			</div>
		</div>
		
		<ul>
			<li>GroomBuilder Premium Program</li>
			<li><center><b>Free Bonuses:</b></center></li>
			<li>8 <i>Extra</i> Weeks Of Workouts</li>
			<li>Five 20-Minute Workouts</li>
		</ul>
		
		<a class="button" href="#">Buy Now</a>		
	</div>
</div>

and add the following code in your style.css and update;

.pricing-table .one-half {
    background-color: #fff;
    border: 2px solid #000;
    margin-bottom: 40px;
    padding: 40px;
}

🙂

---

Get free and premium Genesis Child Themes

[Ikigai]

RitzyThemes, you are awesome. 🙂 This code worked like a charm and everything looks fantastic. Exactly what I was looking for. I really appreciate you taking the time to help. Thanks so much!

[RitzyThemes]

your welcome lkigai!

---

Get free and premium Genesis Child Themes

[Author]

Posts