Skip to main content

Quick Start - Get your first badge live

Welcome to Snapp Trust Badges & Icons! This guide will help you create, customize, and publish your first trust badge in just a few minutes.

P
Written by Petras Nargela
Updated today

Step 1: Create a new badge

  1. Go to the Snapp Trust Badges app dashboard.

  2. Click the black Create new badge button on the right side of the screen.

Step 2: Choose a Template

  1. Choose badge type: You will see three main categories. Select the one that matches your goal:

    • Payment badges: A row of payment logos (like Visa, PayPal, Amex).

      • Best for: Placing in the Footer or under the Checkout button to show accepted payment methods.

    • Single banners: A single, large highlighted message (like "Free Shipping").

      • Best for: Placing on Product pages (above or below the Add to Cart button) to drive immediate conversion.

    • Icon block: A group of multiple guarantees (e.g., "Secure Checkout" + "Fast Shipping" + "30-Day Returns").

      • Best for: Providing a complete summary of your store's trust policies in one spot.

  2. Choose badge template: Browse the pre-made designs that appear below your selection.

  3. Click Create badge on the design you want to start with.

Step 3: Edit Content & Call to Action

You will start in the Content tab.

  1. Edit Text: Update the headings and paragraph text to match your brand or intent.

  2. Edit Icons: Click Select icon to choose from Snapp icons, Streamline icons, Payment icons, or upload your own.

  3. Call to Action: (Optional) Scroll to the bottom to make your badge clickable (e.g., link a banner to a specific collection or external page).

Step 4: Customize Design

  1. Switch to the Design tab in the top menu.

  2. Here you can fine-tune the visual look of your badge, including icon sizes, text colors, and spacing.

    • Make sure your colors contrast well with your store background.

  3. Want more details? Check out our dedicated guide on Design & Customization to learn about every styling option available.

Step 5: Set Location & Position

Switch to the Settings tab to choose where the badge appears.

Option A: Automatic Placement (Easiest)

  1. Under Place on page, select Product page or Cart page.

  2. Specify pages: (If "Product page" is selected) You can choose to show the badge on All products, or restrict it to specific products/collections using the options provided.

  3. Select position: Choose Above button or Below button to position the badge relative to your "Add to Cart" or "Checkout" button.

Option B: Custom Position (Advanced)

  1. Under Place on page, select Custom position.

  2. You will see two specific tools appear:

    • Badge ID: Copy this if you are using our App Block in the Shopify Theme Editor and it asks for an ID.

    • Code snippet: Copy this HTML code (<div class...) if you are manually pasting the badge into your theme code files.

Step 6: Targeting (Optional)

Before saving, you can control who sees this badge and where it appears.

  1. Geolocation Targeting:

    • Scroll down to Geolocation targeting.

    • Select Specific countries if you want to show this badge only to customers in certain regions (e.g., "Free Shipping" only for US customers).

  2. Page Targeting:

    • Under Specify pages (visible if Product Page is selected), you can restrict the badge to Specific products, Collections, or Tags.

    • Example: Use this to show a "Waterproof" icon only on your "Swimwear" collection.

Step 7: Save and Publish

  1. Click the Save button at the bottom (or Publish in the top right).

  2. Verify your badge:

    • Click the Live preview button (located above the badge preview area) to instantly open the specific page on your store.

    • OR manually navigate to your storefront in a new tab to see the badge in action.

Did this answer your question?