! Запросто с WordPress - доступная ручная работа по правилам оптимального интернета

Здравствуйте ! (извините за рекламу...)
написано: — 
отредактировано: 2019-02-15
издатель:  в теме: WooCommerce и WordPress 2 комментария
 
Запросто с WordPress - студия ATs media fashion Reception WordPress golden

Как более тонко организовать в магазине на woocommerce блок «Похожие по теме товары»?

Блок «Похожих по теме товаров» отображается сразу же после того, как продукция магазина поделена на категории. Вся эта штука организуется автоматически плагином WOOC.

 

В строках цикла этих статей узнаем, как подстроить блок Похожих по теме категории товаров — настроим более тонко, т.е под требования владельца магазина — наши с вами желания:

 

1 — перенесём в корень своей активной темы файл плагина wooc — related.php.

2 — заменим в имени блока тег h2 на div класс …всё это выполним легко и валидно))

Начнём концерт:


 

 

 

 

Прежде чем приступить к регулировке нашего магазина — а именно блока похожей продукции, необходимо подготовиться к этому делу!

 

 

Хотя для того, чтобы изменить блок Похожих товаров, требуется пара минут — если открыть папку плагина и немного подредактировать её код. Но это, как всеобще известно, неправильный подход к делу: редактировать код плагина неблагодарное и вредное занятие, в первую очередь для владельца магазина. Ну хотя бы потому, что при очередном обновлении плагина, наши с вами правки бесследно затрутся!

 

…и вот, чтобы не терять наработки, поступим несколько иначе, что более грамотно в смысле настройки своего сайта/магазина.

 

 

 

 

Пользы для: в ЭТОМ посте помещена большая подборка полезного кода для работы с магазином на Woocommerce.

 

Условные теги woocommerce… для работы с магазином.

 

 

 

 

 

к оглавлению $

перенесём файл related.php в корень своего шаблона

 

 

 

 

 

Значит, нам нужен файл related.php именно в нём сформирован требуемый блок.

Идём по такой тропинке — путь в корень плагина woocommerce:

 

 

/wp-content/plugins/woocommerce/templates/single-product

 

 

Копируем файл related.php (не вырезаем, но копируем).

 

 

 

Следующим шагом… отправляемся сюда:

 

 

yourtsайт/wp-content/themes/моя_тема/woocommerce/single-product

 

 

 

У тех владельцев, у которых неправильно организованна структура своего магазина: т.е важные настроечные файлы шаблона woocommerce не перенесены в корень активной темы, рекомендую читать рубрику или метку к которой относится эта статья — найдёте много полезного!

 

Пока же в директории своей темы создайте папку с именем woocommerce и — второе: внутри созданной папки создайте ещё одну с названием single-product — в неё и поместим скопированный на предыдущем шаге файл.

 

 

 

 

В папку моя_тема/woocommerce/single-product помещаем файл related.php из ядра плагина.

 

 

Теперь, после наших правок структуры обработки плагином wooc нашего магазина, блок «похожих записей» будет формироваться в корне нашего шаблона: в перенесённом файле (это упрощённо).

 

 

 

 

к оглавлению $

как изменить в заголовке «Похожие по теме товары» тег h2 на какой-то div класс

 

 

Для чего эта замена тега нужна?

…как известно по законам seo тег h2 второй по значимости (важности) для поисковых систем. Следовательно, может быть не совсем правильно с нашей стороны отдавать предпочтение обыкновенной фразе на страничке магазина.

Но это решать владельцу… и только.

 

 

 

Откроем в ядре нашего шаблона файл related.php:

 

 

 

Вот строка, которая обозначает имя блока Похожих по теме продуктов тегом h2:

 

 

<h2><?php esc_html_e( 'Related products', 'woocommerce' ); ?></h2>

 

 

 

h2 можно заменить, к примеру, на такую: где классом widgettitle заменим тег h2.

Меняйте на те классы, которые более подходяще стилистически сочитаются с вашей активной темой.

 

 

Вот примерно так:

 

 

<div class="widgettitle"><?php esc_html_e( 'Related products', 'woocommerce' ); ?></div>

 

 

 

В общем, в перенесённом теперь файле можно колдовать как душе угодно: никакие правки с обновлениями WC не затрутся.

 

 

 

Вот некоторые стили, если у кого-то трудности с css.

 

 

.widgettitle {
font-weight: 700;
color: #353535;
font-size: 17px;
border-bottom: 1px solid #a58d62;
margin: 0 0 10px 0;
padding: 11px 0;
font-family: intro;
}

 

 

 

Как видите, всё запросто регулируется — смотрите картинку ниже!…

 

 

 

woocommerce блок Похожих товаров

 

 

 

…и кстати же, можете перейти непосредственно к нам в магазин и ознакомится, так сказать, в натуре…

 

 

 

 


На этом занавес представления опускается…
…на рампы пыль печальная ложится…

 

 

 

В следующей статье, разберёмся с более тонкой настройкой блока: а именно — настроим число ссылок-миниатюр Похожих товаров; зададим число колонок блока и, коли требуется, скроем элемент похожих продуктов вообще… Решается эта задача легко и просто!

 

 

Я решил разбить статью на несколько частей, чтоб не путаться… в настройке блока Похожих товаров много нюансов.

 

 

Подписывайтесь, чтоб ухватить удачу за хвост… ))

 

 


подписка feedburner Online консультация по работе c сайтом на WordPress

 

 


...вопросы в комментариях - помогу, в чём дюжу...
mihalica.ru !


Михаил ATs - владелец блога запросто с Вордпресс - в сети нтернет давным-давно...

...веб разработчик студии ATs media: помогу в создании, раскрутке, развитии и целенаправленном сопровождении твоего ресурса в сети... - заказы, вопросы...разработка...


Нажатия на кнопочки определяют Ваше высокое гражданское сознание
Удачи в работе и творчестве..!
 ! самое читаемое:
   Условные теги woocommerce — наиболее полная подборка, пояснения   Как выбрать хостинг — пошаговые инструкции (обзоры 4 хостингов) — нюансы модного ssl сертифицирования   Как самостоятельно установить в Notepad++ плагин Compare   14 полезных сниппетов — код для наилучшей работы сайта WordPress — функции   Подключение jQuery библиотеки от CDN Google — рационально!..   Подборка полезного кода (сниппеты) для работы магазина на WooCommerce   Включаем обслуживание gzip сжатия файлов на хостинге и в htaccess   Woocommerce шорткоды и их применение   Кнопка обратного звонка — анимация css плюс JS   Условные теги WordPress: наиболее полная подборка, пояснения   Как перевести сайт на https — сертификат ssl — шифрование   Что такое Open Graph? как подключить протокол Open Graph к WordPress   Создаём плагин — отдельный файл функций для сайта my-functions.php   Подборка вариантов Redirect 301 — на все случаи жизни сайта
↔ перетаскивайте ленту ↔

смотреть ещё статьи в теме WooCommerce и WordPress
меточная навигация:


Комментарии © 2 к статье: Как более тонко организовать в магазине на woocommerce блок «Похожие по теме товары»?

Поделитесь соображениями: Ваши мысли очень важны! $ правила комментирования ©

Внимание! Обязательные поля помечены *

  отныне доступен плагин: privacy-policy ©

 необходимо принять правила конфиденциальности и пользовательского соглашения

  1. Спасибо вам большое!

    Перестановка файлов related.php помогла решить баг в теме. Вместо похожих товаров отображался сам товар.

    Ответить - Екатерина

    • И вам, Екатерина, спасибо за отзыв…

      Ответить - Михаил
Яндекс.Метрика
? основная линейка услугSkype консультацияЕсли вы выбрали для своего сайта WordPress и только-только начинаете изучать панель управления контентом, то этот вариант оnline консультаций — практически по любым вопросам — для вас! вопросы сюдаSkype онлайн