How do I create my own interface with CSS?

In addition to the standard interface settings, it is possible to set up an interface via CSS as desired. There are many possibilities here. For example, it may look like this:

Watch out!

For these adjustments, it is advisable to have a basic HTML/CSS. For reference and tips we recommendw3schools.comTo.

Pair with server

In order to use a CSS device, access to a selected folder on an ISI server is required.

Set up access to the server

Via an FTP folder you can access files that are on the server. This makes it possible to access and manage the CSS templates.

An FTP folder must first be created by ISI. Please contact us for this:Professional services.

The FTP data is sent by support and can then be used to log in with an FTP client (for example Filezilla:https://filezilla-project.org/).

Creating FTP directory

You can create an FTP directory via the following steps (Signed out for Filezilla):

1. Go tothe 'Site Manager' (File > Site Manager OR button right below File)
   
2. Then choose 'New Site' here and give the directory you are going to add an appropriate name (for example: website - CSS)
   
3. Then fill in your received details on the right. Under the tab "General" as follows:
   

Host: Receiving from ISI

Port: May you ignore?

Protocol: FTP - File Transfer Protocol
Encryption: Use explicit FTP over TLS if available
Logon Type: Normal
User:Received from ISI
Password:Received from ISI

1. Then go to the tab 'Advanced' tab and enter the received remote directory in the field 'Default remote directory' field and then click on 'OK'.
   

You have now added the site to your FTP client and saved it in your Site Manager. Now when you go to Site Manager by file, you can open the FTP folder to add or modify files here.

When the FTP directory is created to the CSS folder, you can change and add CSS templates yourself (read: duplicate and rename). By default, only the 'default' interface is present. This is the basic interface template that can be used to create a new CSS template.

Creating CSS Templates

Drag or copy the Default folder to the desktop, or any other location where it is easy to find, and rename the Default folder so that you can always go back to the default template.The default interface remains unchanged on the server, so that you can restore it at any time. Gives the Default folder gives a different name, for example, the name of the interface it will be used for. Each interface can have its own CSS folder.

Download the default template at the bottom of the page.

In the folder with the new name you will find the folder 'Style'. This folder contains custom.css files. With these custom CSS templates you can provide existing elements on the site with a different layout. This gives you the possibility to further customize the shop outside the standard interface settings.

Place the entire folder back on the FTP server.
Go to the back office of the shop and link the new template to the interface for which it was created. The CSS overwrites the set interface.
When modifications to an existing CSS template with the interface, it will be saved again in the back office of the shop. If you do not, the shop will not connect to the modified CSS file.

Tip!

Behind your CSS rule, add '!important' behind your CSS rule. This ensures that the shop finds this CSS rule the most important; otherwise there is a chance that your change will be overwritten by the existing standard formatting.

Example:

Div{

Color: Blue!important;

}

Questions and feedback

Are there any questions or feedback? Please contact us:Professional services.

• Related Articles

• Custom menu

  In 'Custom menu' it is possible to adjust the top menu bar. The choice can also be made to show the shopping cart as an icon or in the top menu bar. It is also possible to show the custom menu in the menu bar over two lines. Using the + sign, we ...

• How do I open an FTP folder?

  Set up access to the server Via an FTP folder you can access files that are on the server. This makes it possible to access and manage the CSS templates. An FTP folder must first be created by ISI. Please contact us for this:Professional services. ...

• Interfaces

  It is possible to create an interface for a specific group with customers. The page shows a selection list of interfaces present. Default is selected by default. The Default interface is shown when an unregistered customer visits the webshop (the ...

• Customers

  Here a total overview of all customers registered in the webshop is shown. The following actions are possible to perform on this page: Create a new customer - then you pass the login details to the customer yourself Changing existing customer data ...

• Groups

  In the webshop, customers are placed in a group.A customer only has a skin; a group hangs the rights for all users in the group. A customer cannot function without being divided into a group. When a user is created (via the front of the webshop or ...