Want to display your latest Instagram posts on your Showit website? Embedding Instagram feeds is a great way to bring fresh, visual content to your site without constantly updating it manually. Whether you’re a photographer, coach, designer, or creative entrepreneur, showcasing your social presence can help build trust, increase engagement, and drive followers. Users can display various types of content, including image posts, to enhance the visual layout and engagement.
In this tutorial, we’ll walk you through how to add your Instagram feed to Showit using embed codes and social grid widgets — no tech stress required.
Why Add an Instagram Feed to Showit?
There are several advantages to integrating Instagram with your website:
- Your homepage stays dynamic and updated with fresh content.
- Visitors can get a feel for your brand and aesthetic at a glance.
- It encourages new visitors to follow you on Instagram.
- Visual storytelling builds trust and social proof.
Using an Instagram widget, you can easily integrate and customize the Instagram feed on your Showit website.
Now let’s look at how to make it happen.
Methods for Embedding Instagram in Showit
1. Use a Social Grid Widget (Recommended)
A third-party widget like SnapWidget, LightWidget, or Elfsight lets you create a customizable Instagram grid that updates automatically. Most offer free versions, and setup is straightforward. Users can adjust social grid settings to customize how Instagram posts are displayed on their website.
Pros:
- Automatically pulls new posts from your account.
- Customizable layout, image size, and number of rows.
- Mobile-responsive options.
- Option to add fallback images.
2. Embed a Specific Instagram Post
If you only want to highlight one or two specific posts (e.g., a client testimonial or a launch announcement), you can use Instagram’s native embed feature:
- Go to the post on Instagram.
- Click the three dots in the top right.
- Select Embed and copy the code.
- Paste it into Showit’s embed code box (we’ll walk you through this below).
How to Add a Social Grid to Your Showit Website
Here’s a step-by-step guide using a widget like LightWidget or SnapWidget:
Step 1: Create Your Widget
- Visit the widget platform (e.g., lightwidget.com).
- Connect your Instagram account and authorize access.
- Customize your grid layout:
- Number of rows/columns.
- Image size and spacing (image gap).
- Hover effects or borders (optional).
- Select images from your media library for fallback purposes.
- Set fallback images in case your feed fails to load. Use placeholder images to maintain a visually appealing feed.
- Copy the embed code provided.
Step 2: Open Your Showit Account
- Log into your Showit dashboard.
- Navigate to the page or canvas where you want the feed to appear.
Step 3: Add an Embed Code Box
- In the right sidebar, click Add > Embed Code.
- A blank box will appear on your canvas.
- Paste your widget embed code into the box.
- Resize the embed box as needed using the corner handles.
- Use the Objects menu to control stacking order and placement.
Step 4: Design for Desktop and Mobile
Showit’s split design system means you’ll want to tweak the layout for both views:
- Switch to mobile view.
- Resize and reposition your widget to fit smaller screens.
- Preview your site to ensure the feed looks good on all devices.
Step 5: Save and Publish
- Click Preview to double-check spacing, alignment, and responsiveness.
- Once satisfied, click Save and Publish your site.
Pro Tips for a Clean Instagram Integration
- Use consistent branding: Make sure your Instagram visuals match your site style.
- Position matters: Place your feed near the bottom of your homepage, in your About section, or on a dedicated social page.
- Placing Instagram feeds in the footer can display current work and social updates without disrupting user navigation.
- Add a follow icon: Include a small Instagram icon that links to your profile.
- Set fallback images: Choose a few branded photos to upload in case your Instagram account becomes disconnected.
- Refresh access regularly: If your feed stops updating, log into the widget provider and reconnect your Instagram account.
Troubleshooting Common Issues
- Feed not displaying? Double-check that your Instagram account is set to public and the embed code is correct.
- Posts not updating? Free widgets sometimes require occasional logins to refresh permissions.
- Not mobile-friendly? Use Showit’s mobile design tools to resize and realign your embed box.
- Want more control? Consider upgrading to a paid widget for advanced settings and more layout options.
Wrapping Up
Adding your Instagram feed to your Showit site is a simple way to make your site feel fresh and engaging – without having to manually update content. With the right tools and a few design tweaks, you can create a seamless, responsive experience that looks great on both desktop and mobile.