How to add product(s) to a post

On top of your product collection, you can, of course, add a product in a regular post, using the hyperlink, embed, or the overlay methods.

Hyperlink method

There is an easy way to add a product overlay with a simple link, like this: Soon is a coming soon page template for Jekyll.

(click on the link to check the product overlay)

In the hyperlink example above, we have:

[simple hyperlink](https://gum.co/soon-jekyll)

to which we add this include:

{% include gumroad-link.html id="soon-jekyll" %}

Gumroad embed

You can easily embed a product from Gumroad within your site or page.

Suppose we have a Gumroad product: Supply, an e-commerce template for Jekyll + Gumroad, designed with Tachyons CSS by alternatyves.

To embed this product, we need to add a short include with the product id to our page or post. In this example, the ID is supply, so we add this include with that:

{% include gumroad-embed.html id="supply" %}

{% include gumroad-embed.html id="supply" %}

That will output the product directly on your page:

Gumroad Overlay

Here is how to add a Gumroad overlay to an image on your site:

<a href="https://gum.co/supply" class="no-underline pv2 grow db"><img class="w-100" src="{{site.baseurl}}/images/screenshot.png"></a>

{% include gumroad-overlay.html id="supply" %}

That will output

I want to use this theme!

Clicking on this image will prompt the Gumroad overlay on your page.

The overlay method lets users buy securely from Gumroad without leaving your site!