Основные модули платформы. Типа данных и страниц.

☰

Типа данных/страниц

Страницы

Страница - блок располагающийся в центре сайта, в области для контента, который может содержать любые HTML данные (HTML, XHTML, JAVASCRIPT, CSS или другие).

Ajax загрузка контента страницы.

<a class="ajax_load_page" href="/index.htm" data-content-block=".contenth_ajax">ЗАГРУЗИТЬ СТРАНИЦУ</a>

loader.style.transition = "opacity 0.4s";
                loader.style.opacity = "0";
                setTimeout(() => { loader.style.opacity = "1"; }, 10);

fetch(`/ajax.php?p=${href}`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;

<div class="contenth_ajax">КОНТЕНТ</div>

Ссылка имеющая class ajax_load_page будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
Путь к загружаемой странице задан в параметре href.
Путь к странице может быть относительным, или полным, с http.
Вы так же можете использовать собственные скрипты, передавая GET или POST параметр p, с именем
(или полным адресом) страницы, по адресу /ajax.php

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

Скрипт загрузки данных во всплывающем окне:
Скрипт всплывающего окна с загрузкой Ajax контента

Каталог статей

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

Ajax загрузка контента статьи

Ajax загрузка контента статьи.

<a class="ajax_load_blog" href="https://hotlist.biz/ru/blog/news_ru/1.htm" data-content-block=".contenth_ajax">ЗАГРУЗИТЬ СТАТЬЮ</a>

loader.style.transition = "opacity 0.4s";
                loader.style.opacity = "0";
                loader.style.display = "block";
                setTimeout(() => { loader.style.opacity = "1"; }, 10);

fetch(`/ajax.php?blog_cat_p=${href}`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;

<div class="contenth_ajax">КОНТЕНТ</div>

Ссылка имеющая class ajax_load_blog будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
Путь к загружаемой странице задан в параметре href.
Путь к странице может быть относительным, или полным, с http.
Вы так же можете использовать собственные скрипты, передавая GET или POST параметр blog_cat_p, с полным адресом
статьи, по адресу /ajax.php

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

Скрипт загрузки данных во всплывающем окне:
Скрипт всплывающего окна с загрузкой Ajax контента

Пример Ajax скрипта загрузки собственного списка статей

Пример Ajax загрузки статьи в JSON формате

Блок/Меню

Блок/Меню – это блок, в который вы сможете вставлять любые HTML коды. Также вы сможете использовать меню с заранее заданными функциями, например, корзина заказов, поисковый фильтр, хиты продаж, последние статьи и другие.

Блок/Меню можно использовать для создания собственного стиля/дизайна сайта. Например, вы можете создать Шапку сайта, разместить в ней необходимые элементы (Логотип, Контакты, Ссылки навигации по сайту, Поисковую форму и прочее) и написать для них CSS стили в редакторе дизайна. С помощью блоков/меню вы можете размещать скрипты, в том числе и в мета тегах, а также включить/выключать отображение этих данных на определенных страницах или устройствах. В большинстве случаев, вам достаточно использовать Header/Шапку и Footer/Низ сайта, а также, например, левый или правый Блок/Меню для размещения поискового фильтра. Скрипты сайта вы можете разместить в одном Блоке/Меню, и расположить его, например, в Служебных тегах.

Блок меню можно расположить в 7 основных частях сайта:

«Шапка сайта (Header)» – блок шапки сайта, Отображается над основным блоком с контентом, внутри элемента «#hotengine-header».
«Низ сайта (Footer)» - блок низа сайта, Отображается под основным блоком с контентом, внутри элемента «#hotengine-footer».
«Справа» - блок отображается справа, возле основного блока с котентом, и не выходит за пределы контента.
«Слева» - блок отображается слева, возле основного блока с котентом, и не выходит за пределы контента.

«Вверху» - блок отображается вверху контента, и не выходит за его область.
«Вверху > cat_tree» - блок отображается вверху, сразу под деревом категорий
«Внизу» - блок отображается внизу контента, и не выходит за его область.

«Служебные теги перед тегом Body (Header Meta)» - блок располагается под служебными Meta тегами, и может использоваться для вставки JavaScript, Meta-tags и других служебных данных.

Основная разметка блоков сайта

Конструктор мобильного меню

Магазин

Магазин может содержать организованный список товаров с кнопками для его заказа. В магазине предусмотрено множество дополнительных данных, разделение по производителям, категориям, типам товаров, характеристикам и прочим свойствам.

Обратите внимание на то, что ваши товары дополнительно будут расположены в нашем Международном каталоге, а также покупатели смогут оставлять отзывы о качестве вашей работы.

Списки товаров можно отображать не только внутри категорий, но и на страницах, блоках/меню, статьях. Для этого создайте страницу, и в тексте, добавьте код Генератора блока/меню, слайдер с товарами магазина

Списки категорий можно отображать на страницах или блоках/меню. Для этого создайте страницу или Блок/Меню, и в тексте, добавьте код Виджета с категориями магазина

Ajax загрузка товара

Ajax загрузка товара.

<a class="ajax_load_shop" href="https://hotlist.biz/be/blog/news_be/pers_shop/store_ru/21956.htm" data-content-block=".contenth_ajax">ЗАГРУЗИТЬ ТОВАР</a>

fetch(`/ajax.php?shop_cat_p=${href}`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;

<div class="contenth_ajax">КОНТЕНТ</div>

Ссылка имеющая class ajax_load_shop будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
Путь к загружаемой странице задан в параметре href.
Путь к странице может быть относительным, или полным, с http.
Вы так же можете использовать собственные скрипты, передавая GET или POST параметр shop_cat_p, с полным адресом
товара, по адресу /ajax.php

Кроме того, возможно использование прямых запросов без использования Ajax.
Например, для загрузки данных в iframe. Путь такой же как и при использовании Ajax.
Скрипты добавления товара в корзину нужно подгружать дополнительно, если вы используете iframe.

Скрипт загрузки данных во всплывающем окне:
Скрипт всплывающего окна с загрузкой Ajax контента

Ajax загрузка отзывов к товарам ↓

Пример Ajax скрипта загрузки списка товаров + «Генератор списка товаров»

Ajax загрузка корзины

Ajax загрузка корзины.

<a class="ajax_load_cart" href="javascript://" data-content-block=".content_cart_ajax">ЗАГРУЗИТЬ КОРЗИНУ</a>

fetch(`/ajax.php?cart&load_cart_ajax`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;

<div class="content_cart_ajax">КОНТЕНТ</div>

Ссылка имеющая class ajax_load_cart будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
Для загрузики корзины достаточно выполнить обращение к странице «/ajax.php?cart&load_cart_ajax»

Пример Ajax скрипта загрузки корзины при наведении курсора мышки

Ajax загрузка списка изображений карточки товара

Ajax загрузка списка всех категорий в JSON формате

Ajax загрузка списка всех категорий в JSON формате.

Для получения списка всех категорий магазина достаточно выполнить запрос по адресу /ajax.php?json&shop_categories&start=0&param=:products

Где

&start= - ID категории с которой начать отображение.
&param= параметры, которые можно получить в Виджете с категориями (не обязательный параметр)
Запрос работает только с указанием вашего домена, например http://example.com/ajax.php?json&shop_categories&start=0

Пример результата: {"id":"ID категории","parentID":"ID родительской категории","child_cat":"Количество вложенных категорий","child_items":"Количество товаров в категории","image":"Путь к изображению категории","title":"Название категории"},

Ajax загрузка товара в JSON формате

Ajax загрузка товара в JSON формате.

Для получения данных карточек товаров в JSON формате, достаточно выполнить запрос по адресу /ajax.php?json&shop_products&id=0

При выгрузке товаров можно указать параметры сортировки и фильтрации по следующим параметрам:

id - ID карточки товара (одно или несколько значений, через запятую).
pers_shop_cat_page_catid - ID категории магазина (одно или несколько значений, через запятую)
producer – производитель (одно или несколько значений, через запятую)
collection - коллекция (одно или несколько значений, через запятую)
sort_by – сортировка
order_by – сортировка
sort_instock_priority – сортировка приоритет
price_from – цена от
price_to – цена до
stock - наличие

Запрос работает только с указанием вашего домена, например http://example.com/ajax.php?json&shop_products&id=0

Форма (Form)

Форма - раздел документа, позволяющий пользователю вводить информацию для последующей обработки системой. На платформе HotList.biz вы сможете создавать полноценные формы, с привязкой имен, id и class'ов для полей. Данные форм можно обрабатывать на нашей платформе или отправлять на любой другой ресурс.

Ajax загрузка форм (всплывающие формы)

Как создать форму обратной связи?
Доступно 3 способа создания формы.

Наиболее гибкий способ - это открыть конструктор форм, и создать форму, задав нужные поля. Все инструкции доступны в конструкторе формы.
Создать функциональную страницу ( feedback ) при открытии которой будет отображаться стандартная форма обратной связи.

Использовать всплывающую форму обратной связи, которая создается следующим кодом:

Code: html

<a class="hotengine-dialog-email" data-site="XXXX" href="javascript://">Написать нам</a>

class="hotengine-dialog-email" - обозначает, что кнопка для всплытия формы обратной связи, а data-site="XXXX" - ID сайта.
XXXX замените на ID вашего сайта, который можете узнать при наведении на кнопку АДМИН ПАНЕЛЬ.

Так же можно указать название для всплывающего окна, и текст на кнопке "Закрыть". Для этого добавьте data-close-button="Закрыть" и data-title="Обратная связь" к ссылке с классом email.
Ширину и высоту окна можно задать при помощи data-width="600" и data-height="640".
Текст кнопок в форме можно задать при помощи атрибутов data-send-button="Отправить" и data-clear-button="Очистить"
Изменить названия полей для ввода, вы можете при помощи CSS стилей (текст вписан в виде content, в css превсдо классы after).

Пример

/*FORM TEXT TITTLES*/

Code: CSS


html:lang(ru) .hotengine-form-feedback-text-title:after{ content:"Текст:"; }
  html:lang(en) .hotengine-form-feedback-text-title:after{ content:"Text:"; }
  html:lang(uk) .hotengine-form-feedback-text-title:after{ content:"Текст:"; }
  html:lang(de) .hotengine-form-feedback-text-title:after{ content:"Text:"; }
  html:lang(es) .hotengine-form-feedback-text-title:after{ content:"Texto:"; }
  html:lang(fr) .hotengine-form-feedback-text-title:after{ content:"Texte:"; }
  html:lang(kk) .hotengine-form-feedback-text-title:after{ content:"Мәтін:"; }
  html:lang(be) .hotengine-form-feedback-text-title:after{ content:"Тэкст:"; }
  html:lang(ro) .hotengine-form-feedback-text-title:after{ content:"Text:"; }
  html:lang(tr) .hotengine-form-feedback-text-title:after{ content:"Metin:"; }
  html:lang(it) .hotengine-form-feedback-text-title:after{ content:"Testo:"; }
  html:lang(sk) .hotengine-form-feedback-text-title:after{ content:"Text:"; }
  html:lang(da) .hotengine-form-feedback-text-title:after{ content:"Tekst:"; }
  html:lang(pl) .hotengine-form-feedback-text-title:after{ content:"Tekst:"; }
  html:lang(zh) .hotengine-form-feedback-text-title:after{ content:"文本："; }
  html:lang(hi) .hotengine-form-feedback-text-title:after{ content:"पाठ:"; }
  html:lang(ar) .hotengine-form-feedback-text-title:after{ content:"النص:"; }
  html:lang(pt) .hotengine-form-feedback-text-title:after{ content:"Texto:"; }
  html:lang(bn) .hotengine-form-feedback-text-title:after{ content:"টেক্সট:"; }

html:lang(ru) .hotengine-form-feedback-yourname-title:after{ content:"Ваше имя:"; }
  html:lang(en) .hotengine-form-feedback-yourname-title:after{ content:"Your name:"; }
  html:lang(uk) .hotengine-form-feedback-yourname-title:after{ content:"Ваше ім'я:"; }
  html:lang(de) .hotengine-form-feedback-yourname-title:after{ content:"Ihr name:"; }
  html:lang(es) .hotengine-form-feedback-yourname-title:after{ content:"Su nombre:"; }
  html:lang(fr) .hotengine-form-feedback-yourname-title:after{ content:"Votre nom:"; }
  html:lang(kk) .hotengine-form-feedback-yourname-title:after{ content:"Сіздің атыңыз:"; }
  html:lang(be) .hotengine-form-feedback-yourname-title:after{ content:"Ваша імя:"; }
  html:lang(ro) .hotengine-form-feedback-yourname-title:after{ content:"Numele dvs.:"; }
  html:lang(tr) .hotengine-form-feedback-yourname-title:after{ content:"Adınız:"; }
  html:lang(it) .hotengine-form-feedback-yourname-title:after{ content:"Il tuo nome:"; }
  html:lang(sk) .hotengine-form-feedback-yourname-title:after{ content:"Vaše meno:"; }
  html:lang(da) .hotengine-form-feedback-yourname-title:after{ content:"Dit navn:"; }
  html:lang(pl) .hotengine-form-feedback-yourname-title:after{ content:"Twoje imię:"; }
  html:lang(zh) .hotengine-form-feedback-yourname-title:after{ content:"你的名称："; }
  html:lang(hi) .hotengine-form-feedback-yourname-title:after{ content:"आपका नाम:"; }
  html:lang(ar) .hotengine-form-feedback-yourname-title:after{ content:"اسمك:"; }
  html:lang(pt) .hotengine-form-feedback-yourname-title:after{ content:"Seu nome:"; }
  html:lang(bn) .hotengine-form-feedback-yourname-title:after{ content:"আপনার নাম:"; }

html:lang(ru) .hotengine-form-feedback-yoursoname-title:after{ content:"Ваша фамилия:"; }
  html:lang(en) .hotengine-form-feedback-yoursoname-title:after{ content:"Your name:"; }
  html:lang(uk) .hotengine-form-feedback-yoursoname-title:after{ content:"Ваше прізвище:"; }
  html:lang(de) .hotengine-form-feedback-yoursoname-title:after{ content:"Ihr name:"; }
  html:lang(es) .hotengine-form-feedback-yoursoname-title:after{ content:"Su nombre:"; }
  html:lang(fr) .hotengine-form-feedback-yoursoname-title:after{ content:"Votre nom:"; }
  html:lang(kk) .hotengine-form-feedback-yoursoname-title:after{ content:"Сіздің аты-жөні:"; }
  html:lang(be) .hotengine-form-feedback-yoursoname-title:after{ content:"Ваша прозвішча:"; }
  html:lang(ro) .hotengine-form-feedback-yoursoname-title:after{ content:"Numele dumneavoastră:"; }
  html:lang(tr) .hotengine-form-feedback-yoursoname-title:after{ content:"Adınız:"; }
  html:lang(it) .hotengine-form-feedback-yoursoname-title:after{ content:"Il tuo nome:"; }
  html:lang(sk) .hotengine-form-feedback-yoursoname-title:after{ content:"Vaše meno:"; }
  html:lang(da) .hotengine-form-feedback-yoursoname-title:after{ content:"Dit navn:"; }
  html:lang(pl) .hotengine-form-feedback-yoursoname-title:after{ content:"Imię i nazwisko:"; }
  html:lang(zh) .hotengine-form-feedback-yoursoname-title:after{ content:"你的名称："; }
  html:lang(hi) .hotengine-form-feedback-yoursoname-title:after{ content:"आपका नाम:"; }
  html:lang(ar) .hotengine-form-feedback-yoursoname-title:after{ content:"اسمك:"; }
  html:lang(pt) .hotengine-form-feedback-yoursoname-title:after{ content:"O seu apelido:"; }
  html:lang(bn) .hotengine-form-feedback-yoursoname-title:after{ content:"আপনার নাম:"; }
html:lang(ru) .hotengine-form-feedback-yourphone-title:after{ content:"Ваш телефон:"; }
  html:lang(en) .hotengine-form-feedback-yourphone-title:after{ content:"Your phone:"; }
  html:lang(uk) .hotengine-form-feedback-yourphone-title:after{ content:"Ваш мобільний телефон:"; }
  html:lang(de) .hotengine-form-feedback-yourphone-title:after{ content:"Ihr Telefon:"; }
  html:lang(es) .hotengine-form-feedback-yourphone-title:after{ content:"Su teléfono:"; }
  html:lang(fr) .hotengine-form-feedback-yourphone-title:after{ content:"Votre téléphone:"; }
  html:lang(kk) .hotengine-form-feedback-yourphone-title:after{ content:"Телефон:"; }
  html:lang(be) .hotengine-form-feedback-yourphone-title:after{ content:"Ваш тэлефон:"; }
  html:lang(ro) .hotengine-form-feedback-yourphone-title:after{ content:"Telefonul dvs.:"; }
  html:lang(tr) .hotengine-form-feedback-yourphone-title:after{ content:"Telefon:"; }
  html:lang(it) .hotengine-form-feedback-yourphone-title:after{ content:"Il telefono:"; }
  html:lang(sk) .hotengine-form-feedback-yourphone-title:after{ content:"Váš telefón:"; }
  html:lang(da) .hotengine-form-feedback-yourphone-title:after{ content:"Din telefon:"; }
  html:lang(pl) .hotengine-form-feedback-yourphone-title:after{ content:"Telefon:"; }
  html:lang(zh) .hotengine-form-feedback-yourphone-title:after{ content:"你的电话："; }
  html:lang(hi) .hotengine-form-feedback-yourphone-title:after{ content:"अपने फोन:"; }
  html:lang(ar) .hotengine-form-feedback-yourphone-title:after{ content:"الهاتف:"; }
  html:lang(pt) .hotengine-form-feedback-yourphone-title:after{ content:"Seu telefone:"; }
  html:lang(bn) .hotengine-form-feedback-yourphone-title:after{ content:"আপনার ফোন:"; }

html:lang(ru) .hotengine-form-feedback-youremail-title:after{ content:"Ваш e-mail:"; }
  html:lang(en) .hotengine-form-feedback-youremail-title:after{ content:"Your e-mail:"; }
  html:lang(uk) .hotengine-form-feedback-youremail-title:after{ content:"Ваш e-mail:"; }
  html:lang(de) .hotengine-form-feedback-youremail-title:after{ content:"Ihre e-mail:"; }
  html:lang(es) .hotengine-form-feedback-youremail-title:after{ content:"Su e-mail:"; }
  html:lang(fr) .hotengine-form-feedback-youremail-title:after{ content:"Votre e-mail:"; }
  html:lang(kk) .hotengine-form-feedback-youremail-title:after{ content:"Сіздің e-mail:"; }
  html:lang(be) .hotengine-form-feedback-youremail-title:after{ content:"Ваш e-mail:"; }
  html:lang(ro) .hotengine-form-feedback-youremail-title:after{ content:"Adresa de e-mail:"; }
  html:lang(tr) .hotengine-form-feedback-youremail-title:after{ content:"E-mail:"; }
  html:lang(it) .hotengine-form-feedback-youremail-title:after{ content:"Il tuo indirizzo e-mail:"; }
  html:lang(sk) .hotengine-form-feedback-youremail-title:after{ content:"E-mail:"; }
  html:lang(da) .hotengine-form-feedback-youremail-title:after{ content:"Din e-mail:"; }
  html:lang(pl) .hotengine-form-feedback-youremail-title:after{ content:"Twój e-mail:"; }
  html:lang(zh) .hotengine-form-feedback-youremail-title:after{ content:"你的电子邮件:"; }
  html:lang(hi) .hotengine-form-feedback-youremail-title:after{ content:"अपने ई-मेल:"; }
  html:lang(ar) .hotengine-form-feedback-youremail-title:after{ content:"البريد الإلكتروني:"; }
  html:lang(pt) .hotengine-form-feedback-youremail-title:after{ content:"Seu e-mail:"; }
  html:lang(bn) .hotengine-form-feedback-youremail-title:after{ content:"আপনার ই-মেইল:"; }
html:lang(ru) .hotengine-form-feedback-youraddress-title:after{ content:"Ваш адрес:"; }
  html:lang(en) .hotengine-form-feedback-youraddress-title:after{ content:"Your address:"; }
  html:lang(uk) .hotengine-form-feedback-youraddress-title:after{ content:"Ваша адреса:"; }
  html:lang(de) .hotengine-form-feedback-youraddress-title:after{ content:"Ihre Adresse:"; }
  html:lang(es) .hotengine-form-feedback-youraddress-title:after{ content:"Su dirección:"; }
  html:lang(fr) .hotengine-form-feedback-youraddress-title:after{ content:"Votre adresse:"; }
  html:lang(kk) .hotengine-form-feedback-youraddress-title:after{ content:"Сіздің мекен-жайы:"; }
  html:lang(be) .hotengine-form-feedback-youraddress-title:after{ content:"Ваш адрас:"; }
  html:lang(ro) .hotengine-form-feedback-youraddress-title:after{ content:"Adresa:"; }
  html:lang(tr) .hotengine-form-feedback-youraddress-title:after{ content:"Adresi:"; }
  html:lang(it) .hotengine-form-feedback-youraddress-title:after{ content:"Indirizzo:"; }
  html:lang(sk) .hotengine-form-feedback-youraddress-title:after{ content:"Adresa:"; }
  html:lang(da) .hotengine-form-feedback-youraddress-title:after{ content:"Din adresse:"; }
  html:lang(pl) .hotengine-form-feedback-youraddress-title:after{ content:"Adres:"; }
  html:lang(zh) .hotengine-form-feedback-youraddress-title:after{ content:"你的地址："; }
  html:lang(hi) .hotengine-form-feedback-youraddress-title:after{ content:"आपके पते की:"; }
  html:lang(ar) .hotengine-form-feedback-youraddress-title:after{ content:"العنوان الخاص بك:"; }
  html:lang(pt) .hotengine-form-feedback-youraddress-title:after{ content:"O seu endereço:"; }
  html:lang(bn) .hotengine-form-feedback-youraddress-title:after{ content:"আপনার ঠিকানা:"; }

/*FORM TEXT TITTLES*/

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

Комментарии / Отзывы

Комментарии можно оставлять на всех типах страниц. Комментарии имеют гибкие настройки, с возможностью указывать их как к определенному разделу на сайте, так и к отдельной странице. К комментариям возможно включить "Оценку", а также защитное изображение "Captcha". Для карточек товаров реализована отдельная форма комментариев - отзывы.

Ajax загрузка комментариев

Ajax загрузка комментариев.

<span class="ajax_load_comments" data-nc="0" data-on-page="20" data-page-id="12" data-scpt="page" data-content-block=".contenth_comments_ajax">ЗАГРУЗИТЬ КОММЕНТАРИИ</span>

if (contentBlock) {
                contentBlock.insertAdjacentHTML("beforeend", `<div class="loading" align="center"><span class="loading-spin"></span></div>`);
                const loader = contentBlock.querySelector(`.loading`);
                
                loader.style.transition = "opacity 0.4s";
                loader.style.opacity = "0";
                setTimeout(() => { loader.style.opacity = "1"; }, 10);

fetch(`/ajax.php?hotengine_comments_hotengine_page_id=${pageId}&hotengine_comments_page_type=${pagetype}&nc=${nc}&snc_on_page=${sncOnPage}`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;
                        contentBlock.querySelector(`.hotengine-comments-replay-send`)?.remove();
                    }, 300);
                })
                .catch(error => {
                    if (error.name === "AbortError") {
                        alert("Request timeout. Please try again.");
                    } else {
                        alert(`Error executing Ajax request #ajaxloadcomments490. \n\nError result: ${error}`);
                    }
                    loader?.remove();
                });
            }
            e.preventDefault();
            return false;
        }
    });
});
</script>

<div class="contenth_comments_ajax">Комментарии</div>

Элемент имеющий class "ajax_load_comments" будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
ID загружаемой страницы задан в параметре data-page-id. Дополнительно можно отфильтровать комментарии по рейтингу, передав переменную starrating_quality, например starrating_quality=5.

Для комментариев используются 4 параметра:

hotengine_comments_hotengine_page_id - ID страницы.
nc - номер страницы комментариев.
snc_on_page - количество комментариев на странице (от 1 до 50).
hotengine_comments_page_type - тип страницы.

Типы доступных страниц (обязательный параметр):

page - страницы
shop_category - категории магазина
shop_collection - коллекции магазина
shop_producer - производители
blog_category - категория каталога статей
blog_page - статья

Вы можете использовать собственные скрипты, передавая GET или POST параметры hotengine_comments_hotengine_page_id и hotengine_comments_page_type, по адресу /ajax.php. nc - номер страницы, snc_on_page - количество комментариев на странице.

Для получения данных в JSON формате, достаточно добавить GET/POST переменную json.

Ajax загрузка отзывов к товарам

Ajax загрузка отзывов к товарам.

<a class="ajax_load_shop_comments" data-nc="0" data-on-page="20" href="https://hotlist.biz/be/blog/news_be/pers_shop/store_ru/21956.htm" data-content-block=".contenth_shop_comments_ajax">ЗАГРУЗИТЬ ОТЗЫВЫ</a>

loader.style.transition = "opacity 0.4s";
                loader.style.opacity = "0";
                setTimeout(() => { loader.style.opacity = "1"; }, 10);

fetch(`/ajax.php?hotengine_shop_comments_shop_cat_page_id=${productId}&nc=${nc}&snc_on_page=${sncOnPage}`, {
                    method: "GET",
                    credentials: "same-origin",
                    headers: {
                        "X-Requested-With": "XMLHttpRequest"
                    },
                    signal: (() => {
                        const c = new AbortController();
                        setTimeout(() => c.abort(), 20000);
                        return c.signal;
                    })()
                })
                .then(response => response.text())
                .then(data => {
                    loader.style.opacity = "0";
                    setTimeout(() => {
                        loader.remove();
                        contentBlock.innerHTML = data;
                        contentBlock.querySelector(`.hotengine-shop-comments-replay-send`)?.remove();
                    }, 300);
                })
                .catch(error => {
                    if (error.name === "AbortError") {
                        alert("Request timeout. Please try again.");
                    } else {
                        alert(`Error executing Ajax request #ajaxloadcomments490. ajax.php Please try again. \n\nError result: ${error}`);
                    }
                    loader?.remove();
                });
            }
            e.preventDefault();
            return false;
        }
    });
});
</script>

<div class="contenth_shop_comments_ajax">ОТЗЫВЫ</div>

Ссылка имеющая class ajax_load_shop_comments будет открывать Ajax контент внутри блока, заданного в атрибуте data-content-block.
Путь к загружаемой странице задан в параметре href.

Для отзывов используются три параметра:
hotengine_shop_comments_shop_cat_page_id - ID товара.
nc - номер страницы комментариев.
snc_on_page - количество комментариев на странице (от 1 до 50).
Путь к странице может быть относительным, или полным, с http. Путь должен быть либо путем к товару, либо можно сразу указать ID товара, отзывы к которому необходимо загрузить.
Вы так же можете использовать собственные скрипты, передавая GET или POST параметр hotengine_shop_comments_shop_cat_page_id, с полным адресом
товара (или ID товара), по адресу /ajax.php. nc - номер страницы, snc_on_page - количество комментариев на странице. Дополнительно можно отфильтровать комментарии по рейтингу, передав переменную starrating_quality, например starrating_quality=5.

Кроме того, возможно использование прямых запросов без использования Ajax.
Например, для загрузки данных в iframe. Путь такой же как и при использовании Ajax.
Скрипты добавления товара в корзину нужно подгружать дополнительно, если вы используете iframe.

Скрипт загрузки данных во всплывающем окне:
Скрипт всплывающего окна с загрузкой Ajax контента
Для получения данных в json формате, достаточно добавить GET/POST переменную json.

Multilanding / Динамические страницы

Multilanding - это автоматическое изменение контента страницы в зависимости от ключевого запроса посетителя, установленных в рекламе переменных или его местоположения.

Как использовать Multilanding?

На платформе HotList.biz вы можете настроить Multilanding страницы так, что бы при совпадении (части или полного) запроса, менялось содержимое целых блоков на странице (на страницах, в товарах и в меню). В качестве запроса могут использоваться данные поискового запроса (определяемые автоматически), а также ваши собственные установленные GET переменные. Например, при добавлении UTM меток в рекламных объявлениях, вы можете использовать метку utm_term, таким образом Multilanding страница будет активна для GET переменной utm_term. Данные об источнике перехода хранятся не более 24 часов. При этом данные об источнике перехода по партнерской программе хранятся 120 дней.

Пример работы с Блоком/Меню

Пример использования Блока/Меню для подтверждения сайта в Центре Вебмастеров.
Для подтверждения сайта в центре вебмастеров (например Google или Яндекс) необходимо добавить <meta> код.
Для этого создайте Блок/Меню, вставьте нужный meta код и расположите его в служебных тегах. После чего ваш сайт будет подтвержден.
Таким же образом вы можете создать собственную шапку и низ сайта. В меню вы можете вставлять практически любой HTML код.
Также в блоки и меню можно вставлять JavaScript и CSS — система сама преобразует их в отдельные файлы.

Пример совместного использования категорий и производителей (дополнительных категорий)

Для каждого товара вы можете выбрать рубрику (персональную рубрику вашего магазина), а также Производителя. Таким образом, один товар может быть в списке основной категории магазина, а также в рубрике Производитель*. Например у телефона Samsung, может быть две рубрики, основная - "Смартфоны" и дополнительная - "Samsung". А так же вы сможете отображать в основной рубрике товары только определенного производителя**.

* - рубрику "Производитель" можно заменить на нужное вам слово.

Родительскую (первую) рубрику мы рекомендуем назвать "Магазин" (Store).

Пример создания категории магазина:
Для начала рекомендуем вам создать основную категорию, в которой вы будете создавать подкатегории.
Откройте в Админ-центре редактор категорий магазина, и нажмите "Добавить категорию".
Выберите ваш сайт и нажмите "ОК".
После этого введите имя (это будет адресом к вашей категории). Например, для основной категории создадим группу "Магазин" с именем "store".
Готово.

Точно так же вы можете управлять рубриками Производители (дополнительные категории).

** - Кроме того, если вам необходимо открыть список товаров определенной рубрики, и определенного производителя, то достаточно добавить GET переменную PRODUCER. В переменной достаточно указать или ID производителя, или его наименование. Пример: /pers_shop/water/?producer=bonaqua В этом случае будет показан список товаров внутри рубрики "water", и у которых производитель "bonaqua".

Оснвоные блоки и их расположение

← Таму

Краткий обзор возможностей | | Рекомендации по продвижению | Скрипты для использования на сайтах