How to Embed Dribbble Shots on Your Shopify Store Using EmbedAny App

How to Embed Dribbble Shots on Your Shopify Store Using EmbedAny App

Want to showcase beautiful design work from Dribbble on your Shopify store? Whether you’re highlighting your own design portfolio or featuring inspiration that matches your brand aesthetic, embedding Dribbble shots can add visual appeal to your product pages, blogs, or homepage.

This guide shows you how to embed any Dribbble shot or collection on your Shopify store in just a few simple steps - no coding required!

What You’ll Need

  • A Shopify store
  • The EmbedAny app installed
  • Dribbble content you want to embed (shot URL)

Step-by-Step Instructions

1. Install the EmbedAny App

If you haven’t already, install the EmbedAny app from the Shopify App Store.

2. Find the Dribbble Content You Want to Embed

Visit Dribbble and locate the specific shot or collection you want to display on your Shopify store. This could be:

  • A single design shot
  • A collection/project
  • A designer’s profile

3. Copy the URL

Click on the specific Dribbble content you want to embed and copy the full URL from your browser’s address bar. It should look something like:

  • https://dribbble.com/shots/12345678-amazing-design
  • https://dribbble.com/designer/collection-name

Now, go to your Shopify admin and navigate to the page where you want to embed the Dribbble content. This could be:

  • A product description
  • A blog post
  • A custom page

Using the rich text editor, paste the Dribbble URL and then italicise it. You can italicise by:

  • Highlighting the URL and clicking the italic button (usually an I icon)
  • Or using keyboard shortcuts: Ctrl+I (Windows) or Cmd+I (Mac)

5. Save Your Changes

After italicising the URL, save your changes to the page. The plain link will now transform into a fully interactive Dribbble embed when your page loads!

Example Use Cases

  • Showcase your own design work on your “About Us” page
  • Display complementary design concepts on product pages
  • Feature design inspiration on your blog posts about product development
  • Embed your design portfolio in your brand story

Troubleshooting Tips

  • Make sure the Dribbble URL is complete and correct
  • Confirm the URL is properly italicised in the editor
  • Check that EmbedAny is activated on your store
  • Remember that the embed will only appear on the live site, not in the editor

By incorporating Dribbble content into your Shopify store, you can enhance your visual storytelling and provide customers with a richer, more engaging shopping experience.

More guides
How to Embed Elfsight Widgets on Shopify - The Ultimate Guide
Learn how to easily embed Elfsight widgets on your Shopify store using EmbedAny. This step-by-step guide will show you how to add Elfsight widgets to your Shopify product pages, blogs, and more without any coding knowledge.
How to Embed dbdiagram.io in Your Shopify Store with EmbedAny
A step-by-step guide on embedding database diagrams from dbdiagram.io onto your Shopify store using the EmbedAny app. No coding required.
How to Embed Crowdsignal Polls and Surveys on Your Shopify Store
Learn how to easily embed Crowdsignal polls, surveys and quizzes on your Shopify store using EmbedAny - no coding required! Add interactive feedback forms to engage customers and gather valuable insights.
How to Embed eduMedia Content on Shopify Using EmbedAny
A step-by-step guide to embedding interactive eduMedia resources on your Shopify store without coding using the EmbedAny app
How to Embed DKN.TV Videos on Your Shopify Store Using EmbedAny
A complete guide to embedding DKN.TV videos on your Shopify store without any coding knowledge using the EmbedAny app.
How to Embed Berliner Morgenpost on Your Shopify Store with EmbedAny
A simple step-by-step guide to embedding Berliner Morgenpost articles and content on your Shopify store using EmbedAny - no coding required.