How can we help you today?

How to Change the Site Logo Size in SharePoint Classic Pages

If you would like to change the size of your SharePoint site logo, you are able to do this in the Theme Builder:


Before
After





TABLE OF CONTENTS


Before we begin

  • Changing the size of the logo is possible to a certain limit with the standard Theme Builder functionality. We will start with showing you how to do that, and if you need to exceed those limits, you will need to use some CSS magic. Please read the article further to discover both options and use what's best for you.
  • This article is for classic pages. If you want the same solution for Modern Pages, please check this one out: How to Increase the Logo Size in Modern Pages

Option 1. Change the Logo Width with ShortPoint Theme Builder


STEP 1. Open the Theme Builder


Please click the cog wheel on the top of your site and choose Site Contents.


From the Site Contents go to ShortPoint Dashboard > Theme Builder and click Customize my site.


STEP 2. Find the Logo Width Settings


Go to the Header in the Theme Builder menu:



Then select Logo:



STEP 3. Change the logo width


Customize the Logo Width and press Publish button:



Done!


There is a limit on how much you can change the logo width in Theme Builder at the moment.
If you would like to have more flexibility on it, you can do this with adding a Custom CSS code.


Option 2. Applying Custom CSS to Change the Size of the Logo


Important: Your custom image which you would like to use as a logo, should be large, otherwise it will not be possible to enlarge it more than its actual size.

STEP 1. ShortPoint Theme Builder


Please click the cog wheel on the top of your site and choose Site Contents.


From the Site Contents go to ShortPoint Dashboard > Theme Builder and click Customize my site.


STEP 2. Open the Custom CSS Utility


Navigate to the Utilities > Custom CSS and put this code in the required field:


#DeltaSiteLogo img {
max-width: 120px;
}

.ms-siteicon-img {

max-width: 150px;
max-height: 150px;
}
Note: You are welcome to change the values in pixels to fit your needs.


Press Applyand it will resize your logo according to your customization:




STEP 3. Publish your changes


Finally, press the Publish button:



That's it.

Note: If your Logo goes over Title or Menu like on the last screen, please in the Theme Builder go to the Header > Site Title and change the Margin Left. For  the Menu,  in the Theme Builder,  go to Menus > Paddings & Margins and change the Menu Margin.

Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 15 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more