Happy Holidays!

As we approach the final days of 2024, there is still so much work to do for enhancing the AEM platform that we work with daily. Code changes are usually required for most updates the platform needs or for feature requests, although some current component implementations may be used for extending usage beyond what Authors have realized.

One such usage is our Social Media Custom Icons enhancement that went out to the Agency Header and Agency Footer components back in our 17.0 Washington Release.

This enhancement allows users to add custom social media icons in the header or footer alongside our implemented social media options, which does not cover all currently used social media platforms. Authors may add in these custom options when their specific option doesn't currently exist. A downside to this is that Custom Icons do not currently support the Custom Social Media Icon Colors at this time.

Since there is now an ever-growing need for the new BlueSky social media platform, it is more beneficial for Authors to follow the below guide on learning how to add Custom Social Media Icons for something like this until a permanent update adds new social platforms.

To assist agencies with getting BlueSky set up on their AEM sites, the WCM team has included 4 renditions of the BlueSky logo to use in the same global path as all our other globally-used social media icons (/content/dam/soi/en/web/global/images/icons). At a later date there may be an update to permanently add new options.

Please use the following global image files for BlueSky:

Adding in a custom Social Media Icon is straightforward:

1. On a Home Page, open the component you want to add a custom social icon to; either the Agency Header or Agency Footer component.
2. Navigate to the Social Links tab.
3. Click on Add to add a new social media "block" of options.
4. Scroll to the bottom of the Social Media Text dropdown and select Custom Icon.
5. Fill in the URL and Aria Label fields appropriately.
6. In the Custom Icon Path field, navigate to your asset stored in the AEM DAM. The icon will be rendered in at 32x32 pixels.

For example, the image below shows an Agency Header component opened for editing on the Social Links tab. They have set a "Custom Icon" to add their BlueSky social media information and is utilizing the BlueSky Blue on White Global logo image stored in the DAM:

We want our Authors to end the year feeling empowered walking into 2025 as we work to gain insight, gather feedback, and further-curate improvements and solutions to the AEM platform as a whole. Hopefully the information contained in this article serves to enrich Authors with ideas and knowledge going forward with social media platforms.

If you have any current suggestions for the AEM platform, please use our Enhancement Request form to make your voice heard!

If you would like to learn more in-depth uses of AEM, browse our AEM University to understand more ways to utilize the current tools at your disposal.

Enjoy the New Year and Stay Safe!