✏️ Update Dec 2025: We've changed our look so examples may differ from what's available in the toolkit.

Sellar Toolkit

This includes

Brand Guidelines for Makers
Sellar Button
Sellar Credit Assets - Grow sales using Sellar Credit
Logos & Fonts
Examples of Supplier QR code us

Example:

Correct use on Instagram, Instagram Stories and LinkedIn will lead to be shared on Sellar's social media.

Sellar Button

No Opening Order Fees - Prospects that click on your Sellar Button and place an order within 28 days will be protected from incurring Opening Order Fees, even if they are not in your Sellar Customer List.
High conversion rate - Using the Sellar Button on your website has been measured to convert +26% more website visitors into sales.

Adding to your website

Simply adding our button photo and your strorefront link to your website will convert customers without opening order fees.

Download a copy of the button image from the example above or from our brand assets.
Add this image to your website, commonly under your Trade page.
Add a hyperlink to this image; you will want to use your storefront link.

Adding a code block to your website

If you want to include all the information about Sellar but keep your website style, you can use our code block

Copy our Code Block below and paste this into a 'code block' on your website. (See below a quick guide on how to do this on popular website editors)
Copy your storefront link, you will need this to replace a part in our code block.
Replace the 'enter your link here' text with your storefront link.
Publish your website.

Code Block

<!DOCTYPE html>

<html xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml" lang="en-GB" >

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <style>

        .sellar-wrapper {

            text-align: center;

            padding-top: 20px;

            padding-bottom: 20px;

            background-color: var(--background-color, #ffffff);

            color: var(--text-color, #000000);

        }

        .sellar-wrapper .sellar-component {

            max-width: 600px;

            margin: 20px auto;

            padding: 20px;

            border: 1px solid var(--border-color, #ddd);

            border-radius: 8px;

            background-color: var(--component-bg-color, #f9f9f9);

        }

        .sellar-wrapper .sellar-component h3,

        .sellar-wrapper .sellar-component p,

        .sellar-wrapper .sellar-info h4 {

            margin-bottom: 20px;

        }

        .sellar-wrapper .sellar-component p {

            font-size: 16px;

            margin-bottom: 5px;

            max-width: 90%;

            margin: 0 auto 5px;

        }

        .sellar-wrapper .sellar-button {

            display: block;

            margin: 20px auto;

        }

        .sellar-wrapper .sellar-button img {

            max-width: 100%;

            height: auto;

            display: block;

            margin: 0 auto;

            padding: 25px;

            box-sizing: border-box;

        }

        .sellar-wrapper .sellar-info {

            display: flex;

            justify-content: center;

            flex-wrap: wrap;

            gap: 10px;

        }

        .sellar-wrapper .sellar-info ul {

            list-style-type: none;

            padding: 0;

            margin: 0;

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: 10px;

        }

        .sellar-wrapper .sellar-info li {

            padding: 10px 20px;

            border: 1px solid var(--border-color, #ddd);

            border-radius: 20px;

            box-sizing: border-box;

            background-color: var(--pill-bg-color, #ffffff);

        }

        @media (max-width: 1024px) {

            .sellar-wrapper .sellar-info {

                display: none;

            }

            .sellar-wrapper .sellar-component p {

                max-width: 95%;

            }

        }

    </style>

</head>

<body>

    <div class="sellar-wrapper">

        <div class="sellar-component">

            <h3>Want to stock our beers?</h3>

            <p>Trade customers can access our full product range, directly from us through Sellar. Click on the button below to view our availability.</p>

            <a href="enter your link here&utm_source=supplier-website&utm_medium=button&utm_campaign=sellar-button-supplier-website" class="sellar-button" target="_blank">

                <img src="https://storage.googleapis.com/sellar-partner-images/sellar-image-assets/email-assets/order-from-us-on-sellar.png" alt="Sellar Button">

            </a>

            <div class="sellar-info">

                <ul>

                    <li>Full product availability</li>

                    <li>Local direct delivery</li>

                    <li>Nationwide delivery</li>

                </ul>

                <ul>

                    <li>Pay by bank or card</li>

                    <li>Invoice history</li>

                    <li>Instant messaging</li>

                </ul>

            </div>

        </div>

    </div>

</body>

</html>