Автор: Stasyuk Eugene 75 Метки: 21.05.2022

Недавно поступил запрос сделать бюджетный интернет магазин с админ панелью. Само собой, в данном вопросе я решил использовать WordPress совместно с Woocommerce. Одной из предлагаемых тем плагина электронной коммерции для магазина является Storefront. Бесплатная версия, как и ожидалось, не предлагает богатый выбор настроек. Но, тем не менее, получилось хоть что-то похожее на современный интернет-магазин. Вот результат:

storefront

Открытым остался вопрос использования фирменных цветов. И плюс к этому очень смущала надпись в подвале темы:

storefront

Поэтому, было решено дополнительно использовать дочернюю тему. С полной информацией о ней можно ознакомиться здесь.

Как подключить дочернюю тему?

1) Для того, чтобы создать дочернюю тему, нам нужно зайти в папку с темами: wp-content/themes.

Здесь создаем папку с названием нашей темы и с приставкой child:
storefront-child

На самом деле папку можно назвать как угодно. Но для удобства использования лучше делать вот так.

2) Далее заходим в папку и создаем обязательный файл style.css. В самом файле нам нужно добавить комментарии. Для того, чтобы тема заработала, нам достаточно два поля:

    • Theme Name. (обязательно) Название дочерней темы.
    • Template. (обязательно) Название папки родительской темы, регистрозависимое.

style-css

3) После этого заходим в админ-панель. В меню выбираем Внешний вид -> Темы. В предложенном списке тем выбираем нашу дочернюю. Готово! Теперь мы можем с ней работать.

админка

Как работать с дочерней темой?

Работать с дочерней темой достаточно просто. Достаточно того, что вы берете файл шаблона с оригинальной темы, перебрасываете к себе в дочернюю и вносите в нее изменения. Таким образом WordPress вместо существующего файла в Storefront будет использовать шаблон в Storefront-child.

Что касается файла function.php, то WordPress не заменяет код оригинала на наш код, а лишь дополняет его.

Если брать в пример интернет магазин, который делал я, то изменения были в основном косметические. В арсенале файлов которые я использовал были:

  • header.php и footer.php в которых я удалил все лишнее.
  • Папка assets в которой находилась папка css с файлом style.css . Так уж сложилось, что мне удобнее стили хранить в отдельной папке, а не править основной файл style.css. Здесь был основной пласт кода которым я задал внешний вид сайта.
  • Файл functions.php — здесь я подключил файл стилей, а также переписал функцию, которая добавляет информацию в подвале без использования надписи storefront:

Получилось приблизительно следующее:
child-ready

child-ready

Другие статьи

Создание интерактивной карты Google с маркерами адресов

Создание интерактивной карты Google с маркерами адресов

Создание интерактивной карты Google с маркерами адресов

Сегодня разберем как сделать google map со списком адресов. Важная особенность заключается в том, что при клике на какой-либо из адресов, в центре карты должен отобразиться маркер с этим адресом.

FAQ question

FAQ

FAQ

Как убрать префикс «Категория, Метка …» с страниц архива? Поместить фильтр в файл functions.php в папке с нашей темой Как убрать scale изображений при загрузке в медиа? Поместить фильтр в файл functions.php в папке с нашей темой Как стилизовать скроллбар (css)? Почему на сайте WordPress на других языках не работает поиск? Возможно стоит обратить внимание […]