We've recently relaunched all three of our themes. Watch the launch video here.

Social proof

The Social Proof section displays a carousel of selected images and captions from your favorite social media posts. Instead of syncing to a feed, this section is a great way to curate specific social media post while having total control over how they're presented on your storefront.

Social proof section
Social proof section

Add a Social proof section

The Social proof section can be added to any template (except the Checkout). To learn more about Sections and Templates, see Shopify's OS2 Theme Editor manual.

  1. In your theme editor (Customize), select the Template you wish to edit from the dropdown menu in the top bar.

    Drop-down menu of page templates
    Drop-down menu of page templates
  2. Click + Add section and select Social proof from the Theme Sections list.

    Add section button
    Add section button
  3. (Optional.) Click and hold the ⋮⋮ drag icon to change the order of your sections:

    Shopify section drag handles
    Shopify section drag handles

Add posts

You can add up to 15 Post blocks with images that link to social media posts. Add a caption and the current number of likes to re-create the social media posts that you have curated specifically for your page.

  1. Click + Add Post and/or click on the Post block you wish to edit.

    This opens the Post block settings.

  2. Under Image, click Select image to add an uploaded image used in one of your social media posts.

    Your image will appear in its original orientation by default. There are no required image dimensions but a square orientation is ideal.

  3. Paste the full Link to the original social media post to make the entire image a clickable link.

    Make sure you copy the full URL, including https:// at the start. For example: https://instagram.com/abc123.

  4. (Optional.) Update the Number of likes of the original social media post.

    Social proof section with likes

    Note that misleading customers with fake numbers could fall under “unfair or deceptive acts or practices” in the FTC Act.

  5. Add a name or username to the Posted by field.

  6. Add the Caption text.

    Use the formatting buttons to add bold, italic, and linked text.

  7. Return to the list of your template sections in the sidebar and repeat this process until you've added all the Post blocks you need.

  8. (Optional.) Click and hold the ⋮⋮ drag icon to change the order of your Post blocks:

    Shopify content blocks drag handles
    Shopify content blocks drag handles

    Use the Remove block button in the block settings to remove a Post block entirely.

  9. Remember to click Save in the top-right corner.

Customize the Social proof section

The Social proof section settings are applied to all Post blocks. You can add a main Heading and Subheading, set the number of columns per row, change the shape and orientation of your images, and adjust the section colors.

  1. Click on the Social proof section.

    This opens the Social proof section settings.

  2. Use the Columns per row slider to adjust the number of posts per row, between 2, 3, or 4.

    On mobile, Posts are displayed one at a time.

  3. (Optional.) Change the Heading text displayed at the top of the section or leave the field blank to remove it.

    We recommended a short title of just a few words.

  4. (Optional.) Change the Subheading text or leave the field blank to remove it.

    We recommend two to three short sentences.

    Use the formatting buttons to add bold, italic, or linked text.

  5. Adjust the Max width of text of the section Heading and Subheading using the slider.

    Experiment with this setting to find a clean visual shape for your text.

  6. Select the Image aspect ratio to crop your images to appear Square, Landscape, or Portrait.

    The default Natural setting will display the original orientation of your image.

  7. Change the Like icon color from the default red.

    The like icon appears only when the Number of likes field has been filled.

  8. (Optional.) Enable the Alternate section color.

    See Spark's Color settings guide to learn how to create a secondary color scheme with alternate section colors.

  9. Remember to click Save in the top-right corner.

Social proof section settings

The following settings are found by clicking directly on the section title:

Configuration Settings

Columns per row

Use the slider to choose how many Post blocks should be displayed per row on desktop.

You can choose between 2 and 4 per row.

Heading

Change the heading text above the Social proof section. We recommended a short title of just a few words.

Leave the field blank to remove the section Heading.

Subheading

Change the subheading text to display below the heading. We recommend two to three short sentences.

Leave the field blank to remove the section Subheading.

Max width of text

Use the slider to adjust the maximum width of the section Heading and Subheading.

Experiment with this setting to find a clean visual shape for your text.

Image aspect ratio

Choose to crop your Post images to appear Square, Landscape, or Portrait.

The default Natural setting will display the original orientation of your images.

Like icon color

Change the color of the Like icon from the default red.

The like icon appears only when the Number of likes field has been filled.

Use alternate section color

Apply the alternate section colors as chosen in your Theme Settings.

See Spark's Color settings guide to learn how to create a secondary color scheme with alternate section colors.

Social proof block settings

The following settings are found by clicking directly on a Post block:

Configuration Settings

Image

Use the Select image button to add an uploaded image. Your image will appear in its original orientation by default. There are no required image dimensions but a square orientation is ideal.

Link

Add a link to the image.

Make sure you paste the full URL, including https:// at the start. For example: https://instagram.com/abc123.

Number of likes

Update the number of current likes on the original post.

Note that misleading customers with fake numbers could fall under “unfair or deceptive acts or practices” in the FTC Act.

Posted by

Add the social media handle or name of who posted the original image.

Caption

Add caption text to show below the post image.

Contact

🇨🇦 Fluorescent Design Inc.

Send us a message
  • Toronto OfficeMonday to Friday, 10am to 6pm ET
  • Victoria (B.C.) OfficeMonday to Friday, 10am to 6pm PT
  • Average Response Time~1 Business Day
* Excludes statutory holidays. All offices closed to the public.