The WordPress site logo feature was added in WordPress 4.5. Some are referring to it as a “custom logo” or “theme logo support,” but they are all referring to the same thing. Theme developers can now add one line of code to their themes to enable easy support for you to add a custom logo to your WordPress site, via the Customizer.
This tutorial will be geared towards teaching site owners how to use the WordPress site logo feature. Let’s get started. Or jump straight to the video.
SEE ALSO: How to Add a Favicon in WordPress (Site Icon)
Find the Site Logo in the Customizer
After logging into your WordPress admin area…
- Navigate to Appearance > Customize
- Click on Site Identity
- Site Logo should be one of the first options
Create/Crop Your Logo
Before adding your logo to WordPress, you’ll want to make sure its dimensions are close to the dimensions that your theme recommends for custom logos.
When you click the Select Logo button, you’ll see the WordPress Media Library. At the very top, you’ll see a note that says Suggested image dimensions: 000×000. Before uploading or choosing an image, I recommend you have something that is at least close to that size. Or if your theme recommends a wide & short logo, make sure your image is also wide & short. If it recommends a square, make sure your image is also a square.
Upload or Select a Logo
Once you have a an appropriately-sized logo…
- Click Select Logo if you haven’t already
- Either choose the image from your Media Library, or drag’n’drop your image into the Media Library to upload it
- Click the Select button in the bottom-right corner
Crop Your Site Logo (optional)
If you need to crop your logo, you can do so in this step. Click, hold & drag from any one of the corners (or the small, white boxes on the outer edges of the image). The area that will get cropped out of the image will be faded out with a dark overlay.
If your logo is already the perfect size, just click Skip Cropping. If you’ve made adjustments, click the Crop Image button.
You’ll see your new site logo appear right away in the Customizer.
Removing Site Title & Tagline
You may have previously had your site title & tagline appearing in your site’s header area. Now that you’ve added your company logo, the additional text might be overkill. Let’s look at the options for removing it.
Uncheck the “Display Site Title and Tagline” Box Recommended
You should see a checkbox in the WordPress Customizer, underneath the “Tagline,” that says “Display Site Title and Tagline.” Simply uncheck this box to remove all the text from your header, and just display your site’s logo.
Remove Either the Title or the Tagline
If you’d like to delete only one or the other (site or tagline), you can delete the contents of the appropriate input box.
NOTE: This will remove the information from the General Settings page as well, which might be used in other areas of your site (SEO settings, email notifications, etc.). That’s why I recommend removing both, using the checkbox.
Save & Publish
Be sure to click the Save & Publish button in the top-left corner of the Customizer to make your new WordPress site logo appear on your live site.
WordPress Site Logo Tutorial Video
WordPress Site Logo Theme Support
Both the Twenty Fifteen & Twenty Sixteen themes have been updated to include support for site logos. Check with your theme developer to see if they will add support, or install any updates to your theme. If support was added, you’ll see it in the Customizer.
Developers
Here’s the line of code to enable theme support for a site logo:
add_theme_support( 'site-logo', size );Here’s an example of how the Twenty Sixteen theme has setup custom logo support:
add_theme_support( 'custom-logo', array(
'height' => 240,
'width' => 240,
'flex-height' => true,
) );In case you need to reference it, here’s the official post from WordPress.
What do you think of the WordPress site logo feature? Let me know if you have any trouble implementing it in the comments, or share a link to your beautiful new logo :-)
We Recommend
https://kinsta.com › wordpress-hosting
Fast and secure infrastructure, worldwide CDN, edge caching, 35 data centers, and enterprise-level features included in all plans. Free site migrations.
https://gravityforms.com › features
Create custom web forms to capture leads, collect payments, automate your workflows, and build your business online. All without ever leaving WordPress.
Leave a Comment