Home » Support » The webshop's design

The webshop's design

Starter Yes
Mini Yes
Active Yes
Pro Yes

When talking about the webshop's design it often means what the shop looks like for the customers. In the design you can edit for example the colours, the text font and how the shop is built on the customer side. The shop's content, like category and content pages are edited directly in the page's settings and the products in the product's settings.

In the administration of the shop, the design is about all the areas except the actual content area. In the below picture you can see the general structure with it's different areas and the area in the middle marked with a red frame is the content area, which shows the content from the different shop pages. The design of the content area can not be changed a lot in the design settings, except for the normal colour and font settings. In the design settings you can edit all the other areas around the content area, such as the headers, footers and side bars. In those it's possible to add different ready made or own made design elements.


The webshop's theme

The design shown on the customer side comes mostly from the used theme. The theme can also have some restrictions in how it can be edited. On the Design > My themes page you can see all the themes created in the shop and the top theme is the one that is use at the moment. At the bottom of the page you can add one of the ready made themes or you can import a theme file to get a new theme in the shop.

Here from the "My themes" page you can also edit and view the different themes without actually having to activate them on the customer side. The active theme is the one used in the shop, but in the list you can also find links to the design settings and the view of the other themes.

Except the formatting that comes with the theme you can also on the Settings > General settings > Advanced settings page add jQuery and CSS codes that affect the shop design.


Choosing and changing themes

On the Design > Quick design and Design > My themes pages you can change the theme to one of the other ready made themes in the shop. These ready made themes in the shop system are meant to be used together with a separate mobile view, they are not so to say responsive. It is also possible to import theme files with responsive themes, these theme files can be downloaded from our theme store here. Responsive themes adapt automatically to the width of different screens and then there is no need for a separate mobile view. The responsive themes are a bit more restricted in how they can be edited.


The webshop's mobile view

On the Settings > General settings page you will find the setting for the mobile view and there is a drop down menu with the following options.


Mobile view: Optimised for mobile shop

With this setting a separate simplified mobile view will be shown when a customer comes to the shop using a mobile phone, this settings also allows the customers to place orders. All the shop functions are not available in this mobile view, for example there is no log in and the product ratings are missing. The separate mobile view uses an automatic design and there are no settings to change that design. If you want to make changes to it you need to use code and here on our support page you can find some ready made example codes that you can use: https://www.vilkasgroup.com/support/changing-the-mobile-view-design

Mobile view: Optimised for mobile website

This settings uses the same kind of design as "Optimised for mobile shop", but it has no basket. This view can be used if for some reason you would like to only show your site and products, but don't want the customers to be able to buy from a mobile phone.

Mobile view: Do not use

With this setting there is no separate mobile view used at all, instead the normal design is shown on all kinds of devices. This setting is recommended when you are using a responsive theme where the design is built to automatically adopt to the device's screen size.


Responsive themes

In our theme store there are several modern and responsive themes that can be downloaded and imported to the shop.

You can either import these themes to the shop by yourself following the instructions on the theme support page or you can buy the implementation and editing of a theme as an extra service from us. The responsive themes are not as easily editable as the ready made themes in the system, that since the elements in the responsive themes can have design codes that might change the size, position and visibility on different screen sizes.


Professional design

Here at Vilkas we have project workers who are specialised in design and can create a unique design for your shop according to your wishes. There are extra services for this that you can read more about here. You can buy services for smaller changes to your design or bigger updates with completely new designs. Examples of designs that our design team have created and different themes can be found amongst our references here.

Share on social media