Skip to main content

Sell Theme: Logo

Rich Andrews
  • Updated

A properly formatted logo provides users a good user experience by allowing them to quickly identify who and what organization they are purchasing from. Proper formatting also ensures that your logo looks good across the wide range of devices users will be browsing your site with.

Requirements:

  • Logo file in .png format
  • Dark version of your logo named logo.png 
  • Light version of your logo named logo-light.png

sticky_nav.gif logo-light-sample.png

logo-dark-sample.png

Including a Dark and Light version of your logo in transparent .png format is important because as the navigation progresses down the screen, the background adjust to white.

Want the same logo for dark / light?

Duplicate your preferred logo file, name the image files appropriately & follow the instructions below.

 

Uploading Your Logo

To upload your logo, navigate to your Juniper Web admin portal. 

  1. Using the menu on the left-hand side click "Library".
  2. Under "Directories" choose "logo" or if the directory does not exist, please create a "logo" directory. ⚠️ The directory is case sensitive....ensure it's logo not Logo or LOGO 
  3. Delete the current "logo.png" and or "logo-light.png" file 
  4. Upload your logo files
  5. Clear your browser cache or navigate to www.YourWebsiteDomainName.com/clear  replacing YourWebsiteDomainName with your actual domain name

logo_media.gif

Setting Your Logos Height + Max Width

It's important to declare your logos height and max width. 

To achieve this, navigate to your Juniper Web admin portal

  1. Using the menu on the left-hand side click "Settings"
  2. Under Site Configuration, on the right-hand side you will notice "Logo Settings" 
  3. Adjust the max-width and height accordingly.
  4. Clear your browser cache or navigate to www.YourWebsiteDomainName.com/clear  replacing YourWebsiteDomainName with your actual domain name

    logo_size.gif

Advance Logo Adjustments using CSS

Do you know CSS or have a web manager that does? CSS can be used to make further style changes to the logo.

To achieve this, navigate to your Juniper Web admin portal

  1. Using the menu on the left-hand side click "Settings"
  2. Under Site Configuration, on the right-hand side you will notice "Appearance" 
  3. Notice the CSS icon...click the Edit button then add your CSS there.
  4. Clear your browser cache or navigate to www.YourWebsiteDomainName.com/clear  replacing YourWebsiteDomainName with your actual domain name

Learn more about CSS here: https://www.w3schools.com/css 

Related articles