WooSmart is a powerful WooCommerce extension that gives you opportunity to easily showcase your WooCommerce Products beautifully anywhere of your web-pages. This plugin supports different layouts and provides lots of customizing options. It is an easy to use plugin packed with 15+ smartly designed layouts. It is integrated with smart wishlist and lightbox effects to showcase your online products.
The installation process of WooSmart Plugin is quite simple and straightforward, and shouldn't cause you any troubles at all. Independent of you previous experience with WordPress plugins, you aren't likely to have any problems, just follow these simple steps:
Download & install Envato Market plugin
This plugin can install WordPress themes and plugins purchased from ThemeForest & CodeCanyon by connecting with the Envato Market API using a secure OAuth personal token. Once your themes & plugins are installed WordPress will periodically check for updates, so keeping your items up to date is as simple as a few clicks.
If you download new plugin version from CodeCanyon please follow these steps to upgrade from the existing version:
1. Go to your FTP and open WordPress plugins folder
2. Delete the old WooSmart | Products Catalog and Showcase for WooCommerce version folder
3. Upload the new version of WooSmart | Products Catalog and Showcase for WooCommerce
4. Go to WP-admin panel, open Plugins section.
5. Deactivate WooSmart | Products Catalog and Showcase for WooCommerce, and then activate it again.
STEP 1: At the beginning, You must have installed WooSmart plugin and WPBakery Page Builder plugin in your wordpress site.
STEP 2: Then you will edit a page and choose the backend editor and click on Add Element button.
STEP 3: Now you will find an Elements chart. From there click on tab "by Fluent-Themes Shortcode". There is showing all the WooSmart Elements to choose from. Now you can choose FT- Woosmart Layout-1 or any other element you like.
STEP 4: You will get a popup of FT- Woosmart Layout-1 setting fields. Now you have to fill up the fields as your needs. All the fields are self-explanatory, for example choosing product category from dropdown, choosing how many products to show, choosing color of buttons etc.
STEP 5: Click on Save changes button and publish or update the page. That's all.
You can easily use shortcode [woosmart_layout1 cat_id="1"]
to show Products whose category ID is 1. In the following table we are explaining all the parameters of the shortcodes you can use in your pages/posts to show your WooCommerce Products:
Parameter | Description | Example |
---|---|---|
category | Products Category | [woosmart_layout1 cat_id="1"] |
wishlist | Choose Page for Wishlist | [woosmart_layout1 wishlist_page="Page_URL_of_your_WishList_Page"] |
order | Choose Products Order (ASC or DESC) | [woosmart_layout1 order="DESC"] |
orderby | Choose Products Sorting Orderby | [woosmart_layout1 orderby="Date"] |
post_per_page | Number of Products to Show | [woosmart_layout1 post_per_page="3"] |
title_color | Product Title Color | [woosmart_layout1 title_color="#000"] |
price_color | Price Color | [woosmart_layout1 price_color="#000"] |
btn_bg_color | Button Background Color | [woosmart_layout1 btn_bg_color="#eee"] |
btn_text_color | Button Text Color | [woosmart_layout1 btn_text_color="#000"] |
box_bg_color | Box Background Color | [woosmart_layout1 box_bg_color="#eee"] |
box_border_color | Box Border Color | [woosmart_layout1 box_border_color="#1e73be"] |
sale_badge_bg | Badge Background Color | [woosmart_layout1 sale_badge_bg="red"] |
wishlist | Enable/Disable Wishlist | [woosmart_layout1 wishlist="yes"] |
hover_image | Enable/Disable Hover Image Gallery | [woosmart_layout1 hover_image="yes"] |
Example of Using Multiple Parameters in One Shortcode | [woosmart_layout3 cat_id="16" wishlist_page="197" order="DESC" orderby="date" wishlist="yes" quickview="yes" btn_hover_effect="yes" badge_bg="#f5c648" badge_bg_before="#f5c648" badge_bg_after="#f5c648"] |