Getting Started
Before building your site, better take a look at this section.
Before building your site, better take a look at this section.
You need to have a WordPress installation on your website to use our theme.
General steps to install WordPress CMS to your site
Here is the list of useful links to install WordPress CMS
Sometimes you may get some errors while installing our theme, importing content, or activating plugins like white screen or PHP errors. They may be caused by low PHP configurations limits. In this case, you need to increase some values. You can do this on your own or contact your hosting provider with the following requirements:
You can control the theme’s functionality and customize theme’s content from. Here you will find all relevant settings to customize the theme.
Follow these steps to upload, install, and activate your theme using the WordPress admin dashboard.
1. Log in to your WordPress Dashboard.
2. Navigate to Appearance > Themes.
3. Click on the Add New button, then select Upload Theme.
4. Choose the theme .zip file from
your computer.
5. Click Install Now to begin the installation.
6. Once the installation is complete, click Activate to enable the
theme on your site.
Installing a WordPress theme via FTP or cPanel File Manager is a useful method when facing file upload limitations or dashboard-related issues.
Prerequisites:
FTP client (such as FileZilla)
FTP credentials (host, username, password, port)
Theme .zip file downloaded to your computer
Steps:
Extract the Theme File
Unzip the downloaded .zip theme file on your computer.
You will get a folder (e.g., Woomen) containing the theme files.
Connect to Your Website via FTP
Launch FileZilla (or any FTP client).
Enter your FTP details and connect to the server.
Navigate to the Themes Directory
Open the folder path:public_html/wp-content/themes/
Upload the Theme
Upload the extracted theme folder into the themes directory
Activate the Theme
Log in to your WordPress dashboard.
Go to Appearance > Themes
Locate your theme and click Activate.
Woomen comes integrated with several essential plugins and tools to enhance the theme’s capabilities. Below is a breakdown of the plugins used and how to install them.
Here are the main plugins used with the Woomen theme:
Elementor is a powerful drag-and-drop page builder that allows users to design complex layouts visually. It eliminates the need for coding and supports a wide range of widgets, design features, and integrations through additional add-ons.
CubeWP Framework is a dynamic content framework for WordPress designed to streamline the development process by up to 90%. It supports advanced dynamic content structures and is ideal for developers and content-heavy websites.
Learn more
CubeWP Forms is a extension for the CubeWP Framework that lets you easily build simple to very advanced forms including contact forms, lead forms, feedback forms, appointment request forms, and newsletter subscription forms (MailChimp integration) for your website using a drag-and-drop form builder and manage all the leads from WordPress backend.
CubeWP WooCommerce Addon is a CubeWP extension that enables you to create post type submission forms, such as “Submit a Product” or “Submit a Post.”
The Woomen Addon is the core companion plugin developed specifically for the Woomen theme. It is required for the theme to function fully and unlocks essential features that enhance the flexibility and customization options of your website.
One of the primary features of the Woomen Addon is its ability to allow users to create and customize Post Card Styles. These styles are pre-designed layouts used to display content (such as blog posts, products, or custom post types) in a visually appealing “card” format.
WooCommerce empowers you to build, sell, and grow on your terms. Our WordPress-powered platform offers fully customizable ecommerce, for less
Woo Merchant is a modular and feature-rich WooCommerce enhancement plugin designed to optimize the performance, functionality, and user experience of your online store. It offers a collection of over 15+ free modules that you can enable or disable based on your store’s specific needs.
The main goal of the Woo Merchant plugin is to help store owners:
Increase conversion rates
Improve user engagement
Enhance the overall shopping experience
Reduce cart abandonment
Add advanced eCommerce functionalities without relying on multiple separate plugins
NextWP Sites is a powerful demo importer plugin integrated with the Woomen Theme to help users quickly and easily set up their website by importing ready-made demo content.
The primary purpose of NextWP Sites is to allow users to import pre-built demo websites with just a few clicks. These demo sites are professionally designed and come with all the necessary pages, templates, images, and settings. This helps you get started faster by providing a fully designed website that you can customize to suit your needs.
This plugin extends Elementor’s core functionality by adding extra widgets, design elements, and layout options. It provides greater flexibility when designing custom sections and enhances the overall design process.
After completing the theme installation, you will see a prompt notification indicating that required plugins need to be installed. Simply follow the prompt and select the option to install the plugins. All the necessary plugins are pre-packaged with the theme, so they will be installed automatically in one click.
NextWP is a WordPress plugin designed to help you set up your website quickly and efficiently. One of its key features is the Demo Import functionality, which allows you to import fully designed demo content with just a few clicks. This gives you an instant preview of the site’s layout, structure, and design, making it easier to understand how the theme works and how to customize it to your needs.
Note: After activating the theme, you will be automatically redirected to the demo importer
screen. Click “Get Started” to begin the process.
Alternatively, you can access the importer manually by following these steps:
1. Go to your WordPress Dashboard > Woomen.
2. In the importer interface, follow these steps:
o Step 1: Install all required plugins when prompted.
o Step 2: Select the demo you wish to import from the available options.
o Step 3: Click to proceed with the demo import. This process may take several minutes depending on your server speed—please be patient.
Once the import is complete, your site will be populated with the selected demo content.

The CubeWP Theme Builder is a dynamic design tool that allows you to create and manage custom templates for various sections of your website—without needing to write code. It’s deeply integrated with CubeWP’s core functionality, making it ideal for building advanced, data-driven websites.
You may locate it from WordPress dashboard> CubeWp> Theme Builder.
Using the CubeWP Theme Builder, you can create templates for:
Header – Design unique header layouts for different pages .
Footer – Customize your site’s footer with flexible layout options.
Single – Build detailed single post page layouts.
Archive – Customize how your category, tag, or listing archives look.
Hooks – Add content into predefined locations throughout your theme (before/after content, inside loops, etc.).
Shop – If integrated with WooCommerce, you can design product, cart, or shop templates.
Mega Menu – Build advanced navigation menus with columns, images, or post grids.
404 Page – Design a fully custom “Page Not Found” experience.
The CubeWP Theme Builder gives you complete design freedom and works seamlessly with dynamic content fields, making it ideal for directory sites, listing platforms, and other advanced use cases.
The CubeWP Theme Builder is a dynamic design tool that allows you to create and manage custom templates for various sections of your website—without needing to write code. It’s deeply integrated with CubeWP’s core functionality, making it ideal for building advanced, data-driven websites.
You may locate it from WordPress dashboard> CubeWp> Theme Builder.
Using the CubeWP Theme Builder, you can create templates for:
Header – Design unique header layouts for different pages .
Footer – Customize your site’s footer with flexible layout options.
Single – Build detailed single post page layouts.
Archive – Customize how your category, tag, or listing archives look.
Hooks – Add content into predefined locations throughout your theme (before/after content, inside loops, etc.).
Shop – If integrated with WooCommerce, you can design product, cart, or shop templates.
Mega Menu – Build advanced navigation menus with columns, images, or post grids.
404 Page – Design a fully custom “Page Not Found” experience.
The CubeWP Theme Builder gives you complete design freedom and works seamlessly with dynamic content fields, making it ideal for directory sites, listing platforms, and other advanced use cases.
In the Woomen Theme, the header and footer are not just static sections—they are fully Elementor-friendly, giving you complete creative freedom. This means you can design, customize, and style these areas visually without touching a single line of code.
Your header is the first impression, guiding users to the most important parts of your site, while the footer acts as a strong finishing touch, providing quick links, contact information, and essential details. With Elementor integration, you can make these sections dynamic, responsive, and brand-focused, ensuring a consistent and professional look across all pages.
To help you get the most out of header and footer customization, we’ve prepared these detailed resources, Please read out the below articles:
To create and configure a mega menu using CubeWP Theme Builder, follow these steps:
1. Go to your WordPress Dashboard > CubeWP > Theme Builder.
2. Click on Add New Template. A popup window will appear with configuration options.
3. In the popup:
o Template Type: Select Mega Menu.
o Template Name: Enter a name for your mega menu.
o Display On: Choose whether you want the mega menu to appear across the entire site or only on specific pages.
4. Click Save and Edit.
You will be redirected to the Elementor editor, where you can design your mega menu using multiple columns, widgets, icons, images, and any other content. This flexible layout allows for advanced, user-friendly navigation structures.
To add your newly created mega menu to the header or a specific page:
1. Watch this tutorial video to learn how to design a mega menu in Elementor:
(Embed or link your video here)
2. Open the header or the page where you want to display the mega menu using Elementor.
3. Add the “CubeWP Mega Menu” widget.
4. Select the mega menu you created from the dropdown options.
This allows you to insert your custom mega menu anywhere within your layout — including headers, footers, or specific pages.
In a WooCommerce store using the Woomen theme, a Wishlist is a feature that allows customers to save products they like for later
purchase, without adding them to the cart immediately. It’s similar to a
“favorites” or “saved items” list on other e-commerce
platforms.
If you want to place a Wishlist link in the header or any other section of your
site, follow these steps:
1. Edit the RequiredSection
o Go to your WordPress dashboard.
o Open the page or template you want to edit using Elementor (e.g., the header template).
2. Add an Icon or Text Element
o In Elementor, drag and drop an Icon or Text widget to the desired location (such as the header).
3. Assign the Wishlist Link
o Select the element you just added.
o In the Link field, click the Dynamic Tags icon.
o From the options, choose Custom URL.
o Enter the URL of your wishlist page (e.g., /wishlist or the full page URL).
4. Update the Changes
o Click Update in Elementor to save your changes.
A navigation menu in WordPress (and in your Woomen theme) is the set of links (Home, Shop, Blog, Contact, etc.) usually shown in the header, footer, or sidebar of a website. It helps users navigate your site easily.
A collection of links to important pages, posts, categories, or custom URLs.
Usually appears in the header (main menu), but can also be placed in the footer or sidebar.
Supports dropdowns / submenus for organizing content hierarchically.
Log in to WordPress Admin
Go to yourdomain.com/wp-admin
Go to Menu Settings
In the left sidebar → Navigate to Appearance > Menus.
Create a New Menu
Click Create a new menu.
Give it a name (e.g., Main Menu, Footer Menu).
Click Create Menu.
Add Items to Menu
On the left side, you’ll see options: Pages, Posts, Custom Links, Categories.
Select the pages (like Home, Shop, Blog, Contact) and click Add to Menu.
Arrange items by dragging & dropping.
You can nest items under another to create a dropdown menu.
Assign Menu to Location
Scroll down to Menu Settings > Display Location.
Woomen theme usually has locations like Primary Menu, Top Menu, Footer Menu.
Check the location where you want this menu to appear (e.g., Primary Menu for header).
Save Menu
Click Save Menu.
Login functionality is a core component of most modern websites, applications, and digital platforms. It serves as a secure access point for users, ensuring that only authorized individuals can access certain resources, features, or information. In simple terms, login functionality is the process through which a user authenticates themselves to gain access to a system.
Edit the Header Template
Go to your WordPress Dashboard > Templates > Theme Builder > Header (or wherever your header template is located).
Click Edit with Elementor.
Add the Login Element
In the Elementor editor, locate the section where you want the Login option to appear.
Drag and drop a Login widget (Valuepack addon).
Before creating or displaying a signup form, make sure user registration is enabled in your WordPress settings:
Go to WordPress Dashboard
Navigate to Settings > General.
Enable Registration
Under the Membership section, check the box labeled:
“Anyone can register”.
Set Default Role (Optional)
From the dropdown labeled New User Default Role, select the appropriate role for new users (usually Subscriber or Customer for WooCommerce sites).
Save Changes
Click Save Changes to apply your settings.
The Woomen Theme provides two easy methods to display your logo in the website header. You can either use the Site Logo (dynamic option) or upload a Custom Logo directly in your header.
Go to your WordPress Dashboard.
Navigate to:
CubeWP > Settings > General
Upload your logos for:
Homepage Logo
Inner Pages Logo
Now edit your header with Elementor:
Drag and drop the Image widget into your header section.
Click on the Dynamic Tags option.
Choose Site Logo.
This method ensures that your uploaded logos are automatically applied wherever the site logo is used.
Edit your header with Elementor.
Drag and drop the Image widget into your header section.
Upload your desired logo image directly from the media library.
This method is useful if you want a different logo than the site-wide logo.
To create and configure a custom header using CubeWP Theme Builder, follow these steps:
You will be redirected to the Elementor editor. Here, you can design your custom header layout using sections, widgets, and any content elements of your choice. The design is fully flexible, allowing you to create unique headers tailored to your site’s needs.
A Pop Menu is an interactive menu that appears dynamically when a user clicks on a designated menu element in your website header. It allows you to showcase multiple organized lists, images, or categories in a stylish popup format.
In this guide, we’ll walk through the process of creating, designing, and assigning a Pop Menu using Elementor with the Woomen Theme.
Go to your WordPress Dashboard.
Navigate to WP Theme Builder.
Click Add New Template.
From the available template options, select Pop Up.
Name it (e.g., Pop Menu).
Enable Pop Menu functionality and make sure it’s displayed across the entire site for consistency.
Save your changes—you’ll be redirected to Elementor.
Once inside Elementor:
Add a Container and set it to Full Width.
Insert a Tabs Element to create menu sections (e.g., Shoes, Jeans, Shirts, Trousers).
Adjust settings to:
Position tabs (top, side, or bottom).
Align them (e.g., center).
Customize width, spacing, and line titles.
Set background colors (normal, hover, and active states).
Customize title colors for each state.
Adjust typography (font size, style, line height, spacing).
For each tab, you can add different elements:
Images: Showcase product visuals (e.g., add a shoe image in the Shoes tab).
Lists: Display item features or categories (e.g., Italian handmade shoes, Quality leather).
Headings: Label each section (e.g., “Quality”).
Containers: Organize layouts horizontally or vertically using flex settings.
This flexibility lets you build a visually engaging, fully functional pop menu.
To ensure good UX, add a Close Button:
Insert an Icon Widget (e.g., window close icon).
Adjust size, color, and margin.
Position it at the top (left or right as preferred).
Edit your Header with Elementor.
Select the designated Menu Button where the pop menu should open.
Go to the Advanced Tab → Add CSS ID.
Now, go back to your Pop Menu template:
Open Post Settings → Pop-up Options.
Choose Trigger Method (e.g., On Click).
Select Position (e.g., Top Left).
Copy the generated Pop-up Trigger ID.
Replace the existing CSS ID in your header with this new ID (make sure to remove the # symbol).
Save & Publish.
Refresh the Front-End Page.
Click the menu button → Your newly created Pop Menu should now appear.
Check that images, lists, and headings display properly.
Verify the Close Button works.
Adding a search bar to your website header improves navigation and user experience. Follow these steps to insert and customize a Product Search Bar using the VP ValuePack Addon:
Navigate to your WordPress Dashboard.
Go to Templates > Theme Builder > Header (or select your header template).
Click Edit with Elementor.
In the Elementor editor, open the Elements Panel.
Locate the Product Search (VP ValuePack) widget.
Drag and drop the widget into the desired section of your header (e.g., next to the logo or menu).
After placing the element, click on it to open Widget Settings in the left panel.
Under Style Options, you will find 5 available styles for the search bar.
Select the style that best matches your website design.
Use Elementor’s padding, margin, and alignment controls to position the search bar correctly.
Adjust font, color, and spacing as needed to match your branding.
Once you are satisfied with the design, click Update.
Refresh your site to see the search bar live in the header.
To create and configure a custom footer using CubeWP Theme Builder, follow
these steps:
1. Navigate
to your WordPress Dashboard > CubeWP > Theme Builder.
2. Click
on Add New Template. A popup will appear prompting you to
configure the template settings.
3. In
the popup:
o
Template Type: Select Footer.
o
Template Name: Enter a name for
your footer template.
o
Display On: Choose where you
want this footer to appear — either across the entire site or
on specific pages. (You can create multiple footer templates
to display different footers on different pages.)
4. Click
Save and Edit.
You will be redirected to the Elementor editor. Here, you can design your custom footer layout using sections, widgets, and any content elements of your choice. The design is fully flexible, allowing you to create unique footers tailored to your site’s needs.
The Home Page is built using Elementor, combining:
Default Elementor widgets
CubeWP elements
Value Pack Addons
Below is the breakdown of essential components on the homepage:
A Banner Slider is an engaging and interactive element used to display a series of promotional images, product highlights, or key announcements in a rotating slideshow format on your website’s homepage. This feature is implemented using the Value Pack Addons plugin—an essential tool that enhances the functionality of your WordPress site without requiring any advanced coding skills.
The Value Pack Addons plugin offers a collection of powerful widgets and elements, among which the Banner Slider is one of the most widely used. It enables you to effectively promote featured products, seasonal campaigns, or special offers, making your homepage more dynamic and visually appealing.
Incorporating a Banner Slider on your homepage helps you:
This feature is a valuable addition for any site looking to improve user experience while showcasing important content in a professional and attractive manner.

.
Here is the video to learn how to make the slider:
Please watch the video below to learn the complete procedure.
WooCommerce offers different product types to suit a wide range of selling
needs. Two of the most commonly used types are Simple Products
and Variable Products.
A Simple Product is a standalone item with no variations. It comes with a single price, SKU, and inventory.
Examples:
· A book
· A USB cable
· A digital download file
1. Go to your WordPress Dashboard > Products > Add New
2. Enter the Product Title and Description
3. Scroll to the Product Data section and choose Simple Product
4. Add:
o Price
o SKU (optional)
o Inventory and stock status
o Product Image and Gallery
5. Click Publish
A Variable Product allows you to sell a single product with multiple options or variations, such as different sizes, colors, or materials. Each variation can have its own SKU, price, and stock status.
Examples:
· A t-shirt in multiple sizes and colors
· A phone case in different materials
· Shoes in different sizes
1. Go to Products > Add New
2. Enter the Product Title and Description
3. In the Product Data dropdown, select Variable Product
1. Go to the Attributes tab inside the Product Data box
2. Click Add (e.g., Size, Color)
3. Add attribute values separated by | (e.g., Small | Medium | Large)
4. Check “Used for Variations” and click Save Attributes
1. Navigate to the Variations tab
2. Click “Add Variation” or select “Create variations from all attributes”
3. Set:
o Price
o SKU
o Stock status
o Image for each variation
4. Save Changes
5. Finally, click Publish
Elementor makes it easy to showcase variable products on your pages using the Product Variations widget. This feature allows you to visually highlight specific WooCommerce variable products with customizable styles and layouts.
1. Open your page in Elementor Editor.
2. In the left sidebar, search for the widget named “Product Variations”.
3. Drag and drop the Product Variations widget onto your page.
4. In the widget settings, you’ll see an option to Add Product IDs.
This is where you enter the ID(s) of the variable product(s) you want to display.
You can find a product’s ID in two ways:
1. Go to your WordPress Dashboard > Products.
2. Click Edit under the product you wish to use.
3. In the browser’s address bar, look for the post parameter in the URL:
In this example, 14331 is the Product ID.
1. Go to WordPress Dashboard > Products.
2. Hover your mouse over the desired product.
3. Below the product title, you’ll see the Product ID displayed as:
· Make sure the product you enter is a Variable Product.
· Only enter the numeric Product ID, separated by commas if showing multiple.
This guide explains how to display Instagram posts (feeds) on your website using an access token and Elementor. By following these steps, you’ll be able to showcase either your full Instagram feed or posts by a specific hashtag.
To connect your Instagram account with your website, you’ll first need to
create an Access Token. This token authorizes your site to
fetch your Instagram content.
Follow one of the tutorials below to generate your token:
1- Official Facebook Developer Guide
2- Bricks Builder Instagram Access Token Guide
Once the token is generated, keep it safe — you’ll need it in the next step.
Please go to your WordPress dashboard> CubeWp> Settings> Insta Feeds>Enter the Instagram access token here.
Now that you have your access token, it’s time to embed the feed on your desired page.
1. Open your WordPress Dashboard
2. Navigate to Pages and select the page you want to edit (e.g., Home Page)
3. Click Edit with Elementor
4. From the Elementor sidebar, drag the “Instagram Feed” widget onto your page
In WooCommerce, Brands are a default taxonomy that allows you to categorize products by their brand name. With the Woomen theme and Elementor, you can not only create and assign brands but also display them beautifully in a slider format on any page of your store.
This guide will walk you through:
Adding a new brand
Associating products with a brand
Displaying brand logos in a slider with Elementor
In your WordPress Dashboard, go to Products > Brands.
You will see existing brands listed here.
To add a new brand:
Enter the brand name (e.g., Louis Vuitton).
Set a slug (e.g., LV).
Click Add New Brand.
Your brand will be added successfully, but initially, it will not show any products.
You can either create a new product under a brand or assign an existing product to a brand.
Go to Products > Add New.
Enter product details such as name (e.g., Jeans), description, attributes, and shipping details.
Upload a product image and gallery images.
Select the appropriate category (e.g., Denim Jeans).
In the Brands taxonomy section, select the newly created brand (e.g., Louis Vuitton).
Publish the product.
Now, if you refresh the brand page, your new product will appear under that brand.
Go to Products > All Products.
Edit any product you want to assign to a brand.
Scroll to the Brands taxonomy section.
Select the brand (e.g., LV).
Update the product.
The product will now appear on the brand’s page.
If you want to showcase your brands as a slider on a page, follow these steps:
Open the page with Elementor.
Add a container where you want to display the slider.
To create spacing, use the Spacer widget above or below the container.
Set the container to Full Width.
Inside it, add another container (also full width).
Drag and drop the Image widget for each brand logo.
Upload your brand logo image.
Duplicate the widget to add multiple brand logos.
Select the main logo container, go to layout settings, and set Display: Flex to align logos in a single row.
Go to the Advanced Settings of the container that holds the images.
Enable the Slider option.
Choose how many logos to display per slide (e.g., 3).
Save your changes and refresh the page.
Your logos will now appear in a working slider.
In Elementor, select a logo image.
In the sidebar settings, go to Link > Custom URL.
Copy the brand page URL from your WordPress dashboard (Products > Brands > View) and paste it into the link field.
Repeat this for each logo.
Save changes and refresh the page.
Now, when visitors click on a brand logo, they will be redirected to the brand’s page showing all products under that brand.
The Product Comparison feature in WooCommerce allows customers to compare two or more products side by side. This helps users analyze features, prices, reviews, and other important details, making decision-making easier and faster.
In the Woomen Theme, this feature can be added to multiple sections of your store, such as:
Homepage
Shop Page
Product Detail Page
Saves time by allowing quick evaluations
Enhances user experience by simplifying choices
Boosts conversions by helping customers make confident purchase decisions
Go to your WordPress Dashboard.
Navigate to Pages > Product Detail Page.
Click Edit with Elementor.
Once the page loads, scroll to the section where you want to add the feature.
Add a new Container and set it to Full Width (or Boxed view if preferred).
Search for Product Comparison in Elementor widgets.
Drag and drop the Product Comparison widget into your container.
By default, the widget will load the product currently being viewed.
To add another product:
Go to WordPress Dashboard > Products.
Hover over a product to see its Product ID.
Copy the ID and paste it into the widget settings.
Example: Add ID 1180 to compare two products.
Image Comparison Option – Switch to “Image Comparison” if you want to compare images instead of products.
Titles & Labels – Edit product or image titles for clarity.
Styling Options:
Change text colors & typography
Adjust container height
Switch between Full Width or Boxed View
Replace or customize comparison icons (e.g., use arrows)
The default archive page in CubeWP is built to showcase a list of products or posts, equipped with essential browsing and filtering tools. By default, it features product images, search filters, sorting options, and a product grid. All these components can be easily managed from the WordPress admin panel.
Here’s the list of elements added on the shop page:
Static Images and Links
Filters Panel
Sorting Filter
Archive posts display
Additional Settings
Posts Per Page
In WooCommerce, the Shop Page serves as your online storefront. It showcases all your products in a catalog-style layout, allowing visitors to browse, filter, and sort items easily.
By default, WooCommerce automatically creates a Shop page during installation.
With the Woomen Theme, the Shop Page is further enhanced with advanced layout options, filters, banners, and customization features for a more engaging shopping experience.
Go to your WordPress Dashboard.
Navigate to CubeWP > Theme Builder.
Click Add New Template.
Select Shop Page and save it.
You will be redirected to Elementor, where you can start customizing the layout and design.
Please read the articles below to learn more about the elements of the Shop Page. You can also watch the Archive Page video for further guidance.
You can also add static images and custom buttons to the archive page for promotional or informational purposes.
These are fully customizable using Elementor, where containers are used to structure the layout.
Use the Image widget to insert visuals.
Use the Button widget to add clickable links.
You can define any URL in the button settings as needed.
Filters help users narrow down the search results based on specific attributes, making it easier to find relevant products on the archive or shop page. In CubeWP, you can create and display filters such as:
Color – Filter products by available color options.
Price – Allow users to select a price range.
Size – Show only items available in specific sizes.
Categories – Let users browse by product categories.
Create Filters:
Go to your WordPress Dashboard → CubeWP → Search Filters.
Click Add New and select the post type (e.g., Product, Listing) for which you want to create filters.
Add your desired filters (Color, Price, Size, Categories, etc.).
Display Filters on Archive/Shop Page:
Edit the archive or shop page using Elementor.
Drag and drop the CubeWP widget called “Search & Filters Form” onto the page.
In the widget settings, choose select form type as “Filters form” and select “Post type for which you want to show”
These dynamic filters will now appear on your archive page, allowing users to refine search results based on the options you’ve configured.
The Posts Per Page setting controls how many products or posts are displayed on each page of the archive or shop layout. This is essential for managing content load, improving user experience, and organizing your listings efficiently across multiple pages.
When you define a specific number of posts per page:
Only that number of items will be shown on a single archive page.
The rest will be accessible through pagination controls (e.g., next/previous page links or numbered pagination).
It helps reduce page load time by limiting the number of items shown at once.
The Sorting Filter allows users to rearrange the product or post listings on the archive page based on specific criteria. This improves the browsing experience by letting users control how content is displayed according to their preferences.
Newest: Displays the most recently published products or posts first.
Oldest: Shows the oldest products or posts first, based on publish date.
Title: Sorts items alphabetically by title (A–Z or Z–A, depending on configuration).
Random: Displays items in a random order with each page load—ideal for showcasing different content on each visit.
Best Match: Prioritizes results that best match the user’s search query (usually enabled when search terms are involved).
Price: Low to High: Sorts products by price in ascending order, showing the most affordable items first.
Price: High to Low: Sorts products by price in descending order, displaying premium or expensive items first.
Edit the archive or shop page using Elementor.
Drag and drop the CubeWP widget “Sorting Fields Display” onto the page.
The Archive Post Display widget in CubeWP allows you to show a list of posts, listings, or custom post types on your archive or search results page.
To display these posts:
Edit the page with Elementor.
Add the CubeWP widget called “Archive Post Display” from the widget panel.
This widget dynamically fetches and displays posts based on search queries, filters, or archive conditions.
You can customize the layout, design, and post elements (like title, image, meta info) within the widget settings.
This is essential for showing the actual search or archive results on the front-end in a styled and structured format.