Moushe.ru

Блог обо всём

OcStore 1.5.5.1.2 используем модуль html блок (2 часть)



Всем привет, меня очень часто спрашивают как вывести свою группу в контакте на страницы интернет магазина сделанного на OpenCart, по вашим просьбам в этой статье я расскажу вам как вывести свою группу в контакте на сайт с помощью модуля html блок.

OcStore15512

(для вставки группы на сайт вам необходимо установить на свой магазин модуль – html блок, о том как это сделать и где можно скачать этот модуль вам расскажет предыдущая статья — http://moushe.ru/nashi-stati/opencart-moi-stati/ocstore-1-5-5-1-2-ispolzuem-modul-html-blok-1-chast/)

Приступим:

Открываем админку и переходим:

Админка > Дополнения > Модули > HTML блок > Изменить > Блоки > Добавить блок (попадаем на такую страницу):

ocstore_html_block_2_01

Для удобства заполним заголовок блока: Группа ВК и отключим визуальный редактор (выключить редактор), теперь переходим на сайт В контакте (проще всего сделать так — ваша анкета – переключиться на настройки и промотать страницу вниз) и внизу жмём ссылку разработчикам, попадём на эту страницу:

ocstore_html_block_2_02

Нажимаем ссылку Подключение сайтов и виджеты, ищем в списке виджетов этот: Сообщества, ссылка на сообщество – вбиваем адрес своей группы и настраиваем виджет под себя – длину, ширину, цвета, после настройки копируем получившийся код:

ocstore_html_block_2_03

Вставляем наш код в содержимое блока:

ocstore_html_block_2_04

переключаемся на вкладку конфигурация и ставим галочку основной магазин:

ocstore_html_block_2_05

нажимаем кнопку сохранить.

Теперь нам нужно настроить отображение нашего модуля, вновь переходим:

Админка > Дополнения > Модули > HTML блок > Изменить > Добавить модуль и заполняем (например так):

ocstore_html_block_2_06

Не забываем про кнопку сохранить.

Смотрим на результат:

ocstore_html_block_2_07

Если группа шире чем нужно – настройте ширину модуля (стандартная ширина боковой колонки 180px) или расширьте левую колонку с помощью следующей инструкции.

откроем файл stylesheet.css и ищем эти строки (73-76):

#column-left {
float: left;
width: 180px;
}

меняем ширину на 220px:

#column-left {
float: left;
width: 220px;
}

ниже найдём эти строки (85-87):

#column-left + #column-right + #content, #column-left + #content {
margin-left: 195px;
}

и изменим отступ с левой и правой стороны для центральной колонки на 15px больше чем предыдущее значение ширины левой колонки, то есть до 235px:

#column-left + #column-right + #content, #column-left + #content {
margin-left: 235px;
}

и смотрим на результат нашей работы:

ocstore_html_block_2_08

Надеюсь эта статья была вам полезна, следите за нашими новостями и до новых встреч. Всем пока.

1 Комментарий

  1. Спасибо! Очень помогло =)

Добавить комментарий

Your email address will not be published.

*

CAPTCHA image
*

© 2016 Moushe.ru При копировании материалов, ссылка на нас обязательна!

Вверх ↑



Яндекс.Метрика