> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.weblium.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Adding a product card element

If you are looking for a way to fit in a product to an existing block organically, try adding a product card as a separate element. It’s possible to do so in almost all the blocks in the editor, plus it allows certain flexibility in terms of the layout you get. 

# Adding a product card element to an existing block

1. Hover over a place in the block where you'd like to add a product card element and click on the "plus":

![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1051_mqkqnm.png)

2. Then, choose the **Product** element in the list:

![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1041-4_h51fei.png)

| ${color}[#1aa900](Tip:) You can star a Product element as your favorite for a quick access according to the instructions in the [Adding elements](https://help.weblium.com/en-us/article/adding-elements-1od52zn/) article.

3. Hover over the **Product** element and click on the "gear" at the top left corner: 

![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1052_1o41dxo.png)

4. In the **Product layout** choose the product you want to display:

![](https://storage.crisp.chat/users/helpdesk/website/fa84b4d83a50e800/template-1053_ea64py.png)

5. Once you are done adding products in the editor, make sure to [publish the site](https://help.weblium.com/en-us/article/publishing-a-site-tgxmch/) for the changes to take effect.