How to Customize the Appearance of WooCommerce Product Images with Essential Addons (Elementor Free Plan)

In a WooCommerce store, product images are the main focus of users. If you want to create more attractive and interactive product pages, and for those who don't want to use Elementor Pro, a paid plugin, then Essential Addons is the ideal choice for you.

This tutorial will walk you through how to use the Elementor Free Editionrespond in singing Essential Addons PluginIt's easy to customize the display of product images, including rotation, thumbnail arrangement, pop-up view, and other advanced visual effects.

I. Plug-in preparation

Before you begin, make sure you have completed the following setup:

• Installed and activated:
  • WooCommerce Plugin
  • Elementor (free version)
  • Essential Addons for Elementor Plugin
• Store products have been added, make sure products have pictures

Enabling the Woo Product Images Widget

• Go to the backend and click"The Essential Addons > Elements "

• Scroll to WooCommerce Elements area, enable the " Woo Product Images "Widgets

• Click on the "Save Settings"

Third, create and edit product page templates

• Go to "Templat > Theme Builder"

• Click on the "¡ÓProduct Single"Tabs

• Existing templates can be selected for editing, or click on theAdd New Template"

• Set the following parameters:
  • Editor Selection:Elementor
  • Template Type:Product Single
  • Name the template and click "Create Template".

Once the template is created, click on the "Edit with Elementor" into the editor.

Fourth, add and customize the product image display

Add components:

• Search for "Woo Product Images"

• Drag the component to a suitable position on the page

Content Settings (Content Tab):

The following settings can be made:

• adapt Image Resolution
• On/Off Pagination
• set up Thumbnail number and position
• set up Image navigation styles,Loop switching (Loop)
• start using Popup window to view larger image (Image Popup)

Style Tab:

Further beautify the product images:

• Image background color, border style, spacing
• Spacing between thumbnails
• Style changes on mouse hover
• Popup Window Style and Size Settings

Advanced Settings (Advanced Tab):

The image display can be finely optimized by adjusting the following options:

• Margin
• Padding (inner margins)
• Responsive Settings with Z-index Hierarchy

V. Setting display conditions and publishing templates

• Click on the bottom right corner of thePublish"

• In the pop-up window, click on "Add Condition"
• Set the display logic as follows:
  • First item:Include
  • Second item:Singular
  • Third item:Product

• Click on the "¡ÓSave & Close"

This way the template is automatically applied to all WooCommerce Individual product pages.

VI. Viewing the effect

Visiting any one of the product pages, you will be able to see the effect of the product picture display just set up, the overall more beautiful and professional, but also to enhance the user browsing experience.

VII. Introduction to the Essential Addons Package

Essential Addons offers Elementor users several powerful feature packages that can be customized to meet different needs.

Below is the official package price list:

product or service package (e.g. for a cell phone subscription)	prices	length of time	Website activation	Support & Updates	gadget	Extended functionality	Templatley PRO Free Access
Lifetime Unlimited	$199.98 $249	limitless	✔	✔	85+ gadgets	15 extensions	✔
Unlimited	$79.98 $99	1 year	✔	✔	85+ gadgets	15 extensions	✔
1 Website	$39.98 $49	1 year	✔	✔	85+ gadgets	15 extensions	✔

You can see that the official Unlimited package is $79, the price is still relatively expensive, due to our website and Essential Addons official cooperation promotion, get the official discount price, please click on thethis linkInquiries and purchases.

summarize

utilization Essential Addons for Elementor PluginWith Elementor Pro, you can flexibly customize the image display area in WooCommerce product pages without purchasing Elementor Pro, including thumbnails, popup previews, paging navigation and other features to make your product pages more visually appealing. For more WordPress related tutorials and information, please pay attention toPhoton fluctuation network, has the most comprehensive WordPress tutorials and the most activeWordPress Exchange CommunityThe

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off