Course Content
Advanced
0/31
Elementor: A Complete Tutorial
About Lesson

This video is embedded from Youtube and here’s the original one.

Let’s create a Custom Product Loop Skin for WooCommerce Products in Elementor. We will cover step by step from adding product featured images, product reviews & ratings, add to cart button, product page link, and sale badge for the Custom loop.

We go a step further, and add extra custom fields via Advanced Custom Fields for WooCommerce to add a unique colour background to each product. So sit back and enjoy this complete video to create your Custom Design for WooCommerce Product page.

▶ Widget Used
Custom Loop Skin for Products – https://theplusaddons.com/pluslisting…
WooCommerce Product Grid Listing – https://theplusaddons.com/pluslisting…

Timestamp:

00:00 Overview
01:28 Required Plugins for Custom Loop
02:06 Creating Custom Fields to WooCommerce Product
03:32 Adding the Products Content
04:49 Creating Product Shop Page
08:51 Listing the Product Grid
10:01 Creating Custom Product Template Design
10:42 Adding Product Background Color
11:55 Product Sale Tag
13:31 Adding Product Image
15:04 Adding to Cart Button
16:15 Adding Product Name
16:53 Adding Product Rating
17:39 Adding Product Price
18:14 Adding Product Page Link
18:56 Connecting the Custom Loop Template with Listing
20:45 End Notes.

0% Complete
Scroll to Top