Flatsome theme is definitely becoming the first choice for every WordPress users. As a number of our customization that can be achieved while you use Flatsome theme along with our Dynamic Pricing and Discounts plugin for WooCommerce.
As an end user of the Dynamic Pricing and Discounts plugin, you must be knowing that “Pricing Tables” and “Offers” are the most important feature of the plugin as through these gateways, the available discounts and offers are conveyed tomers.
You would sometimes want done with the help of the Flatsome theme.
After installing and activating the theme and the plugin, set up some Dynamic Pricing rules –
Now, go to have a look at how the default Pricing Table appears.
In order tom CSS.
Now, add the CSS code corresponding to give the Pricing Table. Here’s an example –
table {
border-collapse: collapse;
width: 100%;
}
th, td {
text-align: left;
padding: 8px;
}
tr:nth-child(even){background-color: #f2f2f2}
.xa_sp_table_head2_cell {
color: white;
background-color: #339999;
}
.xa_sp_table_head1 {
width: auto;
padding: 5px;
border: 5px solid #339999;
margin: 0;
}
.xa_offer_table {
width: auto;
padding: 5px;
border: 2px dashed #CC6600;
margin: 0;
}
.xa_offer_header {
font-weight: bolder;
}
.xa_offer_content {
font-weight: bold;
}
On adding the above code snippet, this is how your Pricing Table and Offers are going to look –
Similarly, if you want to a catchy one!
Thus, you are free to change the look and feel of the Pricing Table.
Then, you can even choose to suit your need, change the look of the “Sale“ badge etc.
Hope this helps.
Leave a comment if you need any help with the customization of the Pricing table and Offers table.