The Porto Single Product Builder allows you to design custom single product pages easily and flexibly using Elementor or WPBakery Page Builder.
With a drag-and-drop interface and 19 dedicated product elements, you can build any layout for your product page — from images and titles to tabs and related products — without writing a single line of code.
Just like Porto’s Header and Footer Builder, this feature revolutionizes eCommerce page design with full creative control.
Available Single Product Builder Elements Include
- Product Image – Displays the main product image and gallery. Multiple layout styles are available: Default, Extended, Grid Images, Thumbs on Image, List Image, Left Thumbs 1, Left Thumbs 2.
- Product Title – Displays the product title.
- Product Rating - Shows the product’s average customer rating.
- Product Price – Displays the product price dynamically.
- Product Excerpt – Shows a short summary or teaser for the product.
- Product Description – Displays the full product description.
- Product Add to Cart – Displays the Add to Cart button and quantity selector.
- Product Meta – Shows product metadata such as SKU, categories, and tags.
- Product Tabs – Displays WooCommerce tabs like Description, Additional Information, and Reviews.
- Linked Products – Displays related, compare, cross and upsell products.
- Prev and Next Navigation – Adds navigation buttons to move between products.
- Sticky Add to Cart – Keeps the Add to Cart bar visible while scrolling.
- Product Attribute Table – Displays a structured table of product attributes.
- Product Review – Shows the customer review section.
- Product Share – Adds social media sharing buttons.
- Product Notice – Displays an Add to Cart notification or other product alerts.
- Product Wishlist – Adds a Wishlist button (compatible with YITH Wishlist plugin).
- Product Compare – Adds a product Compare button (compatible with YITH Compare plugin).
- Product Hooks (Deprecated) – Displays WooCommerce hooks like
woocommerce_before_single_product_summary,woocommerce_single_product_summary, andwoocommerce_after_single_product_summary. (Use new elements instead.)
Note: Porto’s Single Product Builder elements are only rendered when used inside Single Product Blocks, not in regular pages or templates.
Additional Features
| Feature | Description |
|---|---|
| Drag and Drop Interface | Build product pages visually using Elementor or WPBakery — no coding required. |
| Flexible Layout Options | Combine and arrange elements freely to match your design goals. |
| Dynamic WooCommerce Integration | Product data (title, price, image, etc.) is pulled automatically from WooCommerce. |
| Multiple Image Styles | Choose from a variety of image layout types for different visual experiences. |
| Performance Optimized | Porto’s builder is lightweight and optimized for fast loading. |
| Responsive Controls | Fully customizable for desktop, tablet, and mobile devices. |
| Template Assignment | Assign different product templates to specific products or categories. |
| Future-Ready Architecture | Built to remain compatible with upcoming WooCommerce and Porto updates. |
