Adding Pricing Tables to the Nimble Theme Homepage
In the first installment of our Nimble Theme tutorials, Nimble Theme Tutorial: Part One – The Basics, we showed you how to customize and build content for the home page of your WordPress site. Specifically, we demonstrated how to upload a custom logo and favicon, setup the featured image slider, control the “Blurb” section and configure the “News and Updates” section. In this tutorial we’ll show you how to round out your Nimble theme home page design with attractive pricing tables via the use of short codes.
What are “Short Codes”?
Short codes are simple bits of code that provide a larger function from within the themes files, allowing for advanced design and customization options without having to write out advanced code.
Professional Looking Pricing Tables are Important
It is difficult to drum up interest in your products and/or services if people don’t know how much you’re charging. Therefore, setting up your products and/or services listing using the Nimble Theme is a great option. As we discussed in part one of our Nimble theme tutorial series, the design is in line with what customers expect from modern product pages. Adding a pricing table is a perfect, easy to read solution if you offer multiple products or tiers of service at varying prices.
The Nimble theme makes it easy to display the price of your products and/or services by placing a “Plans and Pricing” section at the bottom of the home page by default. The folks at Elegant Themes take it one step further by providing highly-customizable, professional pricing tables that you can insert into your pages using short codes. Follow the steps below to setup the Nimble theme “Plans and Pricing” section…
Setting Up a Nimble theme Pricing Table
Step One: First, crate a page to host your pricing information.
In your WordPress Dashboard go to Pages > Add New and for this tutorial lets name the page “Prices.”
Step Two: Find the short code.
Elegant Themes offers a wealth of short codes for their themes and we encourage you to toy around with them, but here is the short code for pricing tables. Copy the code and paste it into the body of your page.
Step Three: You have to tell the Home page where to find the pricing table page.
In your WordPress Dashboard go to Appearance > Nimble Theme Options and click the home page tab > Scroll down to the “Plans and Pricing Page” section and select the page you created from the drop down > Save your changes and return to the home page > Your pricing table will now be live at the bottom of the page.
You will most likely want to fill in your own content and possibly add more fields. Adding your unique content to the pricing table can be done by changing the information contained in quotes within the short code. Creating more fields can be done by duplicating the code to create more columns or additional tables.
It’s also important to note that the page width only allows for two columns on your pricing table. If you need more room, go into your page editor and on the right hand side select “Full-width Page” from the “Template” drop down menu. This will eliminate the side bar and offer around twice as much space for your pricing table.
Getting everything perfect on the pricing table will take some tweaking so patients is important. However, with a little time and experimentation you will have an attractive pricing table on your Nimble theme site. The professional pricing table should help convert site visitors into paying customers.