Branding and Customizing your store.

In this short tutorial we will show you how to fully customize the look and feel of your store.

This article covers:

• How to change the colors of your VendingBox to match your pages and brand.
• How to add logo images to brand the store and splash pages.

All of the customizing options can be found under Preview.  You will see the two tabs relevant to this guide: 'Preview' and 'Images'.  Browse though them to familiarize, and remember to scroll down in each tab to see all the options available.




Applying your color scheme and layouts.

Color Settings

Click on the color boxes under “Color Settings”.  A palette is provided in each case allowing you to choose the various colors that can be customized.  If you know the color 'code' your brand uses you can copy and paste this here also.  Consider the text colors you choose, which allow best visibility of the text, by using suitable background colors.

The illustration below shows the various elements of your VendingBox that you can customize to your own liking.  Use the “Preview Color Scheme” to apply and proof changes you’ve made. 

When you are happy with a scheme you have chosen, click “Save Settings”

TIP: Choose a color scheme that matches you website and your logo.  You may wish to include your logo on your store, and it is aesthetically best when the colors complement each other.

Grid View Settings

Under "Grid View Settings" you can have your products display in a tiled format.  Some merchants prefer this display format.   What type of products you are selling will generally dictate what type of display format works best.  Try changing the settings and sizes to see what works best for your store, categories and products.

Height and Width

Set the height and width of your VendingBox here. These settings will only apply to the small version of your VendingBox.   Ensure you preview the effects of changes to these settings in the final environment you are diplaying your VendingBox, and that your Vendingbox is sized correctly to your requirements.  (N.B. Generally, the default size works well for most pages - this feature is utilized by developers who wish to customize exactly how they want their VendingBox to appear in Webpages or Facebook)

Adding your logo and brand graphics to your VendingBox

Go to the "Images" tab.  In here you can add a number of graphics features to your store.  In each case, simply browse for the image you wish to use, ensuring the specified sizes are used, and then check the tickbox and save.


Top-left Logo - This allows you to add what is probably to most important aspect of your brand.  Ensure your color scheme matches the logo for a more professional and aesthetically pleasing look.


Grid View Logo - This image or logo is the image that will be present int he top 'center' of your VendingBox.  If you chose not to have the left categories menu show on your store (which is possible under the Grid View Settings > Open in Wide Mode), this space provides you with a place to display your logo.

Welcome Image - You can upload a welcome image for your store here. Customers will see this image rather than a random sample of products when the cart first opens.

Facebook Splash Image - This image appears as the 'gate' image when users access your store via your Facebook page.  This image should be 520x400 png, jpg or gif file. Make sure to indicate that the user should "Click to Enter", or "Open", so that they know how to open the VendingBox.

Follow the instructions as displayed.  Ensure your images and features are sized correctly and that the image file type is that specified.

For free assistance with graphics, customization, logo creation, color schemes and more, please do not hesitate to contact us at support@vendingbox.net