diff --git a/docs/dotjuice-elementor-tools-pro/getting-started.md b/docs/dotjuice-elementor-tools-pro/getting-started.md index cd8d223..d3ca19b 100755 --- a/docs/dotjuice-elementor-tools-pro/getting-started.md +++ b/docs/dotjuice-elementor-tools-pro/getting-started.md @@ -32,7 +32,6 @@ If a specific widget is missing: - [Woo Cart](widgets/woo-cart.md) - [Woo Quick View](widgets/woo-quick-view.md) - [Woo Custom Product Tabs](widgets/woo-custom-product-tabs.md) -- [Woo Add Product Tab](widgets/woo-add-product-tab.md) - [ACF Frontend Form](widgets/acf-frontend-form.md) ## Integrations diff --git a/docs/dotjuice-elementor-tools-pro/widgets/woo-add-product-tab.md b/docs/dotjuice-elementor-tools-pro/widgets/woo-add-product-tab.md deleted file mode 100755 index cae5f2c..0000000 --- a/docs/dotjuice-elementor-tools-pro/widgets/woo-add-product-tab.md +++ /dev/null @@ -1,27 +0,0 @@ -# Woo Add Product Tab - -Found in the Elementor panel under **Dotjuice → Woo Add Product Tab**. Requires WooCommerce. - -## How it works - -Place this widget on your Single Product template — it adds one additional tab to WooCommerce's existing native tabs (Description, Additional Information, Reviews), styled to match them automatically since it uses WooCommerce's own tab system. - -## Content settings - -| Setting | Default | What it does | -|---|---|---| -| **Tab Title** | "Additional Info" | The tab's label. | -| **Tab Content** | — | Rich-text content shown inside the tab. | -| **Tab Order** | 50 | Controls where this tab sits relative to WooCommerce's defaults (Description = 10, Additional Information = 20, Reviews = 30). The default of 50 places it after Reviews — lower numbers move it earlier in the tab order. | - -## Setting it up - -1. Add the widget to your Single Product Elementor Theme Builder template. -2. Set your tab title and content. -3. Adjust Tab Order if you want it positioned somewhere other than last. - -## Good to know - -- **If this widget is placed on a shared Single Product template** (which is the normal way to use Elementor Theme Builder — one template applying to every product), every product using that template shows the **identical** tab title and content. This widget doesn't support per-product dynamic content — if you need different tab content on different products, you'll need [ACF Frontend Form](acf-frontend-form.md) with a custom field, or a separate template per product. -- Only one tab per widget instance — add a second instance of this widget if you need two extra tabs. -- You won't see this tab live in the Elementor editor canvas — a placeholder note explains this; preview it by viewing an actual product page on the front end. diff --git a/docs/dotjuice-elementor-tools-pro/widgets/woo-custom-product-tabs.md b/docs/dotjuice-elementor-tools-pro/widgets/woo-custom-product-tabs.md index 7f383da..ab1146a 100755 --- a/docs/dotjuice-elementor-tools-pro/widgets/woo-custom-product-tabs.md +++ b/docs/dotjuice-elementor-tools-pro/widgets/woo-custom-product-tabs.md @@ -6,7 +6,7 @@ Found in the Elementor panel under **Dotjuice → Woo Custom Product Tabs**. Req Place this widget on your Single Product template — it replaces WooCommerce's entire tabs area with a fully rebuilt, restyled version, including desktop tabs that automatically convert to an accordion on smaller screens. -**Only need to add one extra tab to WooCommerce's existing tabs, without a full rebuild?** See the lighter-weight [Woo Add Product Tab](woo-add-product-tab.md) instead. +It covers everything from bolting on a single extra tab to a complete rebuild: keep or hide any of the default WooCommerce tabs, add as many custom tabs as you like, and control which products each custom tab appears on by taxonomy. ## Content settings — Tabs @@ -14,9 +14,31 @@ Place this widget on your Single Product template — it replaces WooCommerce's |---|---|---| | **Hide Tab Headings** | Off | Hides the heading text at the top of each tab panel (including WooCommerce's own "Reviews" heading). | | **Hide Description / Hide Additional Information / Hide Reviews** | Off each | Fully removes that specific default WooCommerce tab — not just visually, it won't render at all. | -| **Custom Tabs** | Empty | A repeater — add as many extra tabs as you need, each with: **Title**, **Content Type** (Text Editor or Elementor Template), **Content** (rich text, for Text Editor), and **Template ID** (for Elementor Template — see below). | +| **Custom Tabs** | Empty | A repeater — add as many extra tabs as you need, each with: **Title**, **Content Type** (Text Editor or Elementor Template), **Content** (rich text, for Text Editor), **Template ID** (for Elementor Template — see below), and a **Show On** rule to limit the tab to certain products (see [Showing a tab only on certain products](#showing-a-tab-only-on-certain-products)). | | **Accordion Below (px)** | 768 | The screen width below which tabs switch to an accordion layout. 768 suits tablet-portrait and below, 480 suits mobile-only, and 0 disables the accordion entirely (always shows tabs). | +## Showing a tab only on certain products + +Each custom tab has a **Show On** setting that controls which products it appears on, based on the product's taxonomy terms — categories, tags, brands, or attribute values. This means one Custom Product Tabs widget on your shared Single Product template can serve every product, while individual tabs appear only where they're relevant. + +**Show On** offers three modes: + +| Mode | What it does | +|---|---| +| **All products** *(default)* | The tab shows on every product — the normal behaviour. | +| **Only products with selected terms** | The tab shows *only* on products that have at least one of the terms you pick. | +| **All except products with selected terms** | The tab shows on every product *except* those with one of the terms you pick. | + +When you choose either of the restricted modes, a **Terms** field appears listing every term across your product taxonomies, each labelled by its taxonomy (for example "Category: Hoodies" or "Color: Maroon") so same-named terms stay distinguishable. Pick one or more; a product matches when it has **any** of the selected terms. + +**Example:** a "Made on Demand" tab that should only appear on your print-on-demand products — set **Show On** to *Only products with selected terms* and choose your print-on-demand category (or several categories at once). Every other product simply won't show that tab. + +A couple of things worth knowing: + +- This applies to **custom tabs only**. The default WooCommerce tabs (Description, Additional Information, Reviews) are controlled by their Hide toggles, not by taxonomy. +- The rule is respected in the Elementor editor preview too — so if the product being previewed doesn't match a tab's rule, that tab genuinely disappears from the preview. Set the rule last, or preview with a product that matches. +- If a tab's Terms list is left empty, the tab shows everywhere (an empty rule does nothing). + ## Adding an Elementor Template as a custom tab For a custom tab, choosing **Elementor Template** as the Content Type requires entering that template's numeric ID directly (rather than picking it from a list). To find it: @@ -37,10 +59,11 @@ For a custom tab, choosing **Elementor Template** as the Content Type requires e 1. Add the widget to your Single Product Elementor Theme Builder template. 2. Decide which default tabs to keep, and add any custom tabs you need. -3. Set your Accordion breakpoint based on how your theme handles tablets — 768px is a safe default for most sites. -4. Style the Tab Navigation and Panel sections to match your design, then move on to the Reviews section if you display product reviews. +3. For any custom tab that shouldn't appear on every product, set its **Show On** rule and pick the relevant terms. +4. Set your Accordion breakpoint based on how your theme handles tablets — 768px is a safe default for most sites. +5. Style the Tab Navigation and Panel sections to match your design, then move on to the Reviews section if you display product reviews. ## Good to know -- **If every tab ends up hidden**, nothing renders at all on the live product page — double check at least one tab (default or custom) is visible before publishing. +- **If every tab ends up hidden** (whether by the Hide toggles or by taxonomy rules) nothing renders at all on that product page — make sure at least one tab is visible for the products you're viewing. - Custom tab content using the Elementor Template option needs that template to already be built and published — this widget only embeds it, it doesn't create it. diff --git a/marketing/dotjuice-elementor-tools-pro/documentation/marketing/overview.md b/marketing/dotjuice-elementor-tools-pro/documentation/marketing/overview.md index b904190..51dc076 100755 --- a/marketing/dotjuice-elementor-tools-pro/documentation/marketing/overview.md +++ b/marketing/dotjuice-elementor-tools-pro/documentation/marketing/overview.md @@ -14,9 +14,8 @@ The free Dotjuice Elementor Tools plugin covers the everyday styling gaps in Woo **Woo Quick View** — lets shoppers preview a product in a popup without leaving your shop grid, triggered by a button that appears automatically across your product loops, complete with hover-preloading so the popup feels instant. -**Woo Custom Product Tabs** — a full rebuild of the WooCommerce product tabs area as a styleable desktop-tabs/mobile-accordion component, with the ability to add unlimited custom tabs and deep styling control down into your reviews and rating form. +**Woo Custom Product Tabs** — a full rebuild of the WooCommerce product tabs area as a styleable desktop-tabs/mobile-accordion component: add unlimited custom tabs, show or hide any custom tab per product by category, tag, brand or attribute, and style deep into your reviews and rating form. -**Woo Add Product Tab** — the lightweight option when you just need to bolt one extra tab onto the existing WooCommerce tabs, no rebuild required. **ACF Frontend Form** — let visitors edit Advanced Custom Fields content directly from the front end, using ACF's own native form interface, no admin access required. diff --git a/marketing/dotjuice-elementor-tools-pro/documentation/marketing/widgets/woo-add-product-tab.md b/marketing/dotjuice-elementor-tools-pro/documentation/marketing/widgets/woo-add-product-tab.md deleted file mode 100755 index e97715a..0000000 --- a/marketing/dotjuice-elementor-tools-pro/documentation/marketing/widgets/woo-add-product-tab.md +++ /dev/null @@ -1,17 +0,0 @@ -# Woo Add Product Tab - -Add one extra tab to your product page's existing tabs — no template rebuild required. - -## The problem it solves - -Sometimes you just need one more tab next to WooCommerce's Description, Additional Information, and Reviews — a sizing guide, a shipping note, a care instructions panel — without rebuilding the entire tabs section. - -## How it helps - -Woo Add Product Tab appends a single, fully-editable tab to WooCommerce's native tabs, with a title, rich-text content, and control over where it sits in the tab order — all visually, in a few clicks. - -## The result - -One extra tab exactly where you want it, without touching the rest of your product tabs setup. - -*Need to rebuild and restyle the whole tabs area, with multiple custom tabs and accordion support on mobile? See [Woo Custom Product Tabs](woo-custom-product-tabs.md).*