Design | NomasVeikals palīdzības portāls

Banner sizes

A standard homepage big banner size is 905 x 375 px. Other banner sizes: 1. Central banner with navigation on the left side – 905 px width / height at discretion. 2. Full width banner – 1216 px width / height at discretion. 3. Sidebar block banner with frame – 230 px width / height at discretion. 4. Sidebar block banner, full width – 282 px width / height at discretion. 5. Mobile version central banner – 395 px width / height at discretion. 6. Other full screen width banners – 290 px width / height at discretion.

Last updated on Jul 20, 2024

Design colours

Shop colour selection Websites colours can be edited at any time, when you wish to make a change. To swap design colours, head to My Store >> Design settings. In the section Design we can edit colours Colours can be changed by using the colour picker or by entering the code of the desired colour. You can get the colour codes here – https://htmlcolorcodes.com/ or from any other page by typing CSS colours in Google Search. Usually 3 colours are used in web design, in special cases up to 5 can be provided, but that is not always desirable. You can generate the colour palette: [Video tutorial](Video pamācība) on the website. When you have found the desired colour palette, click on the colour code and copy it (right mouse click and copy or key combination ctrl-c). Then back at the Design section, we paste the colour code (right mouse click and paste or key combination ctrl-v). When the necessary changes have been made, click the blue Save button and afterwards the red Refresh cache design button. In case of questions or in case of logo development and colour palette preparation, ask for the Brand Guidelines service.

Last updated on Aug 23, 2024

Creating the landing page

In the system it is possible to create a landing page type pages by using different modules, for example, product block modules, banners, text blocks. To create a page like that, you must do the following: 1. In the section – Information pages, we create a new content page. 2. When the information page has been created, we head to the section – Desing >> Layout. Here as well we create a new layout page. 3. We head back to Information page section and open the newly made page. Then we open the Design section and in the list we must find the new layout page. Save the changes. Now the information page is connected with the layout page and we can add and organize page structure. 4. We go back to Design >> Layout and open the new layout page. 5. We can start building an individual page by using the e-store system modules. You can use banner blocks, HTM block modules, product blocks, category blocks, etc. from the available module list. All the modules should be displayed in the section – Full width content below. With this module you can make multiple information and layout pages, each creating an individual layout or content information that you want to reflect on a certain page.

Last updated on Aug 23, 2024

How to add product blocks to the store

In these blocks we can enter the information related to delivery methods or payments. To add product blocks, head to Catalogue >> Product blocks. To create a new block, click the blue [+] button. In the General section enter all the necessary information – name and description of the block. If the store is available in multiple languages, each one should be completed separately. To add pictures to a block or edit its size, open Source code and make the necessary changes. Close Source code. In the Data section it is possible to choose parameters to which the product block applies. Mark all products – mark, if you want to apply the block to all products. Categories – to which categories the block applies. Manufacturer – to which manufacturers the block applies. Ignore products – it is possible to indicate separate products to which the block will not apply. Sequence – Indicate in what sequence the blocks will appear. When the changes have been made, save the page.

Last updated on Aug 23, 2024

How to add a picture to a product

To add a picture to a product, go to Catalogue >> Products. Choose the desired product and open it. In the Image section, select an image from the gallery to add to the product. If additional pictures must be added, click [+]. When the changes have been made, save the page.

Last updated on Aug 23, 2024

Product labels

To add labels to a product, go to Catalogue >> Product labels. In the right corner click “+” to begin creating a new label. Create a new label by clicking “+” on the right side. Creating a label: Sections: Name – In this section, you can choose the label name you want. Fontawesome – Choose an appropriate icon. Text colour – Label text colour. Background colour – Colour, that will appear behind the label text. Sequence – Indicate a sequence, that will appear on the label. When that has been complete, head to “Links” section, where you will be able to attach labels to the products you want. Sections: Add to all products – By clicking this window, you will add labels to all products. Category – In this section, you can select a specific product category, to which you want to add labels. Manufacturers – Add a label to a specific manufacturer. Ignore products – Add separate products, to which the label will not be applied. Status – Ability to turn on/ off label operation. When the desired changes have been made, save them.

Last updated on Aug 23, 2024

How to add a block to the home page Why choose us?

To add a block to the home page Why choose us, go to Design >> Blocks >> HTML blocks. Select Why choose us section. Enter the necessary information. If the store is available in multiple languages, separately fill in the information in each language. Open Code View. Here you can add icons to text. After making changes, close Code View, change status to On and save the page.

Last updated on Jun 28, 2024

How to add a picture to the subcategory

Unlike the main category photo, pictures in the subcategory are horizontal. To add a subcategory picture, go to Catalogue >> Categories and choose the desired subcategory. Select a subcategory, that we want to edit and click the Edit button. In the Data section we add the required photo from the server. Add the photo and save changes.

Last updated on Aug 24, 2024

How to add a photo to the main category

To add a photo to the main category, go to Catalogue >> Categories. Remember, that the main categories photos are vertical. Select a category, that we want to edit and click the Edit button. In the Data section we add the desired photo from the server. When the picture has been added, save the page.

Last updated on Aug 24, 2024

How to add a store logo

Logo sizes, logo format Format and size: 1. SVG format We strongly advise using SVG file format. If you need logo processing, modification or development, you can contact technical support and apply for this service. When using SVG file format, the logo size will automatically adjust. 2. PNG format If it is not possible to insert .svg format logo, then you can upload it in .png format as well. A logo in PNG format must be in specific sizes, that depend on the selected template: - Normal logo: height 30px, width X - Enlarged logo: height 45px, width X - Extra enlarged logo: height 60px, width X Adding a logo: To change the store logo, go to the admin panel and click on My Store >> Design settings. In the Images section click on the logo image and then on the blue “Edit” button. Choose a picture from the gallery and add it. When the logo has been added/ swaped, save the changes. Adding an icon: Tutorial on icon formats and how to add them, can be found here: How to add a store icon

Last updated on Aug 24, 2024

How to add a About Delivery block

To add a About Delivery block to the store, go to Design >> Blocks >> HTML blocks >> About Delivery. You can edit an existing module or add a new one, containing different information. Enter the necessary text. If the store has several languages, information for each must be entered separately. To add a photo to a block, open Code View. Here, to the server we add a photo, that’s meant for the About Delivery block. Remember, we save the image only on the server. Enter the name of the image with which it is saved on the server. Remember not to use spaces, it is better to use [-], for example, about-delivery. Close Code View, change the status to Yes and save the page.

Last updated on Aug 24, 2024

Creating a responsive table

To make the tables responsive and fully understandable on mobile devices, we do the following: 1. Make the table itself with the corresponding number of rows and columns. It can be either in the product description, information page or category description. 2. When the table has been created, click on Tools >> Source Code section. 3. In the opened code view it is necessary to define a class for the table by adding this line: - class=”table-responsive”. 4. When that has been done, click the Ok button and save the changes. 5. A horizontal scroll bar will added to the table, which when moved to the right or left, the table can be viewed in full on mobile devices.

Last updated on Aug 24, 2024

Design settings

Design settings can be found in My Store >> Design settings section. In the Design section it is possible to change the colours of the e-store. To do so, with the left click of the mouse, select the field with the colour code. Then a colour block will open, where you can choose the desired colour. When that has been done, save the changes with the blue Save button. For the changes to be visible in the e-shop, you must restore the design cache. You can do that with the Refresh design cache button. Additional information about design colours can be found here: Design colours. Important! So the changes made in the design section after saving them would be visible in the e-store, you must refresh the design cache. In the Images section you can add the e-store logo, icon and substitute picture. There you can also choose logo templates. Preferably, the store logo should be in .svg image format. The Footer section has an option to specify various information, such as about us, sections to information pages, properties and other. You can also add a cooperation logo. In the Social section you can add links to your social accounts, for example, Facebook, Instagram, Twitter, etc. In the Templates section it is possible to choose various templates for header bar, category menu, product view and other templates. In the Shipping method titles section you can customize the name of your active delivery option types. In the Payment method titles section you can also change the names of the payment options. In the Products section, there is an option to specify the default number of products on the page, the length of the product description, the number of positions on the page, set the limit for the autocomplete field, choose how to sort the products, and also choose the type of list view. In the Images / files Images subsection you can change the basic dimensions of a photo. By default, all sizes are already assembled here so that the pictures are in the appropriate sizes. The Uploads subsection lists the allowed file extensions and Mime types.

Last updated on Aug 24, 2024

Adding Font Awesome icons

To add any of the Font Awesome collection icons, go to https://fontawesome.com/v4.7.0/icons/ Choose the desired icon and click on it. When opening the selected icons page, highlight the name of the icon (in this case “fa-address-card”) and copy it (right mouse click and copy or key combination ctrl-C). Then open the section, where you want to place the icon and paste its name in the desired field. (Right mouse click and paste or key combination ctrl-v). When the changes have been made, click save changes. The icon has been added!

Last updated on Aug 24, 2024

How to add a manufacturer’s logo to products

To add a manufacturer’s logo to the products of the store, head to Catalogue >> Manufacturers. Click on the blue [+] button to add a new manufacturer. Enter the name of a manufacturer. Choose a manufacturers image from the server and add it. Sequence number should be left empty. After making changes, save them.

Last updated on Aug 24, 2024

How to add a store icon

Store icon / favicon Icon format: The icon must be in PNG format and 32 x 32 px. Usually, an icon is a simplified version of the store logo. If you need logo/icon processing, modification or development, you can contact our technical support and apply for this service. Adding an icon: An icon is added in the same place as the logo. In the Admin panel click on My Shop >> Design settings. In the Images section click on the Icon image and then on the blue “Edit” button. Select an image from the gallery and add it. When the icon has been added / swapped, save the changes.

Last updated on Aug 24, 2024

Editing small banners

To change the small banners, from the admin panel go to Design >> Block. There you’ll find HTML Block >> 4 small banners, where you have to press on the yellow “edit” icon. If all 4 banners are necessary, then press the “source” icon. A code view will open. To change an image: 1. If the image is in the map, that’s mentioned in the code (baneri), then you must find the image title in the code and change it. In this example that is: banner_1.png. 2. If the image is in another map, you also must change the name of the map to that where the image is located. 3. The image must be in .png or .jpg format. 4. The recommended size is: 465 x 187 px. 5. Changes must be made in each language separately. 6. At the end you must click on the “source” button and then “save” on the upper right corner of the page. If you do not need all 4 banners, then you’ll have to delete part of the code. By following the shown example, you’ll get 2 banners. If the desired images have not been uploaded in a map, then from the admin panel go to Catalogue >> Products. On the upper right corner, you’ll find a “+” button, by pressing on that, a menu will open. There you must press on the “image” section. After that click on the frame, where an image should be, then a blue icon with a pencil will appear. By clicking on the “edit” button, a variety of maps will appear. By default, banner images can be found in the “0-wd” map and “baneri” subfolder. By clicking on the “0-wd” map, another array of maps will appear, where you must find the subfolder “baneri”. After opening the “baneri” map, on the upper left corner you’ll find a blue “upload” icon. By clicking on it, you can upload images according to the specified parameters. If the desired image cannot be found in any of the mentioned maps, you must change the default code. A manual can be found at the top of the article.

Last updated on Aug 24, 2024

What if the changes do not appear in the store

Sometimes, when some changes have been made, they don’t instantly show up in the store. In that case go to My Store >> Design Settings >> Refresh design cache. It’s mandatory each time after editing!

Last updated on Aug 24, 2024