In this tutorial we will be showing you how to setup Woocommerce Hopepage as our Woocommerce demo page. For this you need to install following plugins:
- WooCommerce
- Widgetkit
- JP Widget Visibility
Adding a page for woocommerce products:
- Go to dashboard-> Pages-> Add New and add page. Here we had created page called -‘ Home WooCommerce’.
-
Then to display woocoommerce products ,add this WooCommerce shordcode in content area switching from visual to Text option in right top corner above the content area
[recent_products per_page=”16″ columns=”4″]
Note: You can add more products per page by increasing shorcode attributes ie ‘per_page = “Number of products to show on page” and can also reduce or increase column using columns attributes.
Adding Widgetkit slideshow in Banner Wide Sidebar
- After you installed WidgetKit plugin you will get menu on dashboard called WidgetKit where you will configure for WidgetKit slideshow.
- To know how to install widgetkit and configure it please refer this tutorial.
[Youtube tutorial]: www.youtube.com/watch?v=El0SWV10a0U
[Theme tutoial] : https://www.styledthemes.com/flat-responsive-setup/387-create-a-slider-like-the-demo-website-using-widgetkit
3. After creating shortcode from WidgetKit , add Text widget in Banner Wide sidebar. Now add slider image shortcode to text content area so you will be able to get slider image below header.
Adding content just below the banner wide widget
To add content just below the banner area, there is four sidebar which will display your content in single row.
For this you need to add text widget in respective Top1, Top2, Top3 and Top4 sidebar. And use title and content of Text widget as per your requirement.
Note: You can use Jetpack WidgetVisibility lugin, which gives you full control on which pages your widgets will appear. for reference:
https://www.styledthemes.com/flat-responsive-setup/378-how-to-show-widgets-on-selected-pages-only