In my post, I show you how to change the site icon for your website on the Astra WordPress theme.
The site icon is the small image you see in browser tabs. You can have a new icon for your blog in just a few moments by following my step by step guide.
Step One – Create An Site Icon For Your Website
If you have an image ready for your blog, continue to step two.
There are many free websites you can use to create a logo or icon. I recommend Canva.com (*paid link). You can design a beautiful logo for your site in minutes for free.
To learn how to design an icon on Canva.com. Please check out my ‘How To Create A Free Favicon On Canva.com‘ post.
Step Two – Resize Your Image
Your site icon should be a square image of 512 by 512 pixels. You can use resizeimage.net to resize if your site icon is too large.
Go to resizeimage.net and select the ‘Upload An Image’ link.
Once uploaded, you see your image. Scroll down to ‘#4 Resize Your Image’.
My uploaded image is 1200 by 628 pixels. Too big to be used for the site icon. It also isn’t square. To resize this image to 512 by 512, I must untick the ‘Keep Aspect Ratio’ box and enter 512 into the two boxes.
Next, scroll to the bottom of the screen and select the ‘Resize Image’ link.
After a few seconds, a download link appears.
Click on the ‘Download Image’ link to save your site icon to your computer.
Now it is time to change your site icon.
Step Three – Upload Your Site Icon To Astra
To upload your icon, hover your mouse over ‘Appearance’ and select ‘Customize’ from the menu on your WordPress admin dashboard.
In the customizer, select ‘Header’ from the menu.
Next, select ‘Site Identity’.
Scroll to the bottom of the page and click on the ‘Select Site Icon’ link.
Don’t forget the ideal size for your site icon is 512 by 512 pixels. If you haven’t resized your image yet, do that before uploading.
On the next screen, select the ‘Upload Files” link.
Click on the ‘Select Files’ link and choose the image you saved to your computer.
Once uploaded to your WordPress site, complete the ‘Alt Text’ and ‘Title’ fields before you click on ‘Select’.
Now you have changed your site icon.
Your new site icon is also now showing in the browser tab.
Step Four – Publish Your Changes To Make Your Site Icon Live
To make the new site icon appear on your website, click on ‘Publish’.
Go to the homepage of your website to view your new site icon on your website.
Now you have successfully changed the site icon on Astra for your WordPress website.
How To Add Or Change The Site Icon On Astra Video Tutorial
Frequently Asked Questions
Now you can change your site icon on the Astra WordPress theme.
To get an icon for your website yet. I recommend going to Canva.com (*paid link) and opening a free account. Their free account allows you to design a beautiful icon for your blog.
If you have an image you want to use for your site icon, ensure it is square and 512 by 512 pixels. If it isn’t, go to resizeimage.net to resize the image before uploading.
To upload your image, go into the theme customizer and select ‘Header’. Next, click on ‘Site Identity’ and scroll to the bottom of the page.
Upload your image by clicking on the ‘Select Site Icon’ link. Once uploaded, publish your changes to make them live on your website.
If you have any questions about site icons, please leave them in the comments below. Do you have a site icon for your blog? What website did you use to design your icon?