How To Make a Logo On Center in WordPress
Table of Contents
Do you want to make the logo in the center of the header on our theme?
Most Acme Themes provide a flexible option for making your logo in the center. You can find it in the
- Dashboad>Appearance>Customize option
- Header Options>Header Placement>Logo and Advertisement Position
Available Options
- Left Logo and Right Ads
- Right Logo and Left Ads
- Center Logo and Below Ads
If you do not find this option you have to manually position it by using Custom CSS code.
For that, you have to add just two lines of CSS codes to your site. We have a Custom CSS field on the theme. You can simply copy and paste the below code there. It easily makes the logo/Site title and tagline in the center. But Please follow the basic things below for every theme.
- 1. First, log in to your site
- 2. Go to Dashboard
- 2. Go to Appearance > Customize > Layout/Design Options > Custom CSS
- 3. Add the CSS code there.
- 4. If the preview is fine, click on the Save & Publish button to save the changes.
How to Set Logo in the Center on Other Themes?
Since every theme has got its, own class you can not say that a particular code makes an impact. However, try using the following codes in your CSS file.
.site-logo {
width: 100%;
text-align: center;
}
.site-logo-link > img, .custom-logo-link img {
margin-left: 50%;
}
.site-branding {
text-align: center;
}
Now let’s take a look at popular WordPress themes and logo-centering Options:
CosmosWP
CosmosWP completes with three-layer options on the header section. This theme enables users to customize the logo as per the user’s choice. Users can drag and drop the logo by clicking on the “Add Item” button and then adjust the width of the individual elements. Click here for more details.
Astra
The theme comes with a visual drag-n-drop Header Footer Builder. It helps you to bring a lot of freedom while designing the headers and footers. With the help of Header Builder, you can create a centrally positioned logo. Here are the significant details.
OceanWP
The updated theme has an improvement on the Center Header Style. In this theme, a new method is used in which the logo will always be centered no matter the number of menu items in your navigation. If you’re using this theme before the update then you place the logo by selecting it on the left menu field in header > general. Check it out for more details.
Twenty Twenty
This theme includes a site logo setting. This can be used to display the logo or an image of your business or yourself. The logo can be set on your site by going to Customizer then Site Identity. The resolution of the logo is 240px wide by 180px high is recommended. Here are the major details.
Twenty-Twentyone
Twenty-Twenty also comes with a site logo setting. The recommended size is at least 300px wide, or at least 100px tall. The logo is visible in both headers as well as in the footer. The logo in the site header is centered. Here are the major details.
Let us know your thoughts in the comments.
Other SEO Articles:
✅ 13 Essential SEO Tips For WordPress Website
✅Technical SEO For a Website?
If you liked this article, then consider following us on Twitter, Facebook, and LinkedIn.
how to change the size of the header logo in SUPERNEWS Pro
Hello Prince,
If you want to change the logo of SuperNewsPro, go to Appearance > Customize > Site Identity and you will get the options to change the header logo. For more details, please have a look on the Documentation.
I followed instructions above verbatim, and the header remained justified right.
Suggestions
First you need to hide the Advertisement Banner to make the logo in center. Go to Appearance > Customize > Header Options > Header Advertisement and hide the advertisement first. And try by adding the below CSS codes, If the below codes not worked, let us know your site URL as well. We will provide you the best alternative solutions as well.
`.site-logo {
width: 100% !important;
text-align: center !important;
}`
Thank you
Hi, we’re having the same issue of not being able to center our logo.
how to align hamberg menu in left side, search bar in the center and cart icon in the right side..please help me
Hi it all depends on the themes you are using.
Try using https://www.cosmoswp.com/ theme for flexible header setting.
I can’t make my logo image bigger, it is always show very small. Have tried this solution below but won’t work. Can you help?
” code inside acmethemes/core.php you will find the custom-logo size and try it by increasing the height and width. If you want to make the logo center”