«Будь швидким або помри»! Будь лідером з NeoSeo, деталі акції...

Налаштування модуля Глобальні налаштування SEO-магазину

Модуль "Глобальні налаштування SEO-магазину" дозволяє змінювати зовнішній вигляд Інтернет-магазину на OpenCart, {SEO-Магазину} прямо з адмінки. Ви легко можете змінювати елементи дизайну, загальний стиль, колір кнопок, липке меню, оформлення основного меню та інші складові сайту.

Для налаштування модуля необхідно перейти в адміністративну панель сайту і вибрати розділ "Додатки"->"Модулі". В списку модулів вибрати "NeoSeo Глобальні налаштування магазину" (в деяких версіях можливо назва: "NeoSeo Юнистор") і натиснути на кнопку "Редагувати":

Модуль

Після цього на екрані з'явиться вікно редагування налаштувань модуля:МодульТакож, перейти до вікна редагування налаштувань модуля можна, натиснувши на пункт меню "Налаштування оформлення" в адміністративній панелі сайту:Модуль 2

Вкладка "Параметри"

Вкладка "Параметри" дозволяє задати персональні налаштування для зовнішнього вигляду модулів сайту, кнопок, пагінацію, посилань, табів, а також задати загальні налаштування оформлення сайту (колір фону, загальний стиль оформлення, логотип).

Дана вкладка складається з розділів: «Основні параметри", "Налаштування модулів", "Кнопки", "Кнопки наверх", "Налаштування пагінації", "Налаштування посилань", "Налаштування табів".

Розділ «Основні параметри" призначений для налаштування наступних опцій:

  • Логотип. Поле, призначене для додавання / редагування логотипу сайту. Для додавання логотипу, натисніть лівою кнопкою миші на зображення логотипу, а потім на кнопку "Редагувати". Поле є багатомовним, тобто дозволяє додати логотип для кожної мовної версії сайту:

Модуль 3

  • Загальний стиль. Поле, призначене для вибору загального стилю сайту:Модуль 4

При виборі значення flat (плоский дизайн), сайт матиме такий вигляд:Модуль 5

При виборі значення Material design (матеріал дизайн), сайт матиме такий вигляд:Модуль 6

  • Основний колір фону. Поле, призначене для вибору кольору фону сайту:Модуль 7

Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

  • Фонове зображення. Поле, призначене для вибору зображення, яке буде виступати в якості фону сайту. Для додавання фонового зображення, натисніть лівою кнопкою миші на поле, а потім на кнопку "Редагувати":Фонове зображення

Для прикладу, виберемо зображення і встановимо його в якості фону:

Модуль 7

В результаті, дане зображення встановлено в якості основного фону:Фон зображення

Якщо в якості фону не потрібно використовувати зображення, залиште це поле порожнім.

  • Код шеринга в соціальні мережі. Дана опція дозволяє додати в картку товару кнопки для переходу в соціальні мережі, наприклад, кнопки переходу в twitter, facebook, googleplus. Для прикладу, встановимо кнопки переходу в twitter, facebook, googleplus. Для цього, в даному полі введіть наступний код:

<Div id = "share" class = "share-top"> </ div>

<Script>

$ ( "# Share"). JsSocials ({

showLabel: true,

shareIn: "popup",

shares: [ "twitter", "facebook", "googleplus"]

});

</ Script>

В результаті, в картці товару можливий перехід на обрані соціальні мережі:Модуль 8

  • Персональний css. Дане поле необхідно заповнювати в тому випадку, якщо Ви хочете додати свої персональні налаштування для сайту: додати інше стильове оформлення. Для прикладу, на головній сторінці сайту відображається рядок пошуку:Модуль 9

Приховуємо рядок пошуку з головної сторінки. Для цього не потрібно змінювати код шаблону Вашого сайту, досить ввести необхідне стильове оформлення в поле "Персональний css":Модуль 0

В результаті, на головній сторінці сайту, пошуковий рядок не відображається:Модуль 01

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 02

Розділ "Налаштування модулів" призначений для налаштування колірного оформлення модулів:Модуль 03

Даний розділ дозволяє налаштувати наступні опції: колір заголовка блоку, міжлітерний, колір рамки блоку, колір заголовків, колір тексту.

Щоб змінити колір модуля виберіть необхідні опції і задайте бажані кольори. Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступні кольорове оформлення:Модуль 03

В результаті, блок модуля буде мати наступний вигляд:Модуль 04

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 05

Розділ "Кнопки" призначений для налаштування колірної схеми кнопок сайту:Модуль 06

Даний розділ дозволяє налаштувати наступні опції: колір фону кнопок; колір тексту кнопок; колір фону кнопок при наведенні; колір тексту кнопок при наведенні; колір іконок порівняння, лупи, додавання в обрані.

Щоб змінити колір кнопок виберіть необхідні опції і задайте бажані кольори. Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступне кольорове оформлення:Модуль 07

В результаті, кнопки на сайті будуть мати такий вигляд:Модуль 08

Розділ "Кнопка наверх" призначений для налаштування кольору кнопки "Вгору":Модуль 001

Даний розділ дозволяє налаштувати наступні опції: колір фону кнопки вгору; колір тексту кнопки вгору; колір фону кнопки вгору при наведенні; колір тексту кнопки вгору при наведенні.

Щоб змінити колір даної кнопки, виберіть необхідні опції і задайте бажані кольори. Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступне кольорове оформлення:Модуль 08

В результаті, кнопка "Вгору" буде мати такий вигляд:Модуль 009

А кнопка "Вгору" при наведенні буде виглядати таким чином:Модуль 008

Розділ "Налаштування пагінації". Даний розділ дозволяє налаштувати колірну схему пагінації:Модуль 13

Пагінація - це порядкова нумерація сторінок, яка зазвичай знаходиться вгорі або внизу сторінок сайту.

Даний розділ дозволяє вибрати колір фону посилань, колір тексту посилань, колір фону посилань при наведенні, колір тексту посилань при наведенні, колір фону активного посилання, колір тексту активного посилання.

Щоб змінити колірну схему пагінації, виберіть необхідні опції і задайте бажані кольори. Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступне кольорове оформлення:Модуль 14

В результаті, пагінація на сайті буде мати наступний вигляд:

Модуль 15

Розділ "Налаштування посилань". Даний розділ дозволяє налаштувати колір посилань на сайті: колір тексту посилань і колір тексту посилань при наведенні.

Щоб змінити колір посилань, виберіть необхідні опції і задайте бажані кольори. Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступне кольорове оформлення:Модуль 16

Таким чином, посилання на сайті буде мати наступний вигляд:Модуль 17

Розділ "Налаштування табів". Даний розділ дозволяє налаштувати колірну схему табів: колір фону табів, колір тексту таба, колір фону активного таба, колір фону табів при наведенні, колір тексту табів при наведенні.

Щоб змінити колір табів, виберіть необхідні опції і задайте бажані кольори.

Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".

Для прикладу, задамо наступне кольорове оформлення:Модуль на сео-магазин

В результаті, таби на сайті будуть мати наступний вигляд:Модуль 009

  1. Вкладка "Шапка".

Вкладка "Шапка" призначена для роботи з верхньою частиною дизайн-макету веб-сторінки. Дана вкладка містить наступні розділи: липке меню, верхній банер, верхнє меню, основний контент, основне меню.Модуль 008

Розділ "Липке меню". Липке меню - це фіксоване меню при прокручуванні сторінки. Для відображення його на сайті необхідно встановити такі опції:

  • Використовувати липке меню. Щоб відобразити липке меню на сайті, в даному полі виберіть значення "Включено":Глобальне налаштування

Після цього, при прокручуванні сторінок в шапці сайту з'явиться липке меню:Модуль 022

  • Тип липкого меню. У модулі "NeoSeo Юністор" існує можливість вибору типу липкого меню:Модуль 008

Перший тип - "Пошук + телефони" виводить в липке меню рядок пошуку, а також телефони для зв'язку:Модуль 000

Другий тип - "Каталог + меню" виводить в липке меню каталог товарів, а також одне з перерахованих меню (верхнє меню, головне меню, інформація в підвалі, підтримка в підвалі, особистий кабінет), які необхідно вказати в полі "Джерело пунктів меню". Для прикладу, виведемо в липкому меню верхнє меню:Модуль 90

В результаті, липке меню буде мати наступний вигляд:Модуль 91

  • Колір тексту. Поле, призначене для вибору кольору тексту в липкому меню:0 модуль
  • Колір фону. Поле, призначене для вибору кольору фону липкого меню:Модуль 92
  • Фонове зображення. Поле, призначене для вибору зображення, яке буде виступати в якості фону липкого меню:Модуль 93
  • Колір іконок. Поле, призначене для вибору кольору іконок в липкому меню:Модуль "Глобальне налаштування"

Для прикладу, зазначимо наступне колірне оформлення липкого меню:Модуль 93

В результаті, липке меню буде мати наступний вигляд:Модуль 94

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 95

Розділ "Верхній банер". Для відображення на сайті верхнього банера необхідно встановити такі опції:Модуль 96

  • Включити верхній банер. Щоб відобразити верхній банер на сайті, в даному полі виберіть значення "Включено":Модуль 97
  • Висота банера. Поле, призначене для вказівки висоти верхнього банера. Для прикладу, зазначимо значення 400:Модуль 011
  • Колір фону верхнього банера. Поле, призначене для вибору кольору фону верхнього банера. Для прикладу, зазначимо білий колір фону:Модуль 990
  • Фонове зображення. Поле, призначене для вибору фонового зображення верхнього банера. Поле є багатомовним, тобто дозволяє додати зображення банера для кожної мовної версії сайту:Модуль для інтернет-магазину "Глобальне налаштування"
  • Посилання на банер. Якщо необхідно зробити зображення клікабельним (тобто, щоб при натисканні на зображення відбувалося перенаправлення на певну сторінку) введіть необхідне посилання в цьому полі:Модуль 009

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 008

В результаті, на сайті відображається верхній банер із заданими параметрами:Модуль 088

Розділ "Верхнє меню". Даний розділ дозволяє вибрати джерело пунктів меню в шапці сайту, а також налаштувати колірне оформлення верхнього меню:Модуль 889

Розділ "Верхнє меню" містить наступні опції:

  • "Джерело пунктів меню". Дана опція дозволяє вибрати в якості пунктів меню один із запропонованих варіантів:Модуль 989
  • Розташування іконок для пунктів меню. Опція дозволяє вибрати розташування іконок в обраному меню: встановити їх справа або зліва від пунктів меню:Модуль 091
  • Висота верхнього меню. Поле, що дозволяють вказати необхідну висоту верхнього меню:Модуль 092
  • Висота тексту верхнього меню. Поле, що дозволяють вказати необхідний розмір шрифту для тексту, який відображається у верхньому меню:
  • Колірна схема верхнього меню. Щоб змінити колір верхнього меню, виберіть необхідні опції і задайте бажані кольори.

Модуль "Глобальні налаштування".

Важливо !!! Не можна використовувати формат кольору rgb, наприклад "rgb (255, 157, 87)". Правильним буде "# ff9d57".Модуль 093Модуль 900

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль для OpenCart

Розділ "Основний контент". Даний розділ дозволяє задати необхідне оформлення основного контенту в шапці сайту, а також налаштувати його вміст (номера телефонів, час роботи, часто використовувані запити):Модуль для OpenCart  1

Для оформлення основного контенту шапки сайту, необхідно заповнити поля:

  • "Висота блоку";
  • "Колір фону" або "Фонове зображення".Модуль 012Модуль 011

Для налаштування номерів телефонів і графіка роботи заповніть поля «Телефон 1», «Телефон 2», «Телефон 3» і «Час роботи».

Важливо! Якщо Ви хочете, щоб перед номером телефону відображався логотип оператора мобільного зв'язку, Вам необхідно буде ввести:

Для «Київстар» <i class = "phone-kyivstar"> </ i> і номер телефону, тобто <I class = "phone-kyivstar"> </ i> +380 67 67-07-647

Для «Life» <i class = "phone-life"> </ i> і номер телефону.

Для «Vodafone» <i class = "phone-vodafone"> </ i> і номер телефону.Модуль для OpenCart Модуль 014

Для додавання рядка з часто використовуваними запитами пошуку необхідно заповнити відповідне поле:Модуль на OpenCart

В результаті під рядком пошуку відобразяться додані запити. При натисканні на запит, він автоматично відобразиться в рядку пошуку.

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль для сайту

Розділ "Основне меню". Даний розділ дозволяє вибрати джерело пунктів основного меню сайту, а також задати його необхідне оформлення:

Модуль 123

Розділ "Основне меню" містить наступні опції:

  • "Джерело пунктів меню". Дана опція дозволяє вибрати в якості пунктів меню один із запропонованих варіантів:Модуль для OpenCart  2
  • Тип меню. Опція дозволяє вибрати необхідний тип меню: горизонтальне меню, вертикальне меню:Модуль 098
  • Розташування іконок для пунктів меню. Опція дозволяє вибрати розташування іконок в обраному меню: встановити їх справа або зліва від пунктів меню:Модуль "Глобальне налаштування".
  • Висота верхнього меню. Поле, що дозволяє вказати необхідну висоту основного меню:Модуль 104
  • Висота тексту верхнього меню. Поле, що дозволяє вказати необхідний розмір шрифту для тексту, який відображається у верхньому меню:Модуль 101
  • Оформлення основного меню. Для зміни зовнішнього вигляду основного меню, виберіть необхідні опції і задайте бажані параметри.Модуль 105

Для прикладу, зазначимо наступні параметри:Модуль 106Модуль 107

В результаті отримуємо такий вигляд основного меню:Модуль 1

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 2

Вкладка "Підвал".

Підвал інтернет-магазину (ІМ) - це його нижня частина, яка відображається на всіх сторінках Вашого ІМ. Тут Ви можете вивести контактну інформацію, особистий кабінет покупця, інформацію про службу підтримки і т.д.Модуль 09

Для редагування "Подвалу" сайту необхідно вибрати вкладку "Підвал". Підвал ІМ підрозділяється на 3 частини: верхня, середня і нижня.

Модуль 08

Верхня частина підвалу складається з двох секцій, які можна заповнити необхідною інформацією, а також налаштувати їх відображення:Модуль 78Модуль для сайту

Середня частина підвалу розділена на 3 колонки. У кожному стовпчику можна вивести Ваш текст або відобразити необхідне меню.Модуль 90

Важливим нюансом є використання тега <br>. Використовуйте його, якщо в тексті необхідно зробити перенесення на наступний рядок. Після додавання всіх змін необхідно натиснути кнопку "Зберегти".Модуль 54

У нижній частині підвалу можливо додати необхідний напис, посилання на соціальні мережі, а також вивести список платіжних систем, з якими працює ІМ.Модуль 63

Для додавання посилань на соціальні мережі, в поле "Соціальні мережі" додайте наступний код:

<Div class = "socials">

<a href="#" class="vk"> <i class = "fa fa-vk" aria-hidden = "true"> </ i> </a>

<a href="#" class="fk"> <i class = "fa fa-facebook" aria-hidden = "true"> </ i> </a>

<a href="#" class="yt"> <i class = "fa fa-youtube-square" aria-hidden = "true"> </ i> </a>

<a href="#" class="tw"> <i class = "fa fa-twitter" aria-hidden = "true"> </ i> </a>

</ Div>

Для додавання списку платіжних систем, в поле "Платіжні системи" додайте наступний код:

<Div class = "payments">

<a href="#" class="visa"> </a>

<a href="#" class="master"> </a>

<a href="#" class="webmoney"> </a>

<a href="#" class="cash"> </a>

<a href="#" class="qiwi"> </a>

</ Div>

Після додавання всіх змін необхідно натиснути кнопку "Зберегти".Модуль 098

  1. Вкладка "Контакти".

Сторінка контактів Інтернет-магазину повинна містити:

  • Контактні телефони (бажано із зазначенням адресатів);
  • Email-адреса (адреси) та форму зворотного зв'язку;
  • Фізична адреса офісу та час його роботи;
  • Карту або маршрут, як дістатися.

Для редагування сторінки контактів необхідно перейти у вкладку "Контакти". Вона складається з трьох розділів: секції, карта і форма зв'язку.Модуль 98

Розділ "Секції". Для додавання секцій на сторінку контактів необхідно перейти по вкладці "Контакти" -> "Секції" і в полі "Показувати секції" вибрати значення "Включено".Модуль 97

Після цього можна вводити необхідні дані в секції. Їх всього чотири.Модуль 95

Важливим нюансом є використання тега <br>. Використовуйте його, якщо в тексті необхідно зробити перенесення на наступний рядок. Після додавання всіх змін необхідно натиснути кнопку "Зберегти".Модуль 89

Розділ "Карта". Для того, щоб додати карту на сторінку контактів необхідно в полі "Показувати карти" вибрати необхідну карту - Google або Яндекс:Модуль 94

Після цього перейдіть за посиланням https://developers.google.com/maps/documentation/javascript/get-api-key і отримаєте ключ. Даний ключ вставте в поле "Google api key" та заповніть поля "Широта" і "Довгота".Модуль 45

В результаті, на сторінці контактів відображається вибрана карта:Модуль 45

Розділ "Форма зв'язку". Для додавання форми зв'язку на сторінку контактів необхідно перейти у вкладку "Контакти" -> "Форма зв'язку" і в полі "Показувати форму зв'язку" вибрати значення "Включено"Модуль 099

В результаті, на сторінці контактів буде доступна форма зв'язку:Модуль 57

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль 26

7.Вкладка "Категорії".

Дана вкладка дозволяє налаштувати відображення товарів в категоріях. Для редагування даних налаштувань необхідно перейти у вкладку "Категорії":Модуль 86

Дана вкладка містить наступні поля:

  • Відображення товарів за замовчуванням. Дане поле призначене для вибору типу вікна товарів за замовчуванням в категоріях / пошуку / виробниках і т. Д .. Дане поле містить значення: "Сітка", "Список", "Таблиця":Модуль 88

При виборі значення "Сітка", товари будуть мати наступний вигляд:Модуль 65

При виборі значення "Список", товари будуть мати наступний вигляд:Модуль 32

При виборі значення "Таблиця", товари будуть мати наступний вигляд:Модуль 21

  • Кількість колонок. Дане поле призначене для вказівки кількості колонок в списках товарів:Модуль 84
  • Друга картинка при наведенні. Дана опція дозволяє відображати другу картинку товару, при наведенні покажчика миші на зображення товару:

Картинка без наведення покажчика миші на товар        Картинка при наведенні покажчика миші на товар

Модуль 097Модуль для сео-магазину

 

Відображати підкатегорії. Якщо категорія містить підкатегорії, то при виборі в даному полі значення "Опублікувати", дані підкатегорії будуть виведені на вітрину:Модуль 0985

При виборі в полі значення "Приховати", підкатегорії не показуються на вітрині:Модуль 98

Для вказівки необхідного розміру картинки підкатегорії, вкажіть висоту і ширину картинки в полях "Висота картинки підкатегорії", "Ширина картинки підкатегорії":Модуль NeoSeo

Відображати атрибути на блоці товару. При виборі в даному полі значення "Включено", атрибути товару будуть виведені в блоці товару:Модуль NeoSeo

Наступні поля доступні для редагування, при виборі значення "Включено" в поле "Відображати атрибути на блоці товару" і призначені для налаштування виводу атрибутів товару:Модуль NeoSeo 1

8.Вкладка "Товар".

Вкладка "Товари" дозволяє редагувати налаштування виводу товарів та їх характеристик на сторінці. Для редагування даних налаштувань необхідно перейти у вкладку "Товари":Модуль NeoSeo 10

Дана вкладка містить наступні поля:

  • Виводити попередній і наступний товар в картці продукту. Дана опція призначена для виведення в картці товару кнопок "Попередній" і "Наступний" товар.Модуль NeoSeo 2
  • Виводити посилання на попередній і наступний товар в мета-тегах. При виборі в даному полі значення "Опублікувати", в мета-тегах будуть виведені посилання на попередній і наступний товар:Модуль NeoSeo 3
  • Збільшення для головної картинки. Поле, призначене для вибору способу відображення збільшеного зображення товару. Дане поле містить такі значення: "Приховати", "Поруч", "Всередині":Модуль NeoSeo 4

При виборі значення "Поруч" і наведенні на зображення товару, збільшена картинка буде виглядати наступним чином:Модуль NeoSeo

При виборі значення "Всередині" і наведенні на зображення товару, збільшена картинка буде виглядати наступним чином:Модуль NeoSeo 5

При виборі значення "Приховати" і наведенні на зображення товару, збільшена картинка не буде відображатися.

  • Виводити характеристика товару в заголовку. Для виведення характеристик товару в картку товару, в даному полі відзначте необхідні характеристики:Модуль 77

В результаті, картка товару буде мати такий вигляд:Модуль NeoSeo 6

  • Колір статусу. Дане поле призначене для вибору кольору тексту для статусів товарів:Модуль NeoSeo
  • Інформація про доставку. Поле, призначене для додавання інформації, яка буде виведена в картці товару, в блоці "Інформація про доставку". Поле є багатомовним, тобто дозволяє додати інформацію для кожної мовної версії сайту:Модуль NeoSeo 7
  • Інформація про оплату. Поле, призначене для додавання інформації, яка буде виведена в картці товару, в блоці "Інформація про оплату". Поле є багатомовним, тобто дозволяє додати інформацію для кожної мовної версії сайту:Модуль NeoSeo 8
  • Інформація про гарантії. Поле, призначене для додавання інформації, яка буде виведена в картці товару, в блоці "Інформація про гарантії". Поле є багатомовним, тобто дозволяє додати інформацію для кожної мовної версії сайту:Модуль неосео

В результаті, картка товару буде мати наступний вигляд:Модуль NeoSeo 9

Важливо !!! Після додавання всіх змін необхідно натиснути кнопку "Зберегти":Модуль NeoSeo 10

 

Товари зі статті: