How To Add Logo and Copyright Information To Our Theme

In this guide, ‘How To Add Logo and Copyright Information To Our Theme’ , we will look at how to add a logo to our theme. We will not stop there, however, we will also add some copyright information to our theme dynamically.
The last time we met, we learned how to add a basic menu to our website dynamically.
If you follow other theme development guide, you will notice that they focus on adding the logo and other information using custom post types. While there is nothing exactly wrong with this, we will not be using this approach. Instead, we will use the customized to add pieces of information to our website. This is so, because, if you want to redistribute your theme on wordpress.org, it is required that you follow our approach. Remember, we are showing you how to be a professional theme developer who can distribute his/her theme to the whole world.
In a later post, we will implement custom post types for a plugin and include them in our theme.
For now, let’s continue on our guide ‘How To Add Logo and Copyright Information To Our Theme’.

How To Add Logo and Copyright Information To Our Theme.

STEP ONE:
Enable logo in our customizer.
Visit the functions.php file in your theme directory. Add the following code,
function martins_business_one_config() {
add_theme_support( ‘custom-logo’, array(
‘height’ => 85,
‘width’ => 160,
‘flex-height’ => true,
‘flex-width’ => true
) );
}
add_action(‘after_setup_theme’, ‘martins_business_one_config’, 0);

I used the function of martins_business_one_config() because I will be adding some configurations to this function in later guides.
Learn about the add_theme_support here
Also, enabling a height and width value will make sure the user is advised as to the values for the logo to be uploaded.

You can see that that values here, are exactly what we provided in the functions file.
Now, click on Appearance => customizer => site identity. Upload a logo for your website. You could choose to crop it. Remember that we used a flex-height and flex-width. These mean, that you could make the height and width flexible. Add an alternate text for your logo and publish it.
DISPLAY LOGO ON FRONTEND.
To display the logo at the frontend, go to the header.php file and locate where the logo is supposed to reside. Replace the logo text with:
<a href=”<?php echo home_url(‘/’); ?>”>
<?php if(has_custom_logo()): ?>
<?php the_custom_logo(); ?>
<?php else: ?>
<?php bloginfo(‘title’); ?>
<?php endif; ?>
</a>

In the code above, we check to see if there is a logo uploaded. If there is none, we use the title of the theme. But if there is a logo uploaded, we use the logo instead.
Note: For your logo, try to use an image or logo that is exactly right for the logo area on your theme.
View your theme and you should see your logo at the front-end.

HOW TO ADD COPYRIGHT INFORMATION TO OUR THEME.

We will also use the customizer to add copyright information to our theme. To achieve this, I love to create all my customizer codes in a separate file called customizer.php/

So, head over to your themes folder and create a folder called inc. It is in this folder, that we will create additional files to be used by our theme, like, customizer files and some template-part files. More on template files later.

In our inc folder, create a file called customizer.php.

Now include or require the customizer file to be loaded in our functions.php file with the code,

require_once get_template_directory() . ‘/inc/customizer.php’;

In customizer.php, create a function that holds the $wp_customize class. Then using an object of $wp_customize, we add a section with an array of a possible title and description.

I used sec_copright as an id, to identify that this is a section.

Next up, we will add the type of field settings to our section. There are two primary types of settings. The Options and theme_mod settings(theme modification). WordPress codex tells us that the Options setting should hardly ever be used. This is because the Options stores its data in the wp_options table of the WordPress database and applies it to the site regardless of the theme. What we want, is a situation were our customizer code applies to our theme and not to the site regardless of theme. That is the reason why we choose theme_mod for our setting type.

We also apply a security feature to our text, and that is, sanitize_text_field.

Now, we can add our text control to the section.

Finally, we hook to a WordPress function called customize_register.