Как добавить дополнительные вкладки (табы) на странице товара?
У дефолтних шаблоні OkayCMS на сторінці товару інформація про товар виводиться в трьох вкладках - Опис, Характеристики, Коментарі. Але часто даних вкладок мало, наприклад, коли є необхідність додавання відеоогляду товару. Як правило, додаткову інформацію розміщують в додаткових вкладках.
Як додати додаткову вкладку описуємо нижче.
1. Створити в базі даних магазину необхідні поля:
в таблиці ok_lang_products, текстове поле custom _ description,
в таблиці ok_products, текстове поле custom_description
Для цього можна зайти, наприклад, в php MyAdmin, перейти у вкладку SQL, по черзі вставити запити в поле і виконати їх, натиснувши кнопку «Вперед»
(SQL запит) для створення в таблиці ok_lang_products поля custom _ description:
ALTER TABLE ` ok_lang_products `
ADD `custom_description` text COLLATE 'utf8_general_ci' NOT NULL AFTER` description`;
(SQL запит) для створення в таблиці ok_products поля custom_description:
ALTER TABLE ` ok_products `
ADD `custom_description` text COLLATE 'utf8_general_ci' NOT NULL AFTER `description`;
2. У backend / lang / ru.php, backend / lang / en.php і backend / lang / ge.php необхідно додати переклад:
$ Backend_translations-> general_custom_description = 'Ваша назва';
3. У файлі backend / design / html / product.tpl
вставте виділений код, в блок
<Div class = "heading_tabs"> <Div class = "tab_navigation"> <a href="#tab1" class="heading_box tab_navigation_link"> </a> <a href="#tab2" class="heading_box tab_navigation_link"> </a>
<a href="#tab3" class="heading_box tab_navigation_link"> </a>
</ Div> <Div class = "toggle_arrow_wrap fn_toggle_card text-primary"> <A class = "btn-minimize" href = "javascript :;" > <I class = "icon-arrow-down"> </ i> </a> </ Div> </ Div> <Div class = "toggle_body_wrap on fn_card"> <Div class = "tab_container"> <Div id = "tab1" class = "tab"> <Textarea name = "annotation" id = "annotation" class = "editor_small"> </ textarea> </ Div> <Div id = "tab2" class = "tab"> <Textarea id = "fn_editor" name = "description" class = "editor_large fn_editor_class"> </ textarea> </ Div>
<div id = "tab3" class = "tab">
<textarea id = "fn_editor" name = "custom_description" class = "editor_large fn_editor_class"> </ textarea>
</ div>
</ Div> </ Div>
4. У C backend / core / ProductAdmin.php після рядка
$ Product-> description = $ this-> request-> post ( 'description');
додати рядок
$ product-> custom_description = $ this-> request-> post ( 'custom_description');
5. У api / Languages.php
в рядок
$ Fields [ 'products'] = array ( 'name', 'meta_title', 'meta_keywords', 'meta_description', 'annotation', 'description', 'special');
вставляємо код, виділений помаранчевим
, 'Custom_description'
і в результаті має оплучіться так:
$ fields [ 'products'] = array ( 'name', 'meta_title', 'meta_keywords', 'meta_description', 'annotation', 'description', 'custom_description', 'special');
6. Вставляємо переклади через адмінку
Називаємо переклад product_custom_description
і пишемо назву вкладки, яке буде відображатися користувачеві:
7. У файлі /design/okay_shop/html/product.tpl
вставте виділений код, в блок
<Div class = "tab_navigation"> {If $ product-> description} <a href="#description" data-language="product_description">
{If $ product-> custom_description} <a href="#custom_description" data-language="product_custom_description">
{if $ product-> features}
<a href="#features" data-language="product_features">
<a href="#comments" data-language="product_comments"> </a>
</ Div>
<Div class = "tab_container">
{If $ product-> description}
<Div id = "description" class = "tab product_description" itemprop = "description">
{If $ product-> custom_description} <Div id = "custom_description" class = "tab product_description" itemprop = "custom_description">
{if $ product-> features}
<div id = "features" class = "tab">
<ul class = "features">
{foreach $ product-> features as $ f}
<li>
<span class = "features_name"> <span> </ span> </ span>
<span class = "features_value">
Пробуйте, а якщо будуть питання - звертайтеся. Ми з радістю допоможемо! :)