Shopify Social Icons Section

Description of the Section

The "Social Icons" section for Shopify, created with the Sections Pro app, allows you to display social media icons with links to your profiles. This section is customizable with various settings such as fonts, colors, dimensions, and content. Enhance your store's social presence by encouraging visitors to follow your brand across different social media platforms.

Demo of the Section

Installation Instructions

1. Download the Sections Pro app on the Shopify App Store
2. Open the app and navigate to Free Sections
3. Search for "Social Icons"
4. Click to Publish or Purchase

Sample Use Cases for a Shopify E-commerce Store

1. Footer Integration: Add the Social Icons section to the footer of your store to make it easy for customers to find and follow your social media profiles.
2. Promotional Pages: Include this section on promotional landing pages to convert visitors into followers.
3. About Us Page: Enhance your About Us page by adding social media links to build more trust and engagement with your audience.
4. Product Pages: Add social icons to product pages to encourage customers to share their purchases or connect with your brand.
5. Blogs: Use this section in blog articles to drive traffic from content to your social media pages, creating a multi-channel engagement strategy.

Overview of the Configuration Settings

Font Settings

• Override Theme Fonts: Checkbox to allow overriding of the theme's default fonts.
• Text Font: Font picker for the text font.
• Headline Font: Font picker for the headline font.

Text Settings

• Text Size: Range setting from 10px to 50px.
• Text Line Height: Options ranging from 0.75 to 2.0 and inherit.
• Text Color: Color picker for the text color.
• Headline Size: Range setting from 10px to 50px.
• Headline Line Height: Options ranging from 0.75 to 2.0 and inherit.
• Headline Color: Color picker for the headline color.

Colors

• Background: Color picker with background color options.
• Icon Color: Color picker for the icon color.

Dimensions Settings

• Columns on Mobile: Options for column configurations on mobile devices - 1 to 4 columns.
• Max Width of Section: Number input for the maximum width of the section.
• Gap Between Badges: Number input for the gap between badges.
• Padding Top: Number input for padding at the top.
• Padding Bottom: Number input for padding at the bottom.
• Padding Left: Number input for padding on the left.
• Padding Right: Number input for padding on the right.
• Icon Top Margin: Number input for the top margin of icons.
• Element Spacing: Number input for spacing between elements.
• Icon Height: Number input for the height of the icons.

Content Settings

• Text Alignment: Alignment options for text - left, center, right.
• Headline: Inline rich text editor for the headline.
• Text: Inline rich text editor for the text.

Icons Settings Configure visibility and links for each social media icon:

• Show Instagram & Instagram Link
• Show Facebook & Facebook Link
• Show X & X Link
• Show Threads & Threads Link
• Show Spotify & Spotify Link
• Show LinkedIn & LinkedIn Link
• Show YouTube & YouTube Link
• Show Pinterest & Pinterest Link
• Show TikTok & TikTok Link