Сравнение версий

Ключ

  • Эта строка добавлена.
  • Эта строка удалена.
  • Изменено форматирование.

...

If you want to modify the look and feel of your Sellfree you need to navigate to the “Configuration > Website Architecture” section in the admin area.

Image Modified

Select what you want to change and go ahead!

...

This subsection focuses on how to customize the appearance of the website header.

Image Modified

 

The recommended size is 300 px in width by 100 px in height.

...

Click on the dashed underline.

Image Modified

In the subsequent textbox enter your contact telephone number (in our example you can see “8-800-000-000”).

Image Modified

Save the telephone number by clicking on the checkmark button.

Image Modified

The telephone number will appear on the website immediately after saving.

...

Click on the dashed underline.

Image Modified

In the field that appears enter the hours of operation (in our example one can see “We’re open: 8 a.m. – 9 p.m.”

Image Modified

Save the text by clicking on the checkmark button.

Image Modified

The hours of operation will appear on the website immediately after saving.

...

Click on the dashed underline.

Image Modified

Click the down arrow and select the desired option (“Display” or “Hide”).

Image Modified

Save the settings by clicking on the checkmark button.

Image Modified

The online chat will appear on the website immediately after saving.

...

With the special code at hand you need to:

Click on the blue dashed line.

Image Added

In the text area that appears paste the online chat code.

Image Added

Save the settings by clicking the checkmark button.

 Image Added

Web Pages Customization

One can add web pages (for example, “About us” or “FAQ”) to the website using the instructions given in the Content section.

 Image Added

Sidebar Navigation

This is where you can select a display mode of the navigation menu on the website’s web pages. By default the navigation menu is displayed on the left. There are three display modes:

Display Display only sections the sidebar menu.

1.

 Show all pages

2.

Only show topics

3. Hide

left

menu

Image AddedImage AddedImage Added

 

To select a menu display mode one should do the following:

 

Click on the dashed underline.

Image Added

Select a display mode from the drop-down menu by clicking the down arrow.

Image Added

Save the settings by clicking on the checkmark button.

 

Text Direction

This is where you can set the layout of blocks on the website for languages which differ in the direction of reading. It is recommended that you specify the right-to-left text direction for the following languages: Arabic, Persian, Yiddish and Urdu.

The default text direction is left-to-right.

 Image Added

Your Code in the Head and Body Section of Website Template

Sometimes there is a need to place a code in the head and body section of website template (counters, Yandex or Google statistics and other services). This is what this block is meant for. By default it is empty.

To add a code one should do the following:

Image Added

Click on the dashed underline.

Image Added

In the text area that appears paste a html-code.

Image Added

Save the settings by clicking on the checkmark button.

 Image Added

Managing your e-store design

In this section we will show you how to tailor your Sellfree to fit your taste and business objectives. Below are given the settings used for changing the colors on the website.

Image Added


Image Added

Changing a color

If you want to change the color of any section on your website you need to click on a color.

Image Added

This will bring up a window where you can select a desired color from the color palette.

Image Added

You can also choose a color from the color box on the right hand side. Once the color (on the right-hand side) is selected please click the “Add to custom colors“ button to make it appear in the custom colors palette.

Image Added

After the color has been selected you need to click the “OK” button.

Image Added

Once you’ve changed all the colors you want you should click the “Save” button to make them visible on the website.

Image Added

Setting a Website Background Image or Color

...

Next, find out how to set a background image. Click on the “Change” button.

Image Added

This will bring up a window that allows you to select a background image. Please make your choice. After the background image is selected click on the checkmark button to save the selection. The background image will be saved automatically.

Image Added

Next, you need to choose whether the background image should be fixed or it follows you when you scroll. The table below shows how each setting looks like. A small image showing a flower is taken as an example.

Creating a repeating background image

Image Added

 

Setting  

How it looks like on the website

No Repeat

Image Added

 Repeat

TileImage Added

 Horizontal repeat

Tile HorizontallyImage Added

 Vertical repeat

Tile VerticallyImage Added 

Image Added

 

Position of a background image

Sets the starting position of the background image.

Image Added

Let’s take the “Tile Vertically” setting as an example.

Setting

How it looks like on the website

Center

 Image Added

Left

 Image Added

Right

Image Added

 

Image Added

 

Configuring a static or scrolling position for a background image

The “fixed” background image always stays fixed in the position you selected, so the image doesn't move when you scroll   through your page.

Image Added

In the example below we will show a background image positioned on the left and how it will look like on the page.

Setting  

Top of the page

Bottom of the page

Fix Fixed (Look after the position of a flower at top left)

 Image Added 

Image Added

Scroll (Look after the position of a flower at top left)

 Image Added 

Image Added

All modifications need to be saved. So, make sure that you click on the “Save” button after you have completed making your changes.

Image Added

In case the modifications don’t appear on the website (after a page has been refreshed) you should clear your browser’s cache by pressing Ctrl + F5.

...

In such a case, the css-file content should be copied and pasted into the appropriate section.

Image Added

Be sure to save modifications by clicking the “Save” button.

Image Added