Uploading files in header.php
-
Hello,
I would like to know where exactly I would need to place the files that I have created for my favicons on your website. I prefer not using the plugin because I am already using quite a few plugins and want to keep the site as light as possible.Thank you for your help-
kustvhttps://wordpress.org/plugins/favicon-by-realfavicongenerator/
-
Hi Kustv,
First, let me promote the plugin. It’s very light. The code triggered in the public part of the site (… where you want plugins to be *fast*) is straightforward. So it probably won’t slow down your site. And it comes with a few advantages. Your favicon is preserved whenever you change your theme. Your favicon is updated automatically if something changes (think: iOS 9 will be released in a few months).
Alright, now I answer your question π
You can generate your favicon manually by going to Real Favicon Generator<a/> and by following the instructions of the WordPress codex. Keep in mind that the favicon code will be dropped whenever you change your theme.
Does this help?
Regards,
PhilippeHello ,
thank you for your reply. Actually, my theme support does not think it is a good idea to edit the head.php( even when using a child theme). They suggested to edit my child theme’s function instead with the following:function kt_addfavicon_custom(){ ?> <link rel="apple-touch-icon" sizes="57Γ57" href="/apple-touch-icon-57Γ57.png"> <link rel="apple-touch-icon" sizes="60Γ60" href="/apple-touch-icon-60Γ60.png"> <link rel="apple-touch-icon" sizes="72Γ72" href="/apple-touch-icon-72Γ72.png"> <link rel="apple-touch-icon" sizes="76Γ76" href="/apple-touch-icon-76Γ76.png"> <link rel="apple-touch-icon" sizes="114Γ114" href="/apple-touch-icon-114Γ114.png"> <link rel="apple-touch-icon" sizes="120Γ120" href="/apple-touch-icon-120Γ120.png"> <link rel="apple-touch-icon" sizes="144Γ144" href="/apple-touch-icon-144Γ144.png"> <link rel="apple-touch-icon" sizes="152Γ152" href="/apple-touch-icon-152Γ152.png"> <link rel="apple-touch-icon" sizes="180Γ180" href="/apple-touch-icon-180Γ180.png"> <link rel="icon" type="image/png" href="/favicon-32Γ32.png" sizes="32Γ32"> <link rel="icon" type="image/png" href="/android-chrome-192Γ192.png" sizes="192Γ192"> <link rel="icon" type="image/png" href="/favicon-96Γ96.png" sizes="96Γ96"> <link rel="icon" type="image/png" href="/favicon-16Γ16.png" sizes="16Γ16"> <link rel="manifest" href="/manifest.json"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="msapplication-TileImage" content="/mstile-144Γ144.png"> <meta name="theme-color" content="#ffffff"> <?php } add_action('wp_head', 'kt_addfavicon_custom');I am not sure how and where I would need to upload the images though. Would I need to extract the downloaded zip and upload each image individually? Sorry I am a WP beginner…
And what about the browserconfig and manifest.json files?
Changing
header.phpis the generic way, but if your theme’s support tells you otherwise, you should follow their advice!About the files location, you should put them in a dedicated directory. For example in
wp-content/upload/favicon(you’ll have to create this directory). One you know where the files will be, go to RealFaviconGenerator again and create your favicon one more time. But this time, in the Favicon options, indicate this path as the location (/wp-content/upload/faviconin this example). So the generated HTML will match the actual location of your files.Yep, you should probably unzip your favicon package on your PC and upload all the files to your site (one by one, really? I’m confident your FTP client can do better than this! π )
manifest.jsonandbrowserconfig.xmlare two extra files for Android Chrome and Internet Explorer 11, respectively. They both specify icons for these platforms.Don’t think I’m trying to sell you the plugin, but it would automate all this tedious installation process. Just saying π
Okay, I will give the plugin a try. Just a question though: Is the plugin working through hooks or is it actually editing the header-php?
Also, I noticed when creating a favicon on your website, that the favicon was very blurry(even though the image I uploaded was an svg!). Is there a way to prevent this?
Thank you,
kustvThe plugin is using a single hook to add the favicon code on the fly. It doesn’t modify anything so it can be deactivated or uninstalled safely.
No, the icon is not supposed to be blurry… It might come from the SVG format, I had a few troubles with this some time ago. Could you mail me the picture at contact@realfavicongenerator.net so I can review it?
I just did! Thank you π
You’re welcome!
The topic ‘Uploading files in header.php’ is closed to new replies.