Instagram Feed Template Styling & Connection

This guide will walk you through all the options in the Style and Connection tabs of the Instagram Feed template editor.

While the General Settings tab controls what content is shown (e.g., your source, filters, and header), the Style tab controls the visual design. This is where you can change all the colors, fonts, spacing, and borders to perfectly match your brand and website's look.

Style Settings

The Style tab is organized into four sections, each controlling a different part of your feed.

1. Header

This section controls the complete visual design of the Header at the top of your feed. The header is the box that contains your main profile information, like your name, bio, and follower count.

User Name

These settings control the appearance of your Instagram Username (e.g., @wpsocialninja) in the header.

• Text Color: This opens a color picker that allows you to select the exact color of your username.
• Typography: This opens a full set of font controls for your username. You can change the Font Family (e.g., Arial, Roboto, etc.), Font Size (in pixels), Font Weight (e.g., Light, Regular, Bold), Line Height, and Letter Spacing.
• Bottom Spacing: This controls the amount of empty space (in pixels) directly below your username, pushing the next element (like your Statistics) further away from it.

Statistics

These settings control the appearance of your profile's statistics: your Posts, Followers, and Following counts.

• Number Color: This sets the color for the number (e.g., the "1,250" in "1,250 Followers").
• Text Color: This sets the color for the label (e.g., the word "Followers").
• Typography: This opens the full set of font controls (Font Family, Size, Weight, etc.) that will apply to both the number and the text.
• Spacing Between Item: This slider controls the amount of empty space (in pixels) between each statistic item (e.g., the space between "Posts" and "Followers").

Full Name

These settings control the appearance of your Profile's Full Name (the name you set in your Instagram bio).

• Text Color: This opens a color picker to set the color of your Full Name text.
• Typography: This opens the full set of font controls (Font Family, Size, Weight, etc.) for your Full Name.

Description

These settings control the appearance of your Instagram Bio (the main description text) in the header.

• Text Color: This opens a color picker to set the color of your bio text.
• Typography: This opens the full set of font controls for your bio, allowing you to make it larger, smaller, or easier to read.

Follow Button

This styles the "Follow" button that you can enable in the General tab.

• Text Color: This opens a color picker to set the color of the text inside the button (e.g., "Follow Us").
• Button Background Color: This sets the main background color of the button itself.
• Typography: This opens the full set of font controls (Font Family, Size, Weight, etc.) for the button text.

Box

These settings control the overall container or "box" that holds all the header elements (your profile pic, username, bio, etc.).

• Background Color: This allows you to set a background color for the entire header area.
• Padding: This is the "breathing room" inside the header box. It's the empty space between the border of the box and the content. You can set the padding (in pixels) for the Top, Right, Bottom, and Left sides individually.
• Border Type: This lets you choose the style of the border for the header box (e.g., Solid, Dotted, Dashed, or None).

2. Content

This section styles the text caption (the description) that appears with each individual post in your feed.

• Hashtag Color: This is a special setting that controls the color of any clickable #hashtags inside your post's caption. This helps them stand out from the rest of the text.
• Text Color: This sets the color of the main body of your caption.
• Typography: This opens the full set of font controls for the caption text, allowing you to make it larger, smaller, or easier to read.
• Padding: This controls the padding around the text caption only, letting you adjust the space between the caption and the photo above it or the statistics below it.

3. Statistics

This section styles the Likes and Comments counts that appear on each individual post (not the header). You must have these enabled in the General tab to see them.

• Icon Color: This sets the color of the small "heart" (like) and "speech bubble" (comment) icons.
• Text Color: This sets the color of the numbers next to the icons (e.g., the "150" in "150 Likes").
• Typography: This opens the full set of font controls (Font Family, Size, Weight, etc.) for the statistics text.
• Padding: This controls the padding around the statistics block, letting you adjust the space between it and the content above or the edge of the post.

4. Item Box

This is a very important section. The Item Box is the entire container or "card" that holds each individual post (including the photo, caption, and statistics). These settings control the design of that main box.

• Background Color: This sets the background color for the entire post card. By default, it's usually white or transparent, but you can set it to a light gray or any other color to match your brand.
• Padding: This is the "breathing room" inside the post card. It's the empty space between the card's border and the content inside it (like the photo and text). You can set the padding (in pixels) for the Top, Right, Bottom, and Left sides individually to get the spacing perfect.
• Border Type: This lets you choose the style of the border for the post card (e.g., Solid, Dotted, Dashed, or None).
• Width: This setting (which appears if you select a Border Type) lets you control the thickness of the border. You can set the thickness (in pixels) for the Top, Right, Bottom, and Left sides individually.
• Color: This opens a color picker to set the color of the border itself.

Connection Settings

The Connection tab is a simple shortcut. It allows you to connect a new Instagram Account right from within the template editor.

This is very useful if you are building a template and realize you want to include an account you haven't connected yet, or if you want to add multiple accounts to a single feed.

Please Note: The steps to connect an account here are identical to the main Instagram connection process.

For a complete, step-by-step guide on how to use these settings, please see our main Instagram Configuration documentation.