Change Twitter logo to X logo

As you probably already know, new owner Elon Musk decided to change its branding, name, and logo shortly after buying Twitter. The social network that we used to know as Twitter for many years has now become X. If you are using this social network and have a link to your profile on your website, you would probably decide to change the old Twitter logo to the new X logo.

In almost all our Joomla templates, we are using the Font Awesome collection of icons. Only after the Font Awesome v6, the new X logo is available in the collection. Therefore, we had to upgrade all our Joomla templates to use the Font Awesome v6 and get the new icon from it to change the old Twitter logo. The Sparky Framework v5.0.1 and the Sparky Page Builder v1.3.1 (and later versions) are integrated with the Font Awesome v6, so you can include the X logo in your websites.

How To Change Twitter Logo With X Logo

First, make sure you are using the Sparky Framework v5.0.1 (or newer). Immediately, after the upgrade of the framework version, go to the template options (System > Site Template Styles). Click on the template name and click on the "Save & Close" button (you don't need to change any options). This will make your website load new icons.

Next, if your content is managed by our page builder, make sure it's Sparky Page Builder v1.3.1 (or newer). Edit the module where the Twitter icon is located, edit the Social block, and select the new X icon (instead of the old Twitter icon).

If you are not using our page builder, then the old Twitter icon in HTML looks like this:

<i class="fab fa-twitter"></i>

Edit the module and, to use the new X icon, change the class of the icon like this:

<i class="fab fa-x-twitter"></i>

In some templates, especially the older ones, the logo images are used instead of the icons. In this case, you will have to locate the Twitter logo image and use your graphic editor (Photoshop, Gimp, ...) to change it.

Starting a Brand New Website

We believe that changing the Twitter logo to X logo is not complicated if you follow our guide. However, if you are starting your website today, save yourself from extra work and re-download the template package from our downloads repository before installing it on your server. The X logo is now used on all templates by default as you can see on our templates demo section.