Categories: Мадженто 2

Як додати нову вкладку (таб) в опис товару Magento 2

Чим більше корисної та актуальної інформації ви розміщуєте про свої товари, тим вище будуть ваші шанси на високі позиції з точки зору SEO. Одним з найпоширеніших способів відображення корисної інформації є розміщення додаткової інформації про товар у вкладках (табах). Це дає можливість клієнтам краще розуміти представлені в інтернет-магазині на Magento 2 товари. У сьогоднішньому уроці ми розглянемо кроки по створенню і додаванню табів з додатковою інформацією в опис на сторінці товару.

 

 

Раніше ми розглядали питання, як створити новий атрибут товару. Якщо при створенні атрибута ви встановите для параметра Видимий на сторінках каталогу в магазині (Visible on Catalog Pages on Storefront) значення Так, тоді буде доступна вкладка «Додаткова інформація» на сторінці товару. Однак, якщо ви хочете додати свою додаткову вкладку в область табів, тоді вам потрібно буде виконати інші дії, які ми сьогодні розглянемо.

 

 

Крок №1. Створіть атрибут для товару

В панелі адміністратора Magento 2 створіть атрибут, інформацію з якого ви хочете додати в якості нової вкладки. Заповніть цей атрибут корисною інформацією на сторінці редагування товару в адмінці.

 

Крок №2. Додавання нової вкладки на сторінку товару

Тепер, коли ми додали атрибут і додали в товарі інформацію для нього, нам потрібно створити новий xml-файл і додатковий файл-шаблон .phtml, в якому будемо виводити ці дані.

Створіть XML-файл catalog_product_view.xml у своїй темі за адресою app/design/frontend/{VENDOR}/{ТЕМА}/Magento_Catalog/layout з наступним кодом:

<?xml version="1.0"?>
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 <body>
  <referenceBlock name="product.info.details">
   <block class="Magento\Catalog\Block\Product\View" name="custom.tab" as="custom_tab" template="product/view/custom_vkladka.phtml" group="detailed_info">
    <arguments>
     <argument translate="true" name="title" xsi:type="string">Custom Tab</argument>
    </arguments>
   </block>
  </referenceBlock>
 </body>
</page>

 

Якщо у вашій темі вже створений цей файл, тоді додайте в нього шматок коду з ноду <referenceBlock name="product.info.details">…</referenceBlock>. Якщо цей нод також існує, тоді скопіюйте тільки наступний вкладений нод <block>...</block>.

Примітка: Завжди зберігайте копію старих файлів теми до моменту їх зміни, щоб у вас завжди була резервна копія.

 

Крок №3. Створення файлу-шаблона для вкладки

У попередньому кроці ми додали Блок і привласнили йому шаблон. Тепер створимо цей шаблон. Шлях до нього (з попередніх налаштувань) буде таким:

app/design/frontend/{VENDOR}/{ТЕМА}/Magento_Catalog/templates/product/view/custom_vkladka.phtml

 

Додайте наступний код в файл custom_vkladka.phtml:

<?php
$product = $block->getProduct();
?>
<h3><?php echo $product->getData('custom_vkladka_attribute'); ?></h3>

 

Замініть custom_vkladka_attribute на ідентифікатор атрибута, який ви створили на кроці №1.

 

Крок №4: Перевірка відображення нової вкладки

Після виконання попередніх кроків, у вас повинна з’явитися нова вкладка Custom Tab на сторінці товару. Якщо вкладка не відображається (при всіх правильних інших умовах), спробуйте очистити кеш. Після цього перевірте правильність відображення нової вкладки у фронт-енді.

 

 

Короткий підсумок

Після ознайомлення з сьогоднішньої статтею у вас має бути краще уявлення про те, як створювати нові вкладки для опису товару в Magento 2, використовуючи для цього інформацію з нового атрибута. Тепер ви зможете додавати стільки додаткових вкладок з інформацією про товар, скільки потрібно.

 

Recent Posts

Вільям Шекспір

Чужі гріхи судити ви так ретельно любите, почніть з своїх – і до чужих не… Read More

18/04/2021

Що подарувати друзям на річницю весілля

Люди, між якими є любов і взаєморозуміння, скріплюють стосунки й народжують новий союз, а дату… Read More

13/04/2021

Авторитетність домену та його вплив на SEO просування сайту

Для якісного SEO (пошукової оптимізації, розкрутки сайту) одним з важливих показників є Авторитет домену (Domain… Read More

27/03/2021

Як вивести гроші з PayPal – основні способи

З'ясування того, як вивести свої гроші з PayPal, є одним з перших питань, які бентежать… Read More

26/03/2021

Як вибрати спідницю під свою фігуру – основні поради

Спідниця – потужний елемент жіночого гардеробу, завдяки якому будь-який наряд буде виглядати приголомшливо стильно і… Read More

25/03/2021

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

Пошукові системи (наприклад, Google) перевіряють технічні характеристики вашого сайту, такі як швидкість завантаження, зручність навігації,… Read More

24/03/2021