Configuring Logos

Last Updated on

A logo is a visual representation of your business. It reflects your company’s name, message and values. Over time, your logo should be immediately recognizable to your customers, which is why Jupiter offers a lot of options for logos.

There are several ways and places you can add and configure your logo. This article also covers the difference between the global and page specific logo.

In this article


Different Types of Logos

There are several logo types which are used in specific situations.

Type Description
Default & Dark Logo This logo will be used as your default logo, and when your header skin is dark.
Light Logo This logo will be used when the transparent header is enabled and your header skin is light.
Sticky Header Logo This logo will be used when the header is in a sticky state.
Mobile Version Logo This logo will be used on mobile devices.
Sub Footer Logo This logo will appear in the sub footer section.
x
Note: SVG logo support has been added since Jupiter 6.0.2.

To upload and use a SVG logo:

1
From the WordPress left menu, go to Theme Options > Global Settings > Site Settings then enable SVG Support.

x
Beware! Make sure you are Administrator and use SVG files from trusted sources. Disable this option after uploading your SVG files for security reasons.
2
Save Theme Options and reload the page. Now you can upload SVG logo to media library. Read following sections to learn about uploading logo in different places.
x
Note: If you are using SVG logo, you don’t need to be worried about retina screens since SVG looks great on all screens.

To have an appropriate none SVG logo for retina screens, you need to export/design your logo at 2x (2 times bigger than normal logo) then use the Width (beside each logo field) option to specify an appropriate value.

For example:

If you want to show your logo at 150×75 pixel in your site, you need to export/design a 300×150 pixel logo then set the width to 150.

It resizes your logo and helps to show it with good quality on retina screens.


Uploading a Logo Globally

The global logo will be used across your whole website.

To upload your global logo:

1
From the WordPress left menu, go to Theme Options > Global Settings > Logo & Title.

2
Find your desired logo type and click on Upload.


3
Specify an appropriate Width value for the logo.

x
Note: Specifying width is only required for SVG logo but you may also do it for a none SVG logo to make it retina ready as explained in above Retina Logo section.
4
Click on Save Settings.

Overriding the Global Logo on a Page

Instead of using one logo for the whole website, there is an option to add a logo only to a specific page.

To upload your page specific logo:

1
From the WordPress left menu, go to Pages and pick a page where you wish to upload your logo.
2
Scroll down to Jupiter Styling Options and enable Override Global Settings.

Configuring logos - Override global settings

3
Find your desired logo type and click on Upload.

4
Specify an appropriate Width value for the logo.
x
Note: Specifying width is only required for SVG logo but you may also do it for a none SVG logo to make it retina ready as explained in above Retina Logo section.
5
Publish or Update your page.

To add a logo in the footer:

1
From the WordPress left menu, go to Appearance > Widgets.

Configuring logos - Widgets

2
On the Widgets page, drag and drop the Text widget onto one of the Footer Widget Areas.

Configuring logos - Footer Widget Areas

3
Inside the text widget Content, add the text below and customize it to your logo URL.

<img src="Link-To-Your-Logo" alt="" />

x
Note: To learn more about widgets, check all the articles in the Widgets category.
Was this helpful?

Related Forum Topics

There is no related forum topic

Previous Article:
Next Article:

Can't find what you're looking for?

Open New Ticket