3. Rebranding Options for the Standard Edition Storefront
One of the most important benefits for resellers at the standard edition is that they obtain their own Storefront, which can be fully customized according to their branding guidelines. In fact, once upgraded, standard edition resellers will receive a notification with their Storefront’s URL into which they can log using the credentials previously provided by their Distributor.
In the admin section of their Storefront, with the Standard Edition, resellers can:
Customize the look and feel (rebranding), by selecting their preferred skin (color theme), and setting up the structure of their homepage (sections, images, banners)
This section explains how to make all these rebranding changes.
Rebranding Storefront and Customizing Look & Feel
Standard Edition resellers have a wide range of options to customize their Storefront according to their branding identity, which include:
Select Skin: to select a look that matches the corporate identity of the reseller
Manage Skin: to adapt the look to their branding guidelines
Customize Front Page: customize elements of the page, including the logo, banner, sections, products, and descriptions, etc.
Set the Contact Us page and the Terms of Use.
The sections below provide details on how to implement these types of customization.
Selecting and Managing Skin
This functionality is not available yet. It will be released with the next version of the Standard Edition.
Selecting a Skin
A skin is a pre-saved package of all the customization settings that are eligible for change (colors, fonts, images). Each Storefront comes with a set of predefined skins available; however, users can customize those skins or create their own.
To select a skin:
Log in to the Storefront, go to Settings and click on the Customize Settings tab
Right below the tab, select the Skin option.
Select one of the available skins from the drop-down list.
Note
Although the list is currently deactivated, skin selection will be made available soon.
The reseller’s Storefront will now be updated with the new skin colors.
Creating or Editing a Skin
Apart from the predefined set of skins, authorized Storefront users can create their own skins that best reflect their corporate identity. Note, however, that this functionality will become available in a subsequent release of the Standard edition, so check back for further updates in the section.
Customizing Front Page Settings
Right below the Skin selection field, the system displays two different setting groups in their respective tabs:
Front Page Settings
Contact Us Page Settings
In the Front Page Settings:
Upload the company’s logo by selecting the Your Logo Here button. Upload the image in a pop-up window.
Upload a Storefront banner by selecting the Your Banner Here field. Note the visualization options for displaying rich and adaptable content in the following figure:
Set the front page template by selecting one of the three available options:
static banner
slider with images that rotate every 15 seconds
carousel of images with a description that rotates manually upon the user’s click on the navigation arrows.
Upload the image(s) of the banner and provide a title, description and/or a URL that redirects visitors to a specific webpage when they click on the image. For example, the reseller may want to promote the Office 365 package with the banner, so when an end customer clicks on the banner, they are redirected to the Office 365 product page. The user can upload up to four different images and must provide the URL for every image.
To delete one of the images, click on the Delete record option in the bottom right corner of the Template window. Similarly, to add a new image, select Add record.
Define the primary color by clicking on the Section Title button. A pop-up window is displayed where the user can select the section's color to be applied in various places across Storefront (tab header, sidebar menu, account menu, etc.).
Set the main font for text descriptions across the Storefront. By clicking on the description text box, the system displays a pop-up window asking the user to select the font family, size, and color. The selected font will be Storefront standard font of the Storefront. This means that some parts will display the font as defined in this section, while others will display the font proportionally (e.g. headers will be 10% larger).
Set or edit the button background color and text by selecting the button below the description field.
Set the Terms of Use by selecting the Terms of Use shortcut at the bottom of the page. The system displays a window where the user can specify the terms of use. Format the text with the available rich text functionality.
When the changes above are completed, select Publish in the top right corner of the page to save and apply the Storefront changes.
Note
There shortcuts available for all the above actions right below the Front Page Settings tab, at the top of the page.
Setting Contact Page for Customers and Terms of Use
Update the contact page of their Storefront from the admin section. Define a range of contact information such as contact and address details, map locations, social media profiles, etc. To access these settings, log in to the Storefront and:
Go to Storefront Settings and select the Contact Us Page Settings below the skin selection tab.
Upload a banner. Select the image from the pop-up window and select OK.
Below the banner, update the company information. Use one or more of these blocks, e.g., in the case of companies with more than one location. Selecting any of the blocks shows a pop-up window, asking the user to complete the company name and full address, website, map link, and social media profile links.
4. After making these changes, select Publish in the top right corner of the page to save and apply the changes to the Storefront.
That’s it! The brand-new Storefront of the Standard Edition Reseller is now fully aligned with your corporate identity.
Adding Third Party Plugins
The Standard resellers can integrate their Storefronts with third-party JavaScript plugins by including the plugin’s javascript code in their Storefront. This can be done from the Advanced Settings tab where they can upload the code either in the header or the footer of the Storefront. They can do this using the enhanced editor with syntax highlighting and other helpful features.
In the Advanced Settings tab, they can add third-party JavaScript plugins to their Storefront, using the enhanced editor with syntax highlighting and other helpful features.