WordPress has a feature called multisite, which allows you to setup a network of sites using a single WordPress installation. This allows you to create a self-hosted version of WordPress.com.The WordPress multisite feature allows you to use multiple themes that are different or the same theme for your multisite blogs. You might use the same theme for all your multisite blogs or a set of blogs because of branding – the blogs might belong to the same brand name, i.e. YourCompany.com, blog.YourCompany.com, etc… However, with this being said, you might want to add custom CSS, because the blog may have a feature that the main site does not.

You may also want to use the same favicon across the same brand name or use the same CSS for the same brand name. I’ll show you how-to do this too.

If the sites are not sharing the same brand, you might want to use the same theme because the layout is what you want but you may want the different brands to have different styling.

This article will show you how to add a custom favicon or CSS stylesheet for the same theme on WordPress’s multisite.

Custom Favicon and CSS for the Same Theme on Multisite

Let me show you how-to add a custom favicon or custom CSS based on the blog’s name or the blog’s ID. For all examples, add the code snippet to your theme’s header.

Based on the Blog’s Name

<?php $themeURL = get_bloginfo('template_directory'); $title = get_bloginfo('name'); $newTitle = str_replace(" ","",$title); echo '<link rel="icon" href="' . $themeURL . '/' . $newTitle . '.ico" type="image/x-icon" />'; ?>

This code snippet will get the brand’s name and replace the spacing. This code snippet is good for using the same favicon or styling across the same brand name or totally different brand names. It will not add different styling to the same brand name.

Based on the Blog’s ID

<?php global $blog_id; $themeURL = get_bloginfo('template_directory'); echo '<link rel="icon" href="' . $themeURL . '/' . $blog_id . '.ico" type="image/x-icon" />'; ?>

In this code snippet, we’ll get the blog’s ID and use it to add custom favicon or styling. This code snippet will not work if you want the same favicon or styling across the same brand name. The code snippet is meant for outputting a different favicon or CSS for each and every blog, regardless of the brand name.

Targeting a Specific Blog ID

You can also use a conditional statement that will or will not display a favicon or CSS stylesheet based on a blog’s ID. This is because the above code snippets will display the custom favicon or CSS stylesheet, even if it does not exist or if the CSS stylesheet is empty.

Here is what the IF statement would look like – it replaces the echo line:

Based on the Blog’s Name

<?php global $blog_id; $themeURL = get_bloginfo('template_directory'); $title = get_bloginfo('name'); $newTitle = str_replace(" ","",$title); if ($blog_id == 15) { echo '<link rel="icon" href="' . $themeURL . '/' . $newTitle . '.ico" type="image/x-icon" />'; } else { echo ''; } ?>

Based on the Blog’s ID

<?php global $blog_id; $themeURL = get_bloginfo('template_directory'); if ($blog_id == 15) { echo '<link rel="icon" href="' . $themeURL . '/' . $blog_id . '.ico" type="image/x-icon" />'; } else { echo ''; } ?>

In both examples, we will only show the custom favicon for blog ID 15.

Understanding the Output

For each code snippet above, the output is for a favicon, for CSS you’ll need to use the following:

Based on the Blog’s Name

Look for:

echo '<link rel="icon" href="' . $themeURL . '/' . $newTitle . '.ico" type="image/x-icon" />';

And replace it with:

echo '<link rel="stylesheet" href="' . $themeURL . '/' . $newTitle . '.css" type="text/css" media="screen" />';

Based on the Blog’s ID

Look for:

echo '<link rel="icon" href="' . $themeURL . '/' . $blog_id . '.ico" type="image/x-icon" />';

And replace it with:

echo '<link rel="stylesheet" href="' . $themeURL . '/' . $blog_id . '.css" type="text/css" media="screen" />';