> For the complete documentation index, see [llms.txt](https://vshop.gitbook.io/vshop/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vshop.gitbook.io/vshop/theme-sections/instagram.md).

# Instagram

The Instagram section allows you to showcase your Instagram feed directly on your store, helping increase engagement and brand connection.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FXEv0d5f88UTWNRVH9kjV%2Fimage.png?alt=media&amp;token=f3416292-5592-42b7-8d6b-34f27814b15d" alt=""><figcaption></figcaption></figure>

To customize the Instagram in our theme please follow the steps:

{% hint style="success" %}
Steps

1. In the theme editor (**Customize**), click **Add section**
2. Locate **Instagram**
3. **Save**
   {% endhint %}

## Section Settings

#### **Section Header**

* **Show “Section header”:** Enable to display a title and short description.
* **Heading:** Enter the main title (e.g., *#VshopTheme*).
* **Description:** Add a short introduction or tagline for the section.
* **Text alignment:** Choose *Left*, *Center*, or *Right* alignment.
* **Button label:** Add text for the Instagram button (e.g., *Follow our Instagram*).
* **Link Follow our:** Paste your Instagram profile link.
* **Button open link in:** Choose to open in the *Current tab* or a *New tab*.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FowpGuEHwPWrjQjKqHDyF%2Fimage.png?alt=media&amp;token=b76e7137-eae7-4dfb-8c61-5d10f1b56d5c" alt=""><figcaption></figcaption></figure>

***

#### **General**

* **Layout:** Select the layout style for the section (e.g., *Default*).
* **Color scheme:** Choose a color theme matching your store style.
* **Data Instagram:**
  * *Custom data:* Manually add Instagram blocks.
  * *Theme settings > Integration:* Use your Instagram token for auto-feed.
* **Image ratio:** Choose the aspect ratio for Instagram images.
* **Custom ratio:** Define your own image ratio (e.g., *21:9*).

***

#### **Display Settings**

* **Border radius image:** Enable to round the image corners.
* **Instagram to show:** Set the total number of posts displayed.
* **Number of columns on desktop:** Choose how many images appear per row.
* **Layout tablet & mobile:** Select between *Scroll* (horizontal scrolling) or *Column* (grid layout).

***

#### **Config Layout Column**

* **Columns on tablet:** Set the number of columns for tablet view (1–3).
* **Columns on mobile:** Set columns for mobile view (1–2).
* **Gap item:** Adjust the space between images.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FYP242GLQw9cuUgHzeq6o%2Fimage.png?alt=media&amp;token=365d684b-da8f-4cf2-aaba-58397b22d6a9" alt=""><figcaption></figcaption></figure>

***

#### **Section Padding**

* **Padding top / bottom:** Adjust the spacing above and below the section.
* **Remove default space between sections:** Enable to eliminate the standard gap between sections.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2F40V4lyRGV9WVo6w9LeyS%2Fimage.png?alt=media&amp;token=6535acc8-c9e2-4957-aafc-f520b2e41b4a" alt=""><figcaption></figcaption></figure>

## Block Settings

### Item instagram

Each **Instagram Block** represents a single image from your feed. You can manually upload custom photos and link them to your Instagram posts or any external URLs.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2Ft5D2zF5RKg6G4x5GDToU%2Fimage.png?alt=media&amp;token=232b21e0-decc-4b25-a64a-40d8b82b3b40" alt=""><figcaption></figcaption></figure>

* **Image Instagram:** Upload the image you want to display in the Instagram feed.
* **Link Instagram:** Add the URL for this image — it can point to your Instagram post or another related page.

***

#### **Tips**

* Use high-quality square or landscape images for the best layout fit.
* Keep image links consistent with your official Instagram account to boost engagement.
* Combine multiple blocks to create a visually appealing Instagram grid.

### Text content

The **Text Content Block** allows you to add a short text area with a background color and a call-to-action button. It’s ideal for displaying announcements, promotional messages, or quick links.

<figure><img src="https://370739323-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUoKuJAeox3jObJjxBdwE%2Fuploads%2FGrpsSCaOqHGABivuwHZB%2Fimage.png?alt=media&amp;token=a7ea62f2-9a86-41ba-a285-7fcd1cf37235" alt=""><figcaption></figcaption></figure>

* **Color content:** Choose the text color for this block.
* **Background color:** Set the background color for the text area.
* **Heading:** Add a title for the text block.
* **Description:** Write a short supporting message or detail.
* **Text button:** Define the button label (e.g., *View All*).
* **Link content:** Add the destination URL for the button.
* **Button open link in:** Choose whether the link opens in the *Current tab* or a *New tab*.

***

#### **Tips**

* Keep the message brief and engaging.
* Use contrasting text and background colors for better readability.
* Perfect for linking to collection pages, promotions, or special offers.