Add Social Media Icons to an Email Template
Introduction
Including social media links in your email templates is a great way to grow your online presence and keep customers connected across platforms. With AiTrillion’s Social Media block, you can easily add icons for Facebook, Instagram, Twitter, and more directly into your email design. In this article, you will learn to add a Social media block to an email template.
The Social Media Block automatically pulls your social media links from your AiTrillion profile
If you haven't added your social media links yet, follow the steps below to add them:
Step 1: Hover over the Profile icon and click on My account
Step 2: Click the social media icons you want to link to your profiles, add the links to your Social media, and click on the Update profile.
Note: Once you enable the social media icons, they cannot be disabled. The icons will still appear even if you don’t add a link for them. However, at least one social media link is required.
Note: If you choose to edit a pre-made template or copy an old template, the Social blocks will automatically be fetched from the My Account section of AiTrillion. If you don’t want to use the same logo as the one on the website or want to use a different theme, follow the steps below to add a different logo.
Use the Social block to automatically fetch the Social media links
Step 2: Drag and drop the layout block
Step 3: Click on blocks. Now, drag and drop the Social block
Note: If you don't add the link on the My account page, the link has to be added manually. To learn how to add links on My account page of AiTrillion, click here.
Step 4: You can also set the settings according to your needs. The settings are:
1. Background Color: Sets the background color of the social media icons block. Default is transparent, allowing it to blend with the email background.
2. Icon Style & Size: Icon style (e.g., Circle color logos) controls the visual appearance of the icons. Icon size (px) defines the size of each social icon. Use the + / – buttons to increase or decrease the icon size.
Individual Social Platform Settings
Each social media platform can be configured independently.
Enable / Disable Icon: Use the toggle (More) to show or hide the title and alt text of the social media icon.
Link: Add the URL of your social media profile. Site indicates an external link. Ensure the URL is correct so users are redirected to the intended page.
Title: Defines the tooltip text shown when users hover over the icon. Example: Facebook, Instagram.
Alt Text: Text displayed if images are blocked by the email client. Improves accessibility and helps screen readers.
Delete Icon: Use the delete icon to completely remove a social platform from the block.
Supported Social Platforms
-
Facebook
-
X (Twitter)
-
Instagram
-
LinkedIn
-
YouTube
-
Pinterest
Custom Icon (Mainly used for Other social media platforms)
Layout & Spacing
Alignment:
- Controls how the icons are aligned within the email:
-
Left
-
Center
Right
-
Indent Between Icons: Adjusts the spacing between each social icon. Higher values increase the gap between icons.
Padding: Adds spacing around the entire social icons block. Enable More to customize padding individually (Top, Right, Bottom, Left).
Additional Options
Add an Anchor Link: Adds an anchor link to the block for quick navigation. Note: Anchor links are not supported in some email clients (e.g., iOS Gmail app, Apple Mail, Outlook apps, AMP emails).
Hide Element: Allows you to hide the social icons block on: Desktop, Mobile, Both
Note: You can also send the test email to check if the links are appearing correctly
Now, the social media links will be automatically added from the My account page. You can also delete the social media link by clicking on the Delete icon, and you can edit the template as per your needs and use it to send the template.
Important Notes
-
Social media links are automatically pulled from the links added in your AiTrillion profile. If no links are added, icons must be configured manually in the email editor.
-
If you prefer different links for a specific email, you can manually update the links within the Social Media block.
-
Always ensure social media URLs are correct and publicly accessible to avoid broken links.
-
Use Alt Text for each social icon to improve accessibility and ensure visibility when images are blocked.
-
Keep icon size and spacing consistent to maintain a clean and professional email layout.
-
Avoid adding too many social icons, as this may distract users from the main call-to-action.
-
Use the Preview and Send Test Email options to confirm icons display correctly across devices.
-
Changes made to social media links will apply only to the current template and will not affect previously sent emails.
Next⏭️
Related Articles
Add Specific Products in Email Template
Introduction: Customize your email templates by adding specific products with AiTrillion. Engage customers with targeted promotions and highlight key offerings to drive sales and conversions effectively. Now add the products you want to showcase in ...Add a Logo in an Email Message
Introduction: Adding a logo to your email message helps reinforce your brand identity and creates a professional, trustworthy impression for your recipients. With the Email Design Editor, you can easily upload and place your logo in the email header ...Boost Social Media Marketing With AiTrillion
Introduction: Unlock the potential of your social media marketing efforts with AiTrillion. Dive into this article to explore innovative strategies and tools offered by AiTrillion, empowering you to elevate your brand presence, engage your audience, ...Create Email template Using the Email Editor
Introduction The Email Editor allows you to easily design, customize, and launch email campaigns without any coding. Using a simple drag-and-drop interface, you can create professional emails, add dynamic content, and personalize messages to engage ...Add a Logo block to your email template
Introduction Adding your brand's logo to an email template is a simple yet powerful way to build trust and create a consistent visual identity. In this article, you'll learn how to insert a Logo block into your email template using the AiTrillion ...