Custom icon in wordPress

3
3
119 followers

Many people still have the rather ugly default wordPress icon on their site, so I thought it's time to show you how you can pimp your site with a custom icon.

Creating an icon

There are various ways to do this, however I highly recommend GIMP for all image manipulations (except for SVG). It's basically a free photoshop.

Adding the icon to wordPress

Without FTP access:
  1. Upload the icon you've created under Media → Add New
  2. Click on the icon to get to the editing page and copy the address of the icon
  3. Go to Appearance → Editor and select header.php in the column on the right side
  4. Find the <head> tag and insert the following line right afterwards:
  5. <link rel="shortcut icon" href="address_of_your_icon" />
Warning: if you're doing it this way, then you'll have to insert the line again after each wordPress update, because header.php gets overwritten.

With FTP access:

  1. Upload the icon via FTP to the same folder as your style.css (wordpress/wp-content/themes/theme_name)
  2. Edit header.php and insert the following line right after <head>:
  3. <link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/name_of_your_icon.ico" />
Advantage: you don't have to change header.php when you're moving your site to a different domain.

Warning: header.php still gets overwritten if you make an update unless you're using a child theme.

3
3

Join FREE & Launch Your Business!

Exclusive Bonus - Offer Ends at Midnight Today

00

Hours

:

00

Minutes

:

00

Seconds

2,000 AI Credits Worth $10 USD

Build a Logo + Website That Attracts Customers

400 Credits

Discover Hot Niches with AI Market Research

100 Credits

Create SEO Content That Ranks & Converts

800 Credits

Find Affiliate Offers Up to $500/Sale

10 Credits

Access a Community of 2.9M+ Members

By continuing, you agree to our Terms of Service and Privacy Policy
No credit card required

Recent Comments

3

Just can't get it to work, have to use < it seems to avoid the lines getting removed.

Edit: yep, that did the trick... enjoy! (However, I can't edit it or I'll have the same troubles again)

Open the editor for the post, click style, then 'Computer Code' I believe this will allow you to insert code into your posts.

http://d.pr/i/DfDs

Okay thanks, I'll try that next time, this was pretty ugly ;)

See more comments

Join FREE & Launch Your Business!

Exclusive Bonus - Offer Ends at Midnight Today

00

Hours

:

00

Minutes

:

00

Seconds

2,000 AI Credits Worth $10 USD

Build a Logo + Website That Attracts Customers

400 Credits

Discover Hot Niches with AI Market Research

100 Credits

Create SEO Content That Ranks & Converts

800 Credits

Find Affiliate Offers Up to $500/Sale

10 Credits

Access a Community of 2.9M+ Members

By continuing, you agree to our Terms of Service and Privacy Policy
No credit card required

2.9M+

Members

190+

Countries Served

20+

Years Online

50K+

Success Stories

The world's most successful affiliate marketing training platform. Join 2.9M+ entrepreneurs building their online business with expert training, tools, and support.

© 2005-2025 Wealthy Affiliate
All rights reserved worldwide.

🔒 Trusted by Millions Worldwide

Since 2005, Wealthy Affiliate has been the go-to platform for entrepreneurs looking to build successful online businesses. With industry-leading security, 99.9% uptime, and a proven track record of success, you're in safe hands.