Customizing the design of the web shop

The appearance of your shop is based on pre-designed templates.
You can pick a suitable design for your shop from a range of templates and then customize it.

Selecting the shop design

To select a design template, log into the Control Panel and then go to the administration area of your shop.

Under «Design Templates» you can select the desired design template for your shop.

Please note that certain elements may be lost if you switch to a different design template. However, if you just want to change the style (e.g. from «Neutral Basic» to «Neutral Light»), nothing will be lost.

When changing from the «Neutral” to «Vision» design, elements such as content pages, categories, products or the menu structure may change or not be carried over.

Customizing the design

After you have selected the design you want, you can start customizing it. For example, you can change the color scheme, modify the USPs, connect your social media channels or even add your own CSS code.

Logo, images and image sizes

To add your business logo, log into the Control Panel from the administration area of your shop. Then go to «Settings» and select «General».

Click the «Upload image» icon to upload your logo.

The size of the logo that will be displayed in the shop depends on the design you have selected and can vary accordingly.

Header and footer of the shop

The header

The header can include other elements in addition to the logo.

You can display your phone number, USPs such as «free shipping» or other bits of information.

To display USPs in the header, go to the administration area and open the «Editor».

At the lower edge of the screen you will see the gear icon . Clicking the megaphone icon displays the available USPs, which you can activate by clicking the respective checkboxes.

Then simply enter the desired text and save your changes.

Footer

You can also add various elements to the footer. For example:

  • Links to your shop’s legal pages
  • Links to social media, such as Twitter and Facebook
  • Logos for payment providers and shipping methods
  • Language selection for multilingual shops

Your CSS code

In addition to the customization options just mentioned, you can also enter your own CSS code.

If you add CSS code, it will be applied to all shop elements except for the ordering process.

You can add CSS code by going to the administration area of the shop, opening the «Editor», clicking the brush icon and then the code icon (</>).

 

Unable to find what you were looking for?

Our support experts are happy to assist you personally!

 

© 2001 - Hostpoint AG