WoodMart Tutorial: Creating a Lookbook with a Showcase Page

If you are using WoodMart ThemesWhen building a high-end e-commerce website and wanting to showcase a product's style mix or collection combination, a Lookbook page is the ideal way to do so. It enhances the brand's tone and also gives visitors a more intuitive way to see how the products would look in a real-life scenario.

Here's a hands-on guide on how to create a beautiful and functional program with WoodMart. Lookbook or catalog display page.

Step 1: Prepare the page content and images

Before getting your hands dirty, it is recommended that you prepare:

• High-quality product scene images or model images
• Product links for each image
• Short text introduction (optional)

The core of Lookbook is the visual presentation, and the quality of the images determines the overall premium feel of the page.

Step 2: Create a new page and enable Elementor or WPBakery

WoodMart supports two page builders:Elementor respond in singing WPBakery. If you're using Elementor, you can:

• Go to WordPress Backend → Pages → Add New Page

• Name it "Lookbook" or "Matching Catalog."
• Click on "Edit with Elementor" or "Edit with WPBakery" to enter the visualization interface.

Step 3: Add a Lookbook Module with WoodMart's Proprietary Elements

WoodMart There are several built-in widgets suitable for creating Lookbooks, such as:

• Lookbook Image Hotspot Module
  This module allows you to add multiple clicks on a picture, each hotspot can be linked to the corresponding product, commonly used in "model wear", "home scene" and other displays.

• Drag in the Lookbook Hotspot element
• Each hotspot can be filled with the name of the product, a short text description and set the jump link

• Upload a style or model image
• Click on Add Hotspot to adjust the position

• Product Grid + Scenario Module
  A banner image can be inserted in the middle of the page with the product list below to create a sense of visual disparity.

• Image + button combination module
  Suitable for partitioned catalogs, such as "men's clothing area" "accessories area" and so on.

Step 4: Setting up a responsive display

Lookbook pages tend to be more image-heavy and hotspot-intensive, somobileAdaptation is very critical. We recommend you to switch to "Tablet" and "Mobile" view at the top of the editor and check each module one by one if it is displayed correctly. Especially the position of the hotspot, which sometimes needs to be fine-tuned on small screens.

Step 5: Add navigation buttons or breadcrumbs

To improve the page hopping experience, you can add a "Back to Mall" or "View All Products" button at the top of the page to prevent users from getting lost after browsing the Lookbook.

If WoodMart'sbreadcrumb navigation(Breadcrumb), the Lookbook page is recommended to be placed in theMain navigation menumiles, making it easier for visitors to discover.

Step 6: Publish and test the jump link

After finishing the page content, click "Publish" and then preview the effect in the frontend.

Focus on checking the following points:

• Whether each hotspot is jumping correctly
• Does the image load smoothly
• Whether the page is displayed clearly on mobile

Tip: How to Increase Lookbook Conversions?

• Add "Buy Now" at the bottom of each picture.buttonsor link
• Add Time LimitPromotional Labels(e.g., "new products", "hot", "limited time discount")
• Use a Lookbook page with social media lead generation to entice users to click through

summarize

Creating a Lookbook page in WoodMart is not complicated, the key lies in the visual design and product linkage. Prepare quality materials and make good use of hot features and product links to give your brand a more professional look and feel, as well as to boostconversion rateThe

If you want to create more complex Lookbook effects, such as horizontal slides, video backgrounds,pop-up windowThe WoodMart theme also provides strong support for purchases and more.

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: info@361sale.com
④ Working hours: Monday to Friday, 9:30-18:30, holidays off