{"id":20262,"date":"2026-07-20T14:59:02","date_gmt":"2026-07-20T12:59:02","guid":{"rendered":"https:\/\/surver.nl\/?post_type=kennisbank&#038;p=20262"},"modified":"2026-07-24T14:42:40","modified_gmt":"2026-07-24T12:42:40","slug":"how-to-customize-your-wordpress-favicon-heres-how-to-set-up-your-site-icon","status":"publish","type":"kennisbank","link":"https:\/\/surver.nl\/en\/kennisbank\/wordpress-favicon-aanpassen-zo-stel-je-je-siteicoon-in\/","title":{"rendered":"Customizing the WordPress favicon: How to Set Your Site Icon"},"content":{"rendered":"<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"600\" src=\"https:\/\/surver.nl\/wp-content\/uploads\/2026\/07\/wp-favicon-e1784552332422.jpg\" alt=\"\" class=\"wp-image-20263\" srcset=\"https:\/\/surver.nl\/wp-content\/uploads\/2026\/07\/wp-favicon-e1784552332422.jpg 1024w, https:\/\/surver.nl\/wp-content\/uploads\/2026\/07\/wp-favicon-e1784552332422-300x176.jpg 300w, https:\/\/surver.nl\/wp-content\/uploads\/2026\/07\/wp-favicon-e1784552332422-768x450.jpg 768w, https:\/\/surver.nl\/wp-content\/uploads\/2026\/07\/wp-favicon-e1784552332422-18x12.jpg 18w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">You have ten tabs open in your browser, and your site is the only one with that standard gray dot next to it. Small detail, big impact: the favicon (the site icon in the browser tab) is the first thing many visitors notice about your site, and its absence looks unprofessional. The good news: this is one of the quickest improvements you can make to your site. WordPress has a built-in feature for this; it takes two minutes, and the only things people usually run into are the file format and an icon that \u201cgets stuck\u201d after the change. We\u2019ll solve both of those here.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Where Your Favicon Shows Up Everywhere<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The icon does more than just the browser tab. The same image appears in your visitors\u2019 favorites and bookmarks lists, in their browser history, as a shortcut icon when someone adds your site to their phone\u2019s home screen, and increasingly next to your site in search results. A single upload serves all those locations, and that\u2019s exactly why WordPress refers to it as a site icon rather than just a favicon: it\u2019s your site\u2019s logo wherever it appears outside of your site itself.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>The correct file: square and at least 512 by 512 pixels<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Before you click, make sure you have the right file ready. WordPress requires a square image of at least 512 by 512 pixels, in PNG or JPG format. WordPress automatically generates all the smaller versions that browsers and phones need from that single image; so you no longer need to create a separate .ico file like you used to. Three practical tips for the design. Don\u2019t use your full logo with text: at 16 by 16 pixels in a tab, text is unreadable, so choose just the logo or the first letter of your name. Ensure sufficient contrast, as the icon must be visible on both light and dark browser themes. And a PNG with a transparent background looks best in most contexts.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you only have a logo in a different format, first crop it to a square using a free image editor. Stretched or cropped icons are the most common cosmetic flaws we encounter in this area.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Setting the Site Icon<\/strong><\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Log in to your WordPress dashboard.<\/li>\n\n\n\n<li>Go to Settings, then General. At the top, you'll see the \"Site Icon\" section. If you're using an older theme and don't see it there, go to Appearance, open the Customizer, and select Site Identity; you'll find the same feature there.<\/li>\n\n\n\n<li>Click \"Choose Site Icon\" and upload your square image, or select one from your Media Library.<\/li>\n\n\n\n<li>Crop the image when WordPress prompts you to do so, and confirm.<\/li>\n\n\n\n<li>Save the changes and open your site in a new tab to see the results.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">If you're using a page builder or a theme with its own settings, there may be another favicon field there as well. Be sure to enter the icon in only one place\u2014preferably the default WordPress location mentioned above; having two conflicting settings can lead to confusion about which one takes precedence.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Old icon won't go away? That's the cache.<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">You\u2019ve set a new icon, but the browser tab is still showing the old one. Don\u2019t panic\u2014and above all, don\u2019t upload it again. Favicons are stored extremely persistently in the cache (the temporary memory of your browser and your site)\u2014more persistently than almost any other part of a website. Here\u2019s how to fix it: first, open your site in an incognito window. If you see the new icon there, everything is fine, and you just need to clear your browser\u2019s cache or simply wait a day; visitors will see the new version on their own. If you still see the old icon even in incognito mode, clear your site\u2019s cache yourself using your caching plugin.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">At Surver: LiteSpeed Cache is the default caching plugin on our hosting platform. You can clear the cache in the dashboard by going to the LiteSpeed Cache menu and selecting \"Manage.\" If the old icon still appears anywhere after that, our support team is available seven days a week to help you resolve the issue.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>For advanced users: manually and by network<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">If you\u2019re not using the built-in feature\u2014for example, if you\u2019re using a custom theme\u2014you\u2019ll need to upload the favicon files yourself and link to them using link tags in the site\u2019s head section, preferably through a child theme so that the links survive updates. In a multisite network, each site sets its own site icon through its own settings; there is no network-wide icon. And after a migration or domain change, be sure to check whether the icon is still loading: the reference contains a full web address that must be updated during such a change, which happens automatically if you perform the migration properly according to our <a href=\"https:\/\/surver.nl\/en\/knowledge-base\/wordpress-backup-en-migratie-de-complete-gids\/\">A Complete Guide to WordPress Backups and Migration<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>A small part, part of a larger whole<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The site icon is typically one of those finishing touches you take care of during the final phase of building your site, along with the site title and your permalinks. If you're still setting up your site, our <a href=\"https:\/\/surver.nl\/en\/knowledge-base\/een-website-maken-met-wordpress-de-startgids-voor-beginners\/\">A Beginner's Guide to Creating a Website with WordPress<\/a> walk you through all those final steps in the correct order. And once your site is up and running, you'll find in our <a href=\"https:\/\/surver.nl\/en\/knowledge-base\/wordpress-management-the-complete-guide-for-beginners-and-advanced-users\/\">A Complete Guide to WordPress Management<\/a> how to keep it organized.<\/p>","protected":false},"excerpt":{"rendered":"<p>Tien tabbladen open in je browser, en jouw site is de enige met dat grijze standaardbolletje ernaast. Klein detail, grote indruk: de favicon (het site-icoontje in de browsertab) is voor veel bezoekers het eerste herkenningspunt van je site, en het ontbreken ervan straalt onaf uit. Het goede nieuws: dit is een van de snelste verbeteringen [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":20263,"template":"","meta":{"_acf_changed":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"kennisbank_categorieen":[62],"class_list":["post-20262","kennisbank","type-kennisbank","status-publish","has-post-thumbnail","hentry","kennisbank_categorieen-wordpress"],"acf":[],"_links":{"self":[{"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/kennisbank\/20262","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/kennisbank"}],"about":[{"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/types\/kennisbank"}],"author":[{"embeddable":true,"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/users\/2"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/media\/20263"}],"wp:attachment":[{"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/media?parent=20262"}],"wp:term":[{"taxonomy":"kennisbank_categorieen","embeddable":true,"href":"https:\/\/surver.nl\/en\/wp-json\/wp\/v2\/kennisbank_categorieen?post=20262"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}