Очередное продолжение статьи на тему создания интернет магазина на WordPress. В данной статье пойдёт речь ещё об одном из вариантов промо виджета и добавлении информации в футер.

Создаём интернет магазин с помощью WordPress (Часть 5).

Добавляем ещё несколько промо виджетов.

К примеру нам нужно лишний раз напомнить клиентам наши контакты или добавить информацию про доставку, в этом нам поможет ещё один виджет темы «AccessPress Store». Выглядит он так:

WordPress промо виджет

Для того что бы нам его добавить необходимо зайти во вкладку «Внешний вид» -> «Виджеты», ну и как ранее перетащить нужный элемент в форму. Ищем «Ap : Icon Text Block» и переносим его в «Promo Widget 3».

WordPress переносим промо виджет

Для того что бы было красиво переносим три штуки. Далее нам необходимо его настроить. Как обычно, в поле «Title» пишем заголовок, в «Content» краткое описание. Ниже необходимо выбрать иконку, их там достаточно много, так что я думаю найдёте нужную. В конце название кнопки и ссылка, куда она будет переадресовывать. Не забываем нажимать сохранить.

WordPress переносим промо виджет

Так же хочу заметить, что если Вы впишете слишком большое описание, то наша тема обрежет часть текста. Для того что бы она этого не делала надо подправить CSS стили. Думаю Вы уже знаете как найти файл «style.css» через редактор. В нём найдём строчку «.ap-icon-text-inner .ap-icon-text-content» и поменяем значение высоты в поле «height:» на «auto», по умолчанию стоит определённое значение и если поле этого значение больше, то часть текста скрывается.

В итоге получи такой вид виджета:

WordPress промо виджет итог

Добавим виджеты в футер.

Давайте украсим наш футер и добавим туда короткое описание сайта или фирмы, кнопки соц. сетей, ссылки на страницы.

WordPress виджеты в футоре

Переходим в виджеты, для футера темой предусмотрено четыре места, в них вы можете запихнуть всё что Вам угодно. Называются они Footer Area 1-4.

WordPress настраиваем виджеты в футоре

К примеру я хочу в первом добавить информацию про компанию, во втором разместим соц.сети, в третьем пусть будут страницы сайта, в четвёртом контакты. Для первой части мне хватит текстового виджета, в который вставим код. Переносим виджет «Текст» в «Footer Area 1». Вставляем необходимый код в содержимое, у меня он такой:

Сохраняем. В итоге будет так:

WordPress футер 1 результат

Во втором я использовал плагин «AccessPress Social Icons», его мы ставили ранее вместе с темой. Но до того как его использовать необходимо настроить. Ищем в админке «AccessPress Social Icons»

WordPress настраиваем иконки соц. сетей

Далее нажимаем «Add New». Вписываем название, выбираем пункт «Choose from available themes», нам предложат выбрать варианты значков (если хотите индивидуальные то выберите второй пункт), как выбрали подходящий вам вариант справа появится выбор соц. сетей.

WordPress настраиваем иконки соц. сетей

не бойтесь все они отображаться не будут, только те что Вы настроите. Возьмём за пример ВК. Выбираем «Vk», вписываем название, размер иконки, ну и ссылку, куда будет редиректить.

WordPress настраиваем иконки соц. сетей ВК

Так же, чуть ниже, Вы можете настроить отображение темы и анимацию иконки.

WordPress настраиваем иконки соц. сетей

Не забываем сохранять.

Теперь нам необходимо перенести виджет «AccessPress Social Icon» в «Footer Area 2»

WordPress настраиваем иконки соц. сетей

С настройкой всё просто, вводим название и выбираем наши иконки, в выпадающем меню будет название которые мы указывали ранее в настройке плагина, сохраняем. Получаем:

WordPress настраиваем иконки соц. сетей итог

В третий «Footer Area 3» я добавил страницы сайта. Там всё просто перетаскиваем виджет «Страницы» в «Footer Area 3». Вписываем заголовок, выбираем порядок сортировки, если необходимо исключить страницы, вписываем ID страницы (ID можно посмотреть в закладке «Страницы» наведя курсор на название). Сохраняем.

WordPress добавляем ссылки на страницы в футер

В четвёртый я опять вставил текстовое поле как в первом, и просто вписал туда контактные данные.

В итоге у меня получилось вот так:

WordPress виджеты в футоре

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

Читайте продолжение: WordPress — Как создать интернет магазин (Часть 6)

Не забывайте пользоваться кнопками «Поделиться в соц. сетях», так же подписываться на наш Канал и группу в ВК.