A properly formatted logo makes for a good user experience by allowing your site users to quickly identify from whom and what organization they are purchasing from. Proper formatting ensures that your logo looks good across the wide range of devices with which users will be browsing your site.
Requirements:
- Logo file in .png format
- Dark version of your logo named logo.png
- Light version of your logo named logo-light.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 adjusts 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 B2B Direct admin portal.
- Using the menu on the left-hand side click "Library".
- Under "Folder" choose "logo" or if the folder does not exist, please create a "logo" folder. ⚠️ The folder is case sensitive....ensure it's logo not Logo or LOGO
- Delete the current "logo.png" and or "logo-light.png" file
- Upload your logo files
- Clear your browser cache or navigate to www.YourWebsiteDomainName.com/clear replacing YourWebsiteDomainName with your actual domain name
**IMPORTANT REMINDER: Files uploaded into the Asset Library are public-facing and may be viewable by members of the public—even if the files are not shown on your website. For security reasons, DO NOT upload confidential documents such as password files, private financial records, etc.**
Setting Your Logos Height + Max Width
It's important to declare your logos height and max width.
To achieve this, navigate to your B2B Direct admin portal
- Using the menu on the left-hand side click "Settings"
- Under Site Configuration, on the right-hand side you will notice "Logo Settings"
- Adjust the max-width and height accordingly.
-
Clear your browser cache or navigate to www.YourWebsiteDomainName.com/refresh replacing YourWebsiteDomainName with your actual domain name
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 B2B Direct admin portal
- Using the menu on the left-hand side click "Settings"
- Under Site Configuration, on the right-hand side you will notice "Appearance"
- Notice the CSS icon...click the Edit button then add your CSS there.
- Clear your browser cache or navigate to www.YourWebsiteDomainName.com/refresh replacing YourWebsiteDomainName with your actual domain name
Learn more about CSS here: W3 Schools CSS Tutorial
Comments
0 comments
Article is closed for comments.