> For the complete documentation index, see [llms.txt](https://ce-docs.keywordrush.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ce-docs.keywordrush.com/frontend/gutenberg-blocks.md).

# Gutenberg product blocks

The **CE Products** block displays your Content Egg products anywhere in a post — product cards, lists, grids, comparison tables, bestseller sections, and more. It produces the same output as the `[content-egg-block]` shortcode, but you edit it visually with a live preview.

{% hint style="info" %}
**Do not confuse it with Egg Blocks.**\
**Egg Blocks** are a separate collection focused on **structured editorial content** — intros, FAQs, key takeaways, pros and cons, verdicts, and similar article sections. Some Egg Blocks can also show product data, but they are a separate concept, documented separately.

[Egg Blocks — Introduction](/egg-blocks/introduction.md)
{% endhint %}

## Add the block

1. Add your products first — see [Add & manage products](/set-up-products/how-to-add-products.md).
2. Insert the **CE Products** block from the block inserter (under the **Content Egg** category).
3. Pick a **template** from the gallery that appears (sorted by most recently used).

<figure><img src="/files/ydey9Mg4xcA4JZqkugtg" alt="The CE Products block template gallery"><figcaption><p>Choose a template when you insert the block</p></figcaption></figure>

From the block **toolbar** you can switch the template (**Select Template**), toggle **Dark mode**, or refresh the preview.

## Choose which products show — Product Binding

In the sidebar's **Data Filtering** panel, the **Product Binding** control decides which products the block renders:

* **Filter** *(default)* — show products by module, group, or all:
  * **Include modules** / **Exclude modules**
  * **Product Groups**
  * **Products** — specific product IDs, comma-separated
  * **Limit** and **Offset**
* **Choose products** — search and pick **specific products**, shown in exactly the order you set.

<figure><img src="/files/qNFvEnDLTwDlVofzEp16" alt="The Data Filtering panel with the Filter / Choose products toggle"><figcaption><p>Filter by module/group/all, or choose specific products</p></figcaption></figure>

There's also a **Source Post ID** field — leave it empty to use the current post, or enter another post's ID to display products attached there.

## Display options

The **Display Options** panel controls presentation, independent of the data:

* **Visible / Hidden Elements** — show or hide individual fields (price, image, rating, button, badge, shipping, stock status, subtitle, and more).
* **Link Destination** — **Auto** (follow the global setting), **Prefer Merchant** (affiliate), **Prefer Bridge Page** (on your site), or **Both**.
* **Render via AJAX (async)** and **Lazy load** — load the block asynchronously, or only when it scrolls into view (lazy load requires async).

<figure><img src="/files/Wm4KoHjM4Te6P0qTjp6B" alt="The Display Options panel"><figcaption><p>Show/hide fields, choose the link destination, and control loading</p></figcaption></figure>

## Output customization

The **Output Customization** panel adjusts styling. Which controls appear depends on the template:

* **Columns** / **Columns (Small)** — for grid templates
* **Tabs Type** — tabs, pills, or underline, for grouped templates
* **Button Variant** and **Button Text**
* **Border** and **Border Color**
* **Title Tag** — `div` or `h1`–`h5`
* **Image Ratio** — 1x1, 4x3, 16x9, or 21x9
* **Columns Order** and **Start Number**

<figure><img src="/files/OUiQPswHv9NMEnuHtEat" alt="The Output Customization panel"><figcaption><p>Columns, buttons, borders, title tag, and image ratio</p></figcaption></figure>

## Data changing

The **Data Changing** panel adjusts the data itself:

* **Currency** — convert displayed prices to another currency.
* **Add Query Argument** — append a parameter to affiliate links (for example `tag=CUSTOM_TAG`) for your own tracking.

## Custom templates

Custom (theme) templates aren't available in the block's template gallery — apply them with a **shortcode** instead. Custom templates don't implement the block's sidebar controls, so they're used via `[content-egg-block]`: build one on the **Shortcode** tab of the product manager (or write it by hand) and set its `template` to your custom template.

See [How to create a custom template](/custom-templates/how-to-create-a-custom-template.md) and [Shortcode parameters](/frontend/shortcode-parameters.md).

## Full parameter reference

Every block setting maps to a `[content-egg-block]` shortcode parameter. For the complete list — including a few parameters not exposed in the block UI, such as `next` — see the [**Shortcode Parameters Guide**](/frontend/shortcode-parameters.md).

{% hint style="info" %}
**Not using Gutenberg?** [Content Egg shortcodes](/frontend/how-content-is-displayed.md) give the same product output on any post type, and work with most page builders including Elementor.
{% endhint %}
