Istruzioni per l'uso, con la piattaforma
hotlist.biz/admin/
If you hide the authorization menu on the site, then to enter the administrator, it is enough to enter the path indicated above in the address bar.
Example of creating a link for user authentication
Pages
Page - a block located in the center of the site, in the content area, which can contain any HTML data (HTML, XHTML, JAVASCRIPT, CSS or others).
Ajax loading page content.
Ajax loading page content.
A link with class "ajax_load_page" will open Ajax content inside the block specified in the "data-content-block" attribute.
The path to the loaded page is specified in the href parameter.
The page path can be relative, or complete, with http.
You can also use your own scripts by passing the GET or POST parameter "p", with the name
(or full address) of the page, at the address "/ajax.php"
It is also possible to use direct requests without using Ajax.
For example, to load data into an iframe. The path is the same as when using Ajax.
Data loading script in pop-up window:
Ajax content loading popup script
News
News - the same block as pages, but have a short description, which is displayed in the form of a list, with a link to view the full text of the news.
Ajax content loading news
Ajax content loading news.
A link with class "ajax_load_news" will open Ajax content within the block specified in the "data-content-block" attribute.
The path to the loaded page is specified in the href parameter.
The page path can be relative, or complete, with http.
You can also use your own scripts by passing the GET or POST parameter "news_cat_p", with the full address
of the article, at "/ajax.php"
It is also possible to use direct requests without using Ajax.
For example, to load data into an iframe. The path is the same as when using Ajax.
Data loading script in pop-up window:
Ajax content loading popup script
Catalogue of articles
The article directory is the same block as the news, but it is possible to divide the article lists by Categories.
Lists of articles can be displayed not only within categories, but also generate your own lists.
Ajax loading article content
Ajax loading article content.
A link with class "ajax_load_blog" will open Ajax content inside the block specified in the "data-content-block" attribute.
The path to the loaded page is specified in the href parameter.
The page path can be relative, or complete, with http.
You can also use your own scripts by passing the GET or POST parameter "blog_cat_p", with the full address
of the article, at "/ajax.php"
It is also possible to use direct requests without using Ajax.
For example, to load data into an iframe. The path is the same as when using Ajax.
Data loading script in pop-up window:
Ajax content loading popup script
An example of Ajax script for loading your own list of articles
Example of Ajax loading an article in JSON format
Block/Menu
Block/Menu is a block where you can insert any HTML codes. You can also use a menu with predefined functions, such as shopping cart, search filter, bestsellers, latest articles, and others.
Block/Menu can be used to create your own website style/design. For example, you can create a Site Header, place the necessary elements in it (Logo, Contacts, Site navigation links, Search form, etc.) and write CSS for them styles in the design editor. Using blocks/menus, you can place scripts, including in meta tags, as well as enable/disable the display of this data on certain pages or devices. In most cases, you just need to use the Header/Header and Footer/Bottom of the site, as well as, for example, the left or right Block/Menu to place the search filter. You can place site scripts in one Block/Menu, and place it, for example, in Service tags.
The menu block can be located in 7 main parts of the site:
- «Header» - site header block, It is displayed above the main content block, inside the «#hotengine-header» element.
- «Bottom of the site (Footer)» - the block of the bottom of the site, It is displayed below the main content block, inside the «#hotengine-footer» element.
- «Right» - the block is displayed on the right, next to the main block with a quote, and does not go beyond the content.
- «Left» - the block is displayed on the left, next to the main block with the citation, and does not go beyond the content.
- «Top» - the block is displayed at the top of the content, and does not go beyond its area.
- «Bottom» - the block is displayed at the bottom of the content, and does not go beyond its area.
- «Service tags before the Body tag (Header Meta)» - the block is located under the service Meta tags, and can be used to insert JavaScript, Meta-tags and other service data.
Class positions will be added to all menus, as well as a unique menu_id. Basic site block markup ↓
To create an extended version of the mobile menu (in the style of an application), use the «Mobile Menu Designer». The constructor allows you to create a multi-level menu, a pop-up «Search filter», and your own icons.
Shop
A store can contain an organized list of products with buttons for ordering it. The store provides a lot of additional data, division by manufacturer, Categories, types of goods, characteristics and other properties.
Please note that your products will additionally be located in our International catalog, as well as buyers will be able to leave feedback on the quality of your work.
Category lists can be displayed on pages or blocks / menus. To do this, create a page or Block/Menu, and in the text, add the code from Widget with store categories
Ajax product loading
Ajax product loading.
A link with class "ajax_load_shop" will open Ajax content inside the block specified in the "data-content-block" attribute.
The path to the loaded page is specified in the href parameter.
The page path can be relative, or complete, with http.
You can also use your own scripts by passing the GET or POST parameter "shop_cat_p", with the full address
of the product, at the address "/ajax.php"
It is also possible to use direct requests without using Ajax.
For example, to load data into an iframe. The path is the same as when using Ajax.
Scripts for adding a product to the cart need to be loaded additionally if you are using an iframe.
Data loading script in pop-up window:
Ajax content loading popup script
Ajax loading product reviews
Ajax loading product reviews.
A link with the class "ajax_load_shop_comments" will open Ajax content inside the block specified in the "data-content-block" attribute.
The path to the loaded page is specified in the href parameter.
Three parameters are used for reviews:
"hotengine_shop_comments_shop_cat_page_id" - product ID.
"nc" - comment page number.
"snc_on_page" - number of comments on the page (from 1 to 50).
The page path can be relative, or complete, with http. The path must be either the path to the product, or you can immediately specify the ID of the product for which you want to upload reviews.
You can also use your own scripts by passing the GET or POST parameter "hotengine_shop_comments_shop_cat_page_id", with the full address
of the product (or product ID), at the address "/ajax.php". "nc" is the page number, "snc_on_page" is the number of comments on the page. Additionally, you can filter comments by rating by passing the "starrating_quality" variable, for example starrating_quality=5.
It is also possible to use direct requests without using Ajax.
For example, to load data into an iframe. The path is the same as when using Ajax.
Scripts for adding a product to the cart need to be loaded additionally if you are using an iframe.
Data loading script in pop-up window:
Ajax content loading popup script
To get data in JSON format, just add the GET/POST "json" variable.
An example of Ajax script for loading a list of products + «Generator of a list of products»
Ajax cart loading
Ajax cart loading.
A link with class "ajax_load_cart" will open Ajax content inside the block specified in the "data-content-block" attribute.
To load the cart, just click on the page «/ajax.php?cart&load_cart_ajax»
An example of an Ajax script for loading a shopping cart on hovering the mouse cursor
Ajax loading a list of product card images
Ajax loading list of all categories in JSON format
Ajax loading list of all categories in JSON format.
To get a list of all store categories, just run a query at /ajax.php?json&shop_categories&start=0¶m=:productsГде
- &start= - ID of the category to start displaying from.
- ¶m= parameters that can be obtained in the Categories Widget (optional parameter)
- The request only works with your domain, like http://example.com/ajax.php?json&shop_categories&start=0
Result Example: {"id":"Category ID","parentID":"Parent Category ID","child_cat":"Number of nested categories","child_items":"Number of products in a category","image":"Category image path","title":"Name of category"},
Ajax loading product in JSON format
Ajax loading product in JSON format.
To get product card data in JSON format, just make a request to the address /ajax.php?json&shop_products&id=0When unloading goods, you can specify sorting and filtering options by the following parameters:
- id - product card ID (one or more values, separated by commas).
- pers_shop_cat_page_catid - store category ID (one or more values, separated by commas)
- producer - producer (one or more values, separated by commas)
- collection - collection (one or more values, separated by commas)
- sort_by - sorting
- order_by - sorting
- sort_instock_priority - sorting priority
- price_from - price from
- price_to - price to
- stock - availability
The request only works with your domain, for example http://example.com/ajax.php?json&shop_products&id=0
Ajax form loading (popup forms)
How to create a feedback form?
There are 3 ways to create a form.
- 1) The most flexible way is to open the form builder and create a form with the required fields. All instructions are available in the form constructor.
- 2) Create a functional page (feedback), upon opening which a standard feedback form will be displayed.
- 3) Use a popup feedback form that is generated by the following code:
Code: html <a class="hotengine-dialog-email" data-site="XXXX" href="javascript://">Write to us</a>
class = "hotengine-dialog-email" - denotes that the button to pop up the feedback form, and rel = "XXXX" - site ID.
XXXX replace with the ID of your site, which you can find out by hovering over the ADMIN PANEL button.
You can also specify a name for the pop-up window, and the text on the "Close" button. To do this, add data-close-button = "Close" and data-title = "Feedback" to the link with the email class.
The width and height of the window can be set using data-width = "600" and data-height = "640".
The text of the buttons in the form can be set using the attributes data-send-button = "Send" and data-clear-button = "Clear"
You can change the names of the input fields using CSS styles (the text is written in the form of content, before the after classes in css).
Example ↓
/*FORM TEXT TITTLES*/
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*/
Attention! The site provides the ability to create your own forms in automatic mode, as well as use pop-up windows to send the data necessary from the visitor. To do this, use the form builder.
Ajax loading of comments
Ajax loading of comments.
An element with the class "ajax_load_comments" will open Ajax content inside the block specified in the "data-content-block" attribute.
The ID of the loaded page is specified in the data-page-id parameter. Additionally, you can filter comments by rating by passing the "starrating_quality" variable, for example starrating_quality=5.
4 parameters are used for comments:
- hotengine_comments_hotengine_page_id - Page ID.
- nc - page number of comments.
- snc_on_page" - number of comments per page (from 1 to 50).
- hotengine_comments_page_type - page type.
Available page types (required):
- page - pages
- shop_category - shop categories
- shop_collection - shop collections
- shop_producer - manufacturers
- blog_category - article directory category
- blog_page - article
- news_page - news
You can use your own scripts by passing the GET or POST parameters "hotengine_comments_hotengine_page_id" and "hotengine_comments_page_type" to "/ajax.php". "nc" - page number, "snc_on_page" - number of comments per page.
To get data in JSON format, just add the GET/POST "json" variable.
Ajax загрузка отзывов к товарам
How to use Multilanding?
On the HotList.biz platform, you can configure Multilanding pages so that if a (part or complete) request matches, the content of entire blocks on the page (on pages, in products and in the menu) will change. The query can be search query data (automatically determined), as well as your own set GET variables. For example, when adding UTM tags in advertisements, you can use the "utm_term" tag, so the Multilanding page will be active for the "utm_term" GET variable. The data about the referral source is stored for no more than 24 hours. In this case, data on the source of referral through the affiliate program is stored for 120 days.
To confirm the site in the webmaster center (for example Google or Yandex), you need to add <meta> the code.
To do this, create a Block/Menu, insert the required meta code and place it in the service tags. After which your site will be confirmed.
In the same way, you can create your own website header and footer. You can insert almost any HTML code into the menu.
* - the heading "Manufacturer" can be replaced with the word you need.
We recommend to name the parent (first) heading "Store".
An example of creating a personal store category:
First, we recommend that you create a main category in which you will create subcategories.
Open store category editor in the Admin Center, and click "Add Category".
Select your site and click "OK".
Then enter a name (this will be the address for your category). For example, for the main category, create a group called "Store" named "store".
Done.
Similarly, you can manage Manufacturers (additional categories) categories.
** - In addition, if you need to open a list of products of a certain category, and a certain manufacturer, then it is enough to add the GET variable PRODUCER. It is enough to specify either the manufacturer's ID or its name in the variable. Example: "/pers_shop/water/?producer=bonaqua" In this case, a list of products within the "water" category will be shown, and for which the manufacturer is "bonaqua".
The search is carried out after submitting the form with the «search» variable. The data type for the search is specified using the path (page) to which the form is sent. To search for the «Product Catalog», the sending must be done to the page «/shop/».
How to add a search form to the Site Header?
In the Block/Menu located in the Site Header, you can add the following code:
Code: html |
<div align="center" id="hotengine-search_form_block" itemscope itemtype="https://schema.org/WebSite"> <link itemprop="url" href="//{HOTENGINE-SC:site_url}/"/> <form id="hotengine-search-searchinput" name="hotengine-search-searchinput" method="post" action="/ru/shop/" itemprop="potentialAction" itemscope itemtype="https://schema.org/SearchAction"> <meta itemprop="target" content="//{HOTENGINE-SC:site_url}/it/shop/?search={search}"/> <label> <input class="input" name="search" type="text" placeholder="Search..." id="hotengine-smart_search_input" value="" itemprop="query-input"> </label> <label> <button type="submit" class="search-button">Search</button> </label></form> </div> |
The code immediately contains Microdata for Google. On the way to submit the form (//{HOTENGINE-SC:site_url}/it/shop/?search={search}) specified it language, you can change it.
Example:
CSS block style, replacing the submit button with an image:
Code: css |
#hotengine-search_form_block{ position: relative; width:300px; float: right; z-index:2; height: 41px; margin:33px 0px 33px 10px; } #hotengine-search_form_block input{ height: 20px; vertical-align: middle; border: 1px solid #e5e5e5; padding: 0.15em; width: 20.0em; color:#9c9b9b; height: 20px; background: #fff; padding: 0 13px; height: 41px; } #hotengine-search_form_block input[type="text"]{ text-indent:4px;height: 39px; } #hotengine-search_form_block .search-button{ background:#41474c; border-radius:0px; vertical-align:middle; display:block; position:absolute; top:0px; right:0px; border:none; color:#fff; width:41px; height:41px; text-align:center; font-size:12px; line-height:25px; cursor:pointer; overflow:hidden; } #hotengine-search_form_block .search-button:after{ content:""; width:41px; height:41px; display:block; position: absolute; right:0px; top:0px; background:none; background-color:#d6d6d6; -webkit-mask:url("data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSJub25lIj4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4KDTxwYXRoIGZpbGw9IiMwMDAwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTcuMjUgMmE1LjI1IDUuMjUgMCAxMDMuMTQ0IDkuNDU1bDIuMzI2IDIuMzI1YS43NS43NSAwIDEwMS4wNi0xLjA2bC0yLjMyNS0yLjMyNkE1LjI1IDUuMjUgMCAwMDcuMjUgMnpNMy41IDcuMjVhMy43NSAzLjc1IDAgMTE3LjUgMCAzLjc1IDMuNzUgMCAwMS03LjUgMHoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgoNPC9nPgoNPC9zdmc+") center center no-repeat; -webkit-mask-size:20px; } #hotengine-search_form_block .search-button:hover:after{ background-color:#fff; } #hotengine-search_form_block .search-button:active:after{ top:1px; } |
Output of search query result in JSON format/search hints/drop-down list of products.
To get JSON data with product name, price, image and link, you can make an AJAX request to the file "/ajax.php?search_shop"
In the GET/POST variable "search" you must pass a part of the name or ID of the product. The request can be made only with paid hosting with a parked domain. The data can be used to implement the issuance of prompts in the search form.
You can turn on hints in the «Settings», in the «Search» tab - «Turn on hints when entering a search query».
An example of implementing a search hint ↓
You can enable this search hint in the settings, in the "Search" tab, "Search form display settings".
Create «Product Type» - «Sneakers».
«Characteristic» - we indicate several fields, «Multiple selection (Checkbox)» with the names: «Color», «Purpose», «Manufacturer».
After saving the field names, you will be able to fill in the possible options on the right.
Create values.
Color: White, Red, Green.
Purpose: Running, Basketball, Football.
Manufacturer: Adidas, Asics, Nike
Now in the product card in the «Parameters, price and variety» tab, specify «Product type» and specify the appropriate values.
If you need to create a search filter, then in the section «My blocks/menus» create a «Functional menu» - «Search with Filter by product type».
This block will be displayed wherever you enable display.
In order for the required type of product to automatically open in a certain category, then in the text of the «Functional block/menu» you need to specify the ID of the corresponding type of product, and also add the text «autopath», so that when performing a search, it is carried out on the same page, rather than going to general site search.
For example, if the ID of the previously created product type was 1123, then the block/menu text would be «1123autopath».
Now specify the path where to display the block/menu with the search filter
«Enter the characters, upon detection of which, to display the block/menu:»
/category_name/
Where category_name is the name of the category, the path where it is located.
To hide the Search filter when viewing the product card in the item «Enter characters, upon detection of which do not show block/menu:» enter
.htm
To hide the search box above the Product Type, in the Design Editor in Css Styles, add «.menu_position_left .hotengine-smart_search_input_label { display: none;}»
To hide the Product Type selection search box, in the Design Editor in CSS styles, add «.menu_position_left .shop_catalog_product_types_id_label { display: none;}»
.menu_position_left - means that we hide the fields in the Left block of the site.
To display the number of products with the specified parameters, you can use the («count») parameter when creating a Function Block/Menu with a search filter.
To hide undetected characteristics - «hideempty» (detailed on the Function Block/Menu creation page).
To display the visitor's selected search filter values at the top of the page, you can use the «checkedlist» parameter. This function can also be activated in the «Mobile Menu: Application» section under the «Search Filter» tab. It simplifies user access to selected search values, especially helpful when browsing the site on mobile devices or screens with lower resolution. The function only needs to be enabled once — either through the «checkedlist» parameter in the «My Blocks/Menu» - «Search Filter» section, or in the «Mobile Menu: Application» under the «Search Filter» tab.
For example, after adding a product to the cart, the callback_hotengine_cart_plus_after function is called if it exists
Code: JavaScript |
if(typeof(callback_hotengine_cart_plus_after) === "function"){ callback_hotengine_cart_plus_after(); } |
To run your own script of the callback_hotengine_cart_plus_after function, you must create it.
Code: JavaScript |
function callback_hotengine_cart_plus_after(){ // your script } |
A list of some of the Callback features:
callback_hotengine_ajax_load_products_list - after loading the product list (universal function in all cases of loading the product list with a script)
callback_hotengine_ajax_load_products - after loading the product list via the "Show more" button.
callback_hotengine_shop_products_list_div_button - after scrolling through the product list in the slide
callback_hotengine_shop_page_boughtwith_loaded($id) - after loading the "frequently bought with" list ($id-ID of loaded products)
Shop / Automatic description
callback_hotengine_shop_autodescription($type) - after displaying the automatic description ($type - html, ajax)
callback_hotengine_shop_autodescription_readmore($id,$job) - after loading expanded automatic description text ($job - show, hide, load)
Shop / Cart
callback_hotengine_cart_plus - after sending the request to add an item to the cart
callback_hotengine_cart_addresult($result,$item_id) - after adding an item to the cart, various result options ($result-result value. Values: "added" - added, "removed" - removed, "instock_smaller" - stock is less than the quantity added, "instock_smaller_exists" - stock is less than the quantity already in the cart)
callback_hotengine_cart_plus_after($items_in_cart) - after adding an item to the cart ($items_in_cart - number of items in the cart after completion)
callback_hotengine_cart_plus_after_boughtwith($ids) - after adding an item to the cart, the "frequently bought with" list is passed in the $ids variable
callback_hotengine_cart_plus_after_boughtwith_email($ids) - after adding an item to the cart, the "mailing list" is passed in the $ids variable (email distribution of other products)
callback_hotengine_cart_count_product_num - after selecting a product to change its quantity in the cart
Shop / Variant
callback_hotengine_shop_product_variaty_select - after selecting a variant
callback_hotengine_variety_change_price($price) - after selecting a variant and changing the price ($price - new price)
callback_hotengine_variety_change_sku($sku) - after selecting a variant and changing the SKU ($sku - new SKU)
callback_hotengine_variety_change_skuimage($img) - after selecting a variant if a new image is specified ($img - new image path)
callback_hotengine_variety_change_stock_count($stock) - after selecting a variant and changing the stock count ($stock - new stock count). This function does not initialize if not created, as it may not always be necessary to change the stock.
callback_hotengine_variety_require() - if no variant is selected, before the dialog box appears
callback_hotengine_variety_require_list($href) - if no variant is selected, before the dialog box appears when viewing the product list ($href - link to view the product card)
Shop / Favorite / Compare
callback_hotengine_favorite_addresult($result,$count_favorite) - after adding an item to favorites, various result options ($result-result value. Values: "added" - added, "removed" - removed; $count_favorite - number of items in favorites)
callback_hotengine_compare_plus() - after adding an item to the comparison list
Shop / Search
callback_hotengine_shop_catalog_product_types - after selecting the product type in the search filter
Shop / Stock
callback_hotengine_shop_product_stock_inform- after calling the "Notify about stock" window
callback_hotengine_shop_product_stock_inform_send - after sending the "Notify about stock" request
Shop / Delivery
callback_hotengine_loading_delivery_type - after selecting the delivery method
callback_hotengine_loading_delivery_type_finalvalues - after selecting the final delivery method
User
callback_hotengine_authorize_result($result) - function after user authorization ($result - execution result: 2-login or password error, 3-account is blocked, 4-activation required, 5-activation successful, 6-incorrect Captcha code)
Shop / Sell Statistic
callback_hotengine_statisticsell_printorder($a) - after calling the order print window. $a=1 - before displaying the window. $a=2 - after displaying the window.
Blog
callback_hotengine_blog_page_list_div_button - after scrolling through the article list in the slide
Dialog
callback_hotengine_dialog_email- after calling the feedback window
callback_hotengine_form_submit_result($a) - after submitting the form through dialog window. $a=0 - error. $a=1 - ok.
Mobile
callback_hotengine_mobilemenu_click($a,$href) - clicking links in the mobile menu. $a=0 - item links and top icons. $a=1 - subcategory links. $a=2 - after displaying the ajax content window.
callback_hotengine_mobilemenu_show - function of displaying the content of the mobile menu (to create the effect of appearance). By default $("#hotengine-mobile-outer").show(0); Example ↓
Code: html |
var $element = $("#hotengine-mobile-outer"); |
You can implement most of the solutions using scripts (JavaScript). Some of them are described on the instructions page, some on the settings page. Additionally, you can find ready-made solutions on the page Scripts for use on sites.
Available formats:
- Sitemap.xml Sitemap with all data
- XML Google Merchant (Extended & Reduced)
- XML Yandex Market
- CSV Price
- JSON All store catalog data
- Price for Hotline.ua +own margin
- Price for Prom.ua +own margin
- XML for Rozetka.ua +own margin
Generator and list of links available in admin panel - «XML/CSV/XLS/JSON»
Additionally, when unloading goods, you can specify sorting and filtering options by the following parameters:
- sort_by - sorting
- order_by - sorting
- sort_instock_priority - sorting priority
- price_from - price from
- price_to - price to
- producer - producer (one or more values, separated by commas)
- stock - stock
- collection - collection (one or more values, separated by commas)
- pers_shop_cat_page_catid - store category ID (one or more values, separated by commas)
Parameters can be specified as a GET variable, after the main path to the XML file. For example "path.xml?producer=1" You can find out the value options on the product import page in the instructions.
To do this, specify our NS servers in your domain settings:
NS1.HOTLIST.BIZ
NS2.HOTLIST.BIZ
Or IP address 88.218.28.193 in «A» entry.
Then contact us via feedback form . In the request, specify the site to which you want to connect the domain *, and the address of this domain.
* - we do not sell domains, to connect your domain, you need to pre-register/purchase.
Domains in the .RU zone are currently not serviced.
SSL
SSL stands for Secure Socket Layer and is an Internet standard security technology that is used to provide an encrypted connection between a web server (site) and a browser. SSL certificate allows us to use the HTTPS protocol (after connecting the SSL certificate, your site will be opened not via HTTP, but via the HTTPS protocol).What is HTTPS?
HTTPS (Hypertext Transport Protocol Secure) is a protocol that provides security and privacy when exchanging information between a site and a user's device. Site visitors expect that the data they provide will not fall into the hands of fraudsters. To protect the data that visitors leave on your site, start using the HTTPS protocol.How to connect an SSL certificate
You can purchase an SSL certificate connection from us «Let's Encrypt» for 0,20$/month + connection services when paying for hosting.
You can connect our SSL certificate at paying for hosting, by ticking the «SSL certificate» box.
You can connect the mail service Yandex, Mail.ru, Google.com and others to your domain.
For example, let's connect mail to Yandex.
2)Add your domain
3)Add MX and CNAME (according to the instructions from Yandex) or send us this data if the domain is parked on our NS server.
4)If you want to enable login via the web interface (mail.domain.com), then add the CNAME mail data domain.mail.yandex.net.
5) Create a TXT record with the value «v=spf1 redirect=_spf.yandex.net».
If you want to send messages not only from Yandex servers, specify additional servers in the following format: «v=spf1 ip4:IP-1 ip4:IP-2 ip4:IP-3 include:_spf.yandex.net ~all». Where IP-1, IP-2, IP-3 — are the IP addresses of additional servers.
Example in pictures part1
Example in pictures part2
After that you will be able to create many mailboxes with your domain.
To use your own SMTP server, specify the options you want above. Please note that to activate new mailboxes created on Yandex, you need to log in to the mailbox using the login-created mailbox and complete the registration of the mailing address.
br>
2) Select the appropriate tariff, for example 5GB - FREE, free
3) Add your domain @yourdomain. For verification, you will need to create a CNAME or TXT in the NS records of the domain. You can send the data and we will add it, or specify it yourself. It is desirable to send both TXT and CNAME data.
4) Add MX records with @ name or empty name.
Values in the table below:
Host/ Domain | Address/ Mail Server/ MX Entries/ Value | Priority |
@/ Blank/ Domain name | mx.zoho.eu. | 10 |
@/ Blank/ Domain name | mx2.zoho.eu. | 20 |
@/ Blank/ Domain name | mx3.zoho.eu. | 50 |
5) In NS records of the domain, create a text record with the value "v=spf1 ip4:88.218.28.193 include:zoho.eu ~all"
6) Optionally, you can add DKIM Signature https://www.zoho.eu/mail/help/adminconsole/dkim-configuration.html
7) Create email addresses and users.
8) Specify the created mailbox as the SMTP server on the site.
SMTP server: smtp.zoho.eu
Port: 465
Security Type: SSL
Или
SMTP server: smtp.zoho.eu
Port: 587
Security Type: TLS
https://www.zoho.eu/mail/help/zoho-smtp.html.
Connection instructions at www.zoho.eu.
To connect to the channel with notification of new orders, you need to send hotlist_viber_key (where key is your key) to the channel https://viber.com/hotlistbiz. You can share this key and use it from different devices with Viber.
You can install the key in the «Settings», in the «Notifications» tab. In addition, you can use a key for Forms, which can be specified in the «Form Editor».
To disable notifications, you must either change the keys, or send DISABLE hotlist_key (where key is your site or form key) to Viber.
To connect to the channel with notification of new orders, you need to send hotlist_telegram_key (where key is your key) to the channel https://t.me/hotlistbiz_bot. You can share this key and use it from various Telegram devices.
You can install the key in the «Settings», in the «Notifications» tab. In addition, you can use a key for Forms, which can be specified in the «Form Editor».
To disable notifications, you must either change the keys, or send DISABLE hotlist_key (where key is your site or form key) to Telegram.
This markup contains the following data:
data-hotengine-marking-type = page type
data-hotengine-marking-timestamp = date the page was created
data-hotengine-marking-view = number of views
The data is required if you want to prohibit or display additional data on a specific page, with a specific page type, or if you need to display the number of views, or the date of the material (news, article, product). In addition, by inspecting this element, you can find the post ID (page, article or product), as well as other additional data.
If you need any more data in the markup, please let us know.
Code: html |
<span class="hotengine-marking" data-hotengine-marking-type="shop_catalog_page" data-hotengine-marking-timestamp="1422368197" data-hotengine-marking-view="6" data-hotengine-marking-shop_catalog_page_id="71111" data-hotengine-marking-shop_catalog_page_price="1" data-hotengine-marking-shop_catalog_page_price_currency="USD" data-hotengine-marking-shop_catalog_page_complectation="22323" data-hotengine-marking-video="https://youtu.be/tAyVrZ1jzC4"> |
In addition, when setting individual delivery parameters, more attributes are added:
data-hotengine-marking-delivery="xxx"
data-hotengine-marking-delivery_price="xxx"
data-hotengine-marking-delivery_note="xxx"
In the presence of dimensions and weight of the goods, the following attributes are added: data-hotengine-marking-shop_cat_page_deliv_width="XX"
data-hotengine-marking-shop_cat_page_deliv_height="XX"
data-hotengine-marking-shop_cat_page_deliv_length="XX"
data-hotengine-marking-shop_cat_page_deliv_units="XX"
data-hotengine-marking-shop_cat_page_deliv_weight="XX"
data-hotengine-marking-shop_cat_page_deliv_weight_units="XX"
data-hotengine-marking-shop_cat_page_deliv_capacity="XX"
An example script that checks a page for the markup object and page type «shop_catalog_page» (product card page).
Code: html |
var product_marking = $(".hotengine-marking[data-hotengine-marking-type='shop_catalog_page']"); if(typeof product_marking !== typeof undefined && product_marking !== false && product_marking !='undefined' && product_marking !=''){ var product_id = product_marking.attr("data-hotengine-marking-shop_catalog_page_id"); console.log("ID PRODUCT IS "+product_id); } |
If the page is defined as a product card, then we extract the product ID - data-hotengine-marking-shop_catalog_page_id.
Available page types:
Shop:
- shop_catalog_page - product card
- shop_catalog_page_incategory - product card on the list page *
- shop_catalog_page_incategory_search - product card on the search result page
- shop_catalog_page_cart_products_list - product card in the cart
- pers_shop_catalog_category - store category
- shop_catalog_category - store category in the catalog hotlist.biz
- shop_catalog_category_collection - collection category, store
- shop_catalog_category_producer - manufacturer, store category
- shop_statistic_sale - sales statistics
- shop_catalog_page_cart_bought_with - buy with the product (when viewing the basket)
- blog_catalog_page - article
- blog_catalog_page_incategory - list of articles *
- news_catalog_page - news
- news_catalog_page_incategory - news list *
- news_catalog_page_incategory_menu - Block/Menu generated news list *
* - these list objects have micro-markup attributes added without using a separate hotengine-marking element.
An example of using markup ↓ (Post creation date display)
Code: html |
<!--HTML-start--> <script> //convert timestumo ti date function timeConverter(UNIX_timestamp){ var a = new Date(UNIX_timestamp * 1000); var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']; var year = a.getFullYear(); var month = months[a.getMonth()]; var date = a.getDate(); var hour = a.getHours(); var min = a.getMinutes(); var sec = a.getSeconds(); var time = date + ' ' + month + ' ' + year + ' ' + hour + ':' + min + ':' + sec; return time; } //add date to content $(function(){ $("#hotengine-content-blog .hotengine-blog-page-list-block").each(function(){ $(this).find(".contenth_i").prepend('<div class="hotengine_add_date">'+timeConverter($(this).attr("data-hotengine-marking-timestamp"))+'</div>'); }); }) </script> <!--HTML-end--> |
This script finds the markup element, #hotengine-content-blog .hotengine-blog-page-list-block (an article from the list) and inserts a Date previously converted from TIMESTAMP by the timeConverter function to the beginning of the .contenth_i element.
An example of using markup for the Personal Account button ↓ (Login/Logout/My Orders)
Code: html |
<div class="auth_block"><noindex> <a class="auth_login" rel="nofollow" href="/it/admin/">Personal Area</a> <a class="auth_my_orders" rel="nofollow" href="/it/statistic_orders.htm">Мои заказы</a> <a class="auth_logout" rel="nofollow" href="/?action=logout">Logout</a> </noindex></div> <style> .auth_my_orders{ display:none!important; } .auth_logout{ display:none!important; } [data-hotengine-marking-userid] .auth_login {display:none!important; } [data-hotengine-marking-userid] .auth_logout{ display:inline-block!important; } [data-hotengine-marking-userid] .auth_my_orders{ display:inline-block!important; } </style> |
This script contains links. The first is to the authorization page (.auth_login). The second is to the page with user orders (.auth_my_orders). Tray - Logout link (.auth_logout). Alternatively, you can create a registration link (/index.php?action=register).
After the user enters the site, using the CSS style and the [data-hotengine-marking-userid] attribute (which appears only if the user is authenticated), the .auth_login/My Account link is hidden and the .auth_my_orders/link is displayed My orders, as well as .auth_logout/Logout.
Also, the <HTML> for users, the data-hotengine-marking-userid markup is added, with the user ID.
If the user is added as a "Customer" with his own discount, then the data-hotengine-marking-user-group-discount tag is also added, with its size discounts.
Code: html |
<html lang="ru" data-hotengine-marking-userid="USERID" data-hotengine-marking-user-group-discount="-10%"> |
ru - site language
USERID - user ID
10% - the size of the client's discount.
If a user is added to a Client Group, then the ID of the group to which he belongs is additionally indicated.
Code: html |
<html lang="ru" data-hotengine-marking-userid="XXXXX" data-hotengine-marking-user-group-discount="-20%" data-hotengine-marking-user-group-id="XXXXX"> |
An example of additional markup in a product variety ↓
Code: html |
<ul class="hotengine-shop-product-variety_select" size="1" data-vpid="XXXXX" > <li value="0" title="Variety" >Variety</li> <li value="XXXXXX" data-hotengine-variety-disable-add="1" data-hotengine-variety-pricechange="+10" data-hotengine-variety-stockcount="10" class="">Variety 1</li> <li value="XXXXX" data-hotengine-variety-disable-add="0" data-hotengine-variety-pricechange="=500" data-hotengine-variety-stockcount="10" class="hotengine-shop-product-variety_hilight">Variety 2</li> <li value="XXXXX" data-hotengine-variety-disable-add="0" data-hotengine-variety-pricechange="-110" data-hotengine-variety-stockcount="10" class="hotengine-shop-product-variety_hilight-selected">Variety 3</li> </ul> |
data-hotengine-variety-disable-add - on/off the ability to add a variety to the basket (1-forbid, 0-allow). When you click on a variety that is turned off for adding, nothing happens and the price of the product and the article does not change.
data-hotengine-variety-pricechange - price change data, you can use it to create highlighting price change data (using javascript).
data-hotengine-variety-stockcount - quantity in stock
CSS classes for elements:
.hotengine-shop-product-variety_hilight - selected object (on mouseover).
.hotengine-shop-product-variety_hilight-selected - the selected object that was clicked (active variant).
In addition, for all child elements of the block with the function of adding to the basket disabled [data-hotengine-variety-disable-add="1"], the stylization of the decorating and the normal cursor on hover are added.
Example of a label for a search query in a store ↓
Code: html |
<span class="hotengine-marking" data-hotengine-marking-type="shop_catalog_page_incategory_search" data-hotengine-marking-search="separate search query" data-hotengine-marking-searchparam="?&search=search query full string (+ sorting and other data)" data-hotengine-marking-sortparam="additional sorting data" data-hotengine-marking-smart_search_price_from="price from" data-hotengine-marking-smart_search_price_to="price to" data-hotengine-marking-smart_search="search query when using search filter" data-hotengine-marking-searchresult-num="55"> |
data-hotengine-marking-searchparam - a search query can be used to link to a page with a query.
data-hotengine-marking-searchresult-num - the number of products found for the entered query.
Example of a label in a store's store categories ↓
Code: html |
<span class="hotengine-marking" data-hotengine-marking-type="pers_shop_catalog_category" data-hotengine-marking-view="9999" data-hotengine-marking-pers_shop_catalog_category_parent_id="222" data-hotengine-marking-pers_shop_catalog_category_child_count="2" data-hotengine-marking-pers_shop_catalog_page_count="999" data-hotengine-marking-pers_shop_catalog_page_child_count="1299" data-hotengine-marking-pers_shop_catalog_category_name="nameofcategory" data-hotengine-marking-pers_shop_catalog_category_id="8342"> |
data-hotengine-marking-pers_shop_catalog_category_parent_id - Parent category ID
data-hotengine-marking-pers_shop_catalog_category_child_count - number of subcategories (only for this parent)
data-hotengine-marking-pers_shop_catalog_page_count - number of products in this category
data-hotengine-marking-pers_shop_catalog_page_child_count - number of products in this and child subcategories
data-hotengine-marking-pers_shop_catalog_category_name - personal category name.
data-hotengine-marking-pers_shop_catalog_category_id - personal category ID.
Similar markup is used for Manufacturers.
An example of finding a tag with a search query in a store ↓
Code: html | ||
|
Besides, markup "data-hotengine -..." with additional data has been added to some blocks of the site.
For example, "data-hotengine-product-images-count" is the number of images for a product.
In the cart, the markings indicate the number of products, the total cost and the currency (data-hotengine-cart-count, data-hotengine-cart-total-price, data-hotengine-cart-currency)
Additional markup, «data-» implemented directly in markup elements, for example, element class="hotengine-categories-list-block" (category icon block) can contain markup: data-image="1" - there is a picture for the category, data-child-cat="7" - number of subcategories, data-child-items="5114" - The number of products in all internal headings, as well as the number of subcategories, data-ci="XX" - category ID. (data-ci - store categories, data-pci - manufacturer categories, data-cci - collection categories, data-bci - article catalog categories)
In the sales statistics, with a separate view of the order, micro-markup is also present.
An example of checking the presence of a markup element ↓
Code: html |
var $catergory = $('.hotengine-marking[data-hotengine-marking-type="pers_shop_catalog_category"]'); if (typeof $catergory !== typeof undefined && $catergory !== false && $catergory !== "undefined" && $catergory.length > 0){ var $nemecat = $catergory.attr("data-hotengine-marking-pers_shop_catalog_category_name"); alert("Category name is "+$nemecat); } |
Instructions for creating a sorting of goods in the store with an example ↓
Use the link to automatically create Sort functional menu or fill in the Block/Menu following the instructions below:
Create a "Block/Menu" location "at the top".
Block/Menu Name: hotengine_sort_products
Block/Menu Header: hotengine_sort_products
Block/Menu Position: Top
Show Block/Menu on pages: everywhere
Enter characters to display Block/Menu when found: (No spaces)
Enter characters to not display Block/Menu when found: (No spaces)
Code: |
<form id="hotengine-sort-products-generated" name="hotengine-sort-products-generated" method="get" action=""> <span> <label> <select name="sort_by" id="sort_by" onchange="this.form.submit()"> <option value="ASC">Sort:</option> <option value="ASC">Ascending</option> <option value="DESC">Descending</option> </select> </label> <label> <select name="order_by" id="order_by" onchange="this.form.submit()"> <option value="5">Sort:</option> <option value="0">By item ID</option> <option value="4">By Name</option> <option value="1">By Date</option> <option value="2">By Price</option> </select> </label> <label> <select name="NUM_ONPAGE" id="NUM_ONPAGE" onchange="this.form.submit()"> <option value="10">10</option> <option value="20">20</option> <option value="30">30</option> <option value="50">50</option> </select> </label> <input class="smart_search" name="smart_search" type="hidden" value=""> <input class="search" name="search" type="hidden" value=""> </span> </form> <script type="text/javascript" src="/templates/scripts/hotengine-script-sort-shop-products.js"></script> |
CSS style for the sorter (add CSS styles in the design editor):
Code: |
.hotengine_sort_products #menu_c .headm{ display:none; } .hotengine_sort_products #menu_c { border: none; background: none; text-align: right;} .hotengine_sort_products #menu_c select { background: transparent; padding: 5px 8px 5px 5px; font-size: 12px; line-height: 1; border-radius: 2px; height: 24px; -webkit-appearance: none; overflow: hidden; background: url(/templates/styles/menu_arrow/arrow-down.svg) no-repeat 95%; background-size: 16px; } .hotengine_sort_products #menu_c select[name="NUM_ONPAGE"] { background:none;} @-moz-document url-prefix(){ .hotengine_sort_products #menu_c select { padding:0px!important; background:none!important; } .menu_position_top_000000 #menu_c span:before{ content:"Сортировать:"; display:inline-block; padding: 5px; font-size: 12px; } } |
Where 000000 needs to be replaced with the ID of the created menu with the sorting code.
Instructions for changing the message about an unselected variety ↓
Variety selection error text:
A message about the need to select a type of product is implemented in the dialog box using a CSS element. You can replace labels in CSS styles:
Code: СSS |
html:lang(ru) .hotengine-shop_cart_add_error_wrong_variety:after{ content:"Вы не выбрали разновидность товара."; } html:lang(en) .hotengine-shop_cart_add_error_wrong_variety:after{ content:"You did not select a complete set of goods."; } html:lang(uk) .hotengine-shop_cart_add_error_wrong_variety:after{ content:"Вы не обрали різновид товару."; } html:lang(pl) .hotengine-shop_cart_add_error_wrong_variety:after{ content:"Nie wybrałeś typu produktu."; } |
In addition, before displaying the message, the callback function callback_hotengine_variety_require is called..
When viewing the list of products, before displaying the message, the callback function callback_hotengine_variety_require_list($href) is called, where the link to the product card is passed as $href.
An example of a function with a dialog box, which is the default and can be changed:
Code: JavaScript |
<script> function callback_hotengine_variety_require(){ $("body").append('<div id="hotengine-shop_cart_add_error_wrong_variety"><a class="hotengine-shop_cart_add_error_wrong_variety-btn-close" data-micromodal-close onclick=\'(function() { $("#hotengine-shop_cart_add_error_wrong_variety,#hotengine-shop_cart_add_error_wrong_variety-data").remove(); return false; })();\'></a></div>'); hotengine_micromodal({ id: "hotengine-shop-cart-add-error-wrong-variety", content: $("#hotengine-shop_cart_add_error_wrong_variety-data").html(), defaultWidth: $(window).width() > 410 ? "410px" : "90%", defaultHeight: "", minWidth: "290px", onCloseRemove: false, unsetContentHeight: true, onCloseEvent: function(){ $("#hotengine-shop-cart-add-error-wrong-variety,#hotengine-shop_cart_add_error_wrong_variety-data").remove(); } }); return false; } </script> |
In the product parameters, you can specify a title above the list of varieties. The length of the header is added as a CSS class. For example, if the title is "Select Weight", then its length is 24 characters. The class hotengine-shop-product-variety-title_24 is specified accordingly. You can use either text or heading length above the variation. For example:
Code: JavaScript |
<script> function callback_hotengine_variety_require(){ if($(".hotengine-shop-product-variety-title_24").length > 0){ $text = "You have not chosen the weight!"; } else if($(".hotengine-shop-product-variety-title_38").length > 0){ $text = "You have not chosen the quantity!"; } else if($(".hotengine-shop-product-variety-title_26").length > 0){ $text = "You have not chosen a color!"; } else { $text = "You have not chosen a variety! "; } $("body").append('<div id="hotengine-shop_cart_add_error_wrong_variety"><b>'+$text+'</b><a class="hotengine-shop_cart_add_error_wrong_variety-btn-close" data-micromodal-close onclick=\'(function() { $("#hotengine-shop_cart_add_error_wrong_variety,#hotengine-shop_cart_add_error_wrong_variety-data").remove(); return false; })();\'></a></div>'); hotengine_micromodal({ id: "hotengine-shop-cart-add-error-wrong-variety", content: $("#hotengine-shop_cart_add_error_wrong_variety-data").html(), defaultWidth: $(window).width() > 410 ? "410px" : "90%", defaultHeight: "", minWidth: "290px", onCloseRemove: false, unsetContentHeight: true, onCloseEvent: function(){ $("#hotengine-shop-cart-add-error-wrong-variety,#hotengine-shop_cart_add_error_wrong_variety-data").remove(); } }); return false; } </script> |
Instructions for adding a link to product reviews/ratings ↓
To create a link to the Rating icons in the list of products, you need to find all the items in the list, and add a link around the rating items.
Besides, after loading the list of products in the slider or using the "Show more" button, you need to add the link again (callback_hotengine_ajax_load_products and callback_hotengine_shop_products_list_div_button).
Code: JavaScript |
<script type="text/javascript"> <!-- $(function(){ $(".hotengine-shop-product-list-block .hotengine-shop-product-rating-block").each(function(){ var $urlr = $(this).parent().find(".hotengine-shop-product-read_more a").attr("href"); $(this).wrap('<a class="hotengine-shop-product-rating-block-url" href="'+$urlr+'#tabs-review"></a>'); }); }); function callback_hotengine_ajax_load_products(){ $(".hotengine-shop-products-list-content-append .hotengine-shop-product-list-block :not([.hotengine-shop-product-rating-block-url]) .hotengine-shop-product-rating-block").each(function(){ var $urlr = $(this).parent().find(".hotengine-shop-product-read_more a").attr("href"); $(this).wrap('<a class="hotengine-shop-product-rating-block-url" href="'+$urlr+'#tabs-review"></a>'); }); } function callback_hotengine_shop_products_list_div_button(){ $(".hotengine-shop-products-list-content .hotengine-shop-product-list-block .hotengine-shop-product-rating-block").each(function(){ var $urlr = $(this).parent().find(".hotengine-shop-product-read_more a").attr("href"); $(this).wrap('<a class="hotengine-shop-product-rating-block-url" href="'+$urlr+'#tabs-review"></a>'); }); } --> </script> |
For the link object, you need to set a position, for example CSS:
Code: JavaScript |
.hotengine-shop-product-list-block .hotengine-shop-product-rating-block{ position:relative; display: block; bottom: 0px;} .hotengine-shop-product-list-block .hotengine-shop-product-rating-block-url{ position:relative; display: block; bottom: 1px;} |
Additional blocks in the shopping cart: If a product has a wholesale price, then a SPAN element .hotengine-shop-product-price_opt_inform_block is created.
Code: html |
<span class="hotengine-shop-product-price_opt_inform_block"><span class="hotengine-shop-product-price_opt_inform_block_title"></span><span class="hotengine-shop-product-price_opt_inform_original_price">100</span><span class="hotengine-shop-product-price_opt_inform_original_price_opt">100</span></span> |
.hotengine-shop-product-price_opt_inform_block_title - block with the text «Wholesale price » (can be changed through CSS styles, content).
.hotengine-shop-product-price_opt_inform_block - block with information about the discount
.hotengine-shop-product-price_opt_inform_original_price - price
.hotengine-shop-product-price_opt_inform_original_price_opt - wholesale price
If the product has a special order, then a SPAN element .hotengine-shop-product-price_sale_inform_block is created.
Code: html |
<span class="hotengine-shop-product-price_sale_inform_block"><span class="hotengine-shop-product-price_sale_inform_block_title"></span><span class="hotengine-shop-product-price_sale_inform_original_price">100</span><span class="hotengine-shop-product-price_sale_inform_original_price_old">120</span></span> |
.hotengine-shop-product-price_sale_inform_block_title - block with the text «Promotional price» (can be changed through CSS styles, content).
.hotengine-shop-product-price_sale_inform_block - block with information about the discount
.hotengine-shop-product-price_sale_inform_original_price - price
.hotengine-shop-product-price_sale_inform_original_price_old - old product price (displayed only if the value is specified and is not equal to zero)
For each page, this data is unique, for example, it can be the ID of the page (article, product, page).
Below is a list of basic data for AutoCorrect.
{HOTENGINE-SC:current_page_id} - ID of the current page (article, page, product, news)
{HOTENGINE-SC:site_url} - Your site url (address)
{HOTENGINE-SC:lang} - Language of the opened page
{HOTENGINE-SC:site_tagline} - Site slogan
{HOTENGINE-SC:contacts} - Block with contacts
{HOTENGINE-SC:slide_menu_widget:XX} - Block with the Slide Menu widget
{HOTENGINE-SC:slider_widget:XX} - Block with Slider widget
{HOTENGINE-SC:smart_search_widget:PARAM} - Block with widget Search filter
{HOTENGINE-SC:mainmenu} - Main menu
{HOTENGINE-SC:langmenu} - language switching
{HOTENGINE-SC:favorites} - link to selected products
{HOTENGINE-SC:user_nickname} - Username (if authorized)
{HOTENGINE-SC:user_id} - User ID (if he has performed authorization)
{HOTENGINE-SC:user_login} - User login (if he has performed authorization)
{HOTENGINE-SC:user_discount} - User discount
{HOTENGINE-SC:user_cahback} - Balance Cashback
{HOTENGINE-SC:user_group_id} - User group ID
{HOTENGINE-SC:shop_cart_menu} - shopping cart (Block/Menu Cart)
{HOTENGINE-SC:shop_compare_menu} - comparison of goods
{HOTENGINE-SC:shop_cat_page_image} - The path to the product image (if the product page is open)
{HOTENGINE-SC:shop_cat_page_id} - Product ID (if the product page is open). You can also use {HOTENGINE-SC:current_page_id}
{HOTENGINE-SC:shop_cat_page_sku} - Product SKU (if the product page is open)
{HOTENGINE-SC:shop_cat_page_currency} - Product currency (abbreviated) (if the product page is open)
{HOTENGINE-SC:shop_cat_page_currency_iso} - Product currency (ISO) (if the product page is open)
{HOTENGINE-SC:shop_cat_page_price} - Product price (if the product page is open)
{HOTENGINE-SC:shop_cat_page_title} - Name of product
{HOTENGINE-SC:shop_cat_page_video} - Video URL (link to video)
{HOTENGINE-SC:pers_shop_cat_val_name} - Store category name (only within a category and a button in the list of subcategories)
{HOTENGINE-SC:pers_shop_cat_val_title} - Store category header title (only within the category and the button in the list of subcategories)
{HOTENGINE-SC:pers_shop_cat_val_id} - Store category ID (only within a category and a button in the list of subcategories)
{HOTENGINE-SC:shop_cat_producer_val_name} - Manufacturer's category name (only within a category and a button in the list of subcategories)
{HOTENGINE-SC:shop_cat_producer_val_id} - Manufacturer category ID (only within a category and a button in the list of subcategories)
{HOTENGINE-SC:shop_cat_collection_val_name} - Collection category name (only within the category and the button in the list of subcategories)
{HOTENGINE-SC:shop_cat_collection_val_id} - Collection category ID (only inside a category and a button in the list of subcategories)
{HOTENGINE-SC:blog_cat_val_name} - The name of the article directory category (only within the category and the button in the list of subcategories)
{HOTENGINE-SC:blog_cat_val_id} - Category ID of the article directory (only in the category button)
{HOTENGINE-SC:blog_cat_page_id} - Article ID (only in the article directory)
{HOTENGINE-SC:blog_cat_page_title} - Article title (only in the article directory)
{HOTENGINE-SC:blog_cat_val_id} - Category ID of the article directory (only within the category and the button in the list of subcategories)
For example, you can use this code to display the name of an authorized user on the site:
Code: html |
<span class="user_login_name">Welcome {HOTENGINE-SC:user_login}</span> |
Or you can use this code to generate Meta data for social media (for example, Open Graph markup):
Code: html |
<meta property="og:image" content="{HOTENGINE-SC:shop_cat_page_image}"/> <meta property="og:title" content="{HOTENGINE-SC:shop_cat_page_title}> |
Example of creating a link to an authorized user profile:
Code: html |
https://hotlist.biz/{HOTENGINE-SC:lang}/users.php?p=user_profile&action=userprofile&userid={HOTENGINE-SC:user_id} |
Example ↓
Code: html |
<script type="text/javascript" src="/modules/jquery.cookie/jquery.cookie.min.js"></script> <script type="text/javascript"><!-- //function for defining GET variables from the address bar function getParameterByName($from,$name){ var match = RegExp('[?&]' + $name + '=([^&]*)').exec($from); return match && decodeURIComponent(match[1].replace(/\+/g, ' ')); } $(function(){ //when sort_by is found, start writing an array with data, GET site sorting variables var $from = window.location.href; if(getParameterByName($from,"sort_by")!=undefined){ var $hotengine_cookie_conv_to_get = [ {'sort_by': getParameterByName($from,"sort_by") }, {'order_by': getParameterByName($from,"order_by") }, {'order_by_param': getParameterByName($from,"order_by_param") }, {'shop_new_goods': getParameterByName($from,"shop_new_goods") }, {'shop_sale': getParameterByName($from,"shop_sale") }, {'shop_bestsellers': getParameterByName($from,"shop_bestsellers") }, {'shop_discount': getParameterByName($from,"shop_discount") }, {'shop_reduced_price': getParameterByName($from,"shop_reduced_price") }, {'sort_instock_priority': getParameterByName($from,"sort_instock_priority") }, {'price_from': getParameterByName($from,"price_from") }, {'price_to': getParameterByName($from,"price_to") }, {'NUM_ONPAGE': getParameterByName($from,"NUM_ONPAGE") }, {'smart_search': getParameterByName($from,"smart_search") }, {'search': getParameterByName($from,"search") }, ]; //write Cookie with data in JSON format $.cookie("hotengine_cookie_conv_to_get", JSON.stringify($hotengine_cookie_conv_to_get), {expires: 365, path: "/"}); } // to delete cookies use $.cookie("hotengine_cookie_conv_to_get", null, {expires: 0, path: "/"}); }); //--> </script> |
As a result, if the visitor sorts the goods, then the data «sort_by», «order_by», «NUM_ONPAGE» and others are taken out from the address bar. Data is written to Cookie in json format. After that, when opening pages in the future, the site, upon detecting the cookie «hotengine_cookie_conv_to_get», converts the names (indices) of the array into GET variables with the corresponding indices and values. Thus, having chosen to sort the site once, the visitor will see it until the Cookie is changed.
One way to implement multilingual sites is with the hreflang tag. An example of such a tag:
<link rel="alternate" hreflang="lang_code" href="url_of_page" />
The multilingual function is implemented on various pages of the site (categories, pages, articles, product cards and others). For example, if you have added a product card in English, Belarusian, Russian and Ukrainian languages, then it is enough to specify the same value in all product cards in the «Product in other languages» cell, for example - «1». In this case, when opening a page in one of the languages, hreflang tags with links to pages in other languages will be added. It is recommended to use the ID of the first product card to avoid duplicate values and subsequent errors. For example, if you added the product «Sneakers», with the ID «12345», then adding a similar product in English, specify in the item «Product in other languages» - «12345».
The main selected language of the site will be marked with an additional hreflang="x-default" tag.
To create headings of articles catalog or store, we recommend using the language prefix. For example, the heading «dress» can be created in other languages using the prefix «dress_ua», «dress_de», «dress_fr» ...
It is possible to use the same path to a category in other languages, but when importing data, for example, a product, errors may occur, since the platform will not be able to recognize the language of the category to which it is added. Therefore, we recommend using prefixes in sections with headings, article catalog and online store. When using language prefixes as described above, the «Category in other languages» variable will be set automatically.
When creating product cards, the «SKU» must be unique, therefore in another language you can use, for example, your own endings «SKU_DE». If «Product in another language» is indicated, then when the basic data (cost, availability, new product, hit of sales, access) is changed, all product catalogs specified as an alternative version of the main product will also be updated.
«Search filter» and «Blocks/menus» can be used simultaneously for all languages, and separately specify the language in which to display it. For example, create a «Blocks/menu», Site header, and place it on all pages, specifying the language «English (en)». Such a block will be displayed everywhere only if the English version of the site is open. In the same way, you can create a header for other languages. If you need to place some code, then it is not necessary to create such a «Blocks/menu» for each language, you can specify the language «All», and the block will be displayed regardless of the language chosen by the visitor.
The language prefix on the Hotlist.biz platform is indicated at the beginning, for example, «/en/page.htm».
Export Store Categories. Change the «Previous» language value in the language cell to the «NEW» language value, and also translate the titles and descriptions (for example, using the Google Translate service for documents, after saving the file in XLSX). In this case, the «Language» of all child categories will be the same as the language of the main category to which they are added. Therefore, for the main category (whose parent is «main») it is important to change the value of the «Language» cell to «NEW LANGUAGE». To eliminate possible errors during the subsequent import of goods, we recommend using unique names, or adding a new category «_NEW LANGUAGE» to the «name». For example, «category_en» where «en» is the new language being added.
You must save the file in «XLS» or «CSV» format before importing. After importing, check that the language of the new categories is appropriate. If for some reason the wrong language is specified, then change the language of the main category of your catalog to which they are added, in the «Store» - «Store Categories» section. For all child subcategories, the language will also be replaced. If there are not many categories, then you can copy the categories, replacing the language and name in them, in the «Store» - «Store Categories» section.
Perform the import, In the section «Shop» - «Import goods». You can quickly fill in the correspondence of cells by clicking «Fields from the file, specify the correspondence» - «Fill in the selection of correspondence fields according to the export file (fields «Unload all»)».
In addition, to create the correct markup for search engines, as well as redirect between products in different languages, in the products of the main language, export and re-import by copying the value of the «ID» cell into the «Products in other languages» column. (In this case, you can import only one cell «Product in other languages» and specify the ID or «Product code» by which products to be overwritten will be found). Thus, both new and previously created products will have identical meaning «Product in other languages».
The code from the example below generates a button for switching to alternative languages, and if an alternative language version is specified for a page/article/product card, then it will be used.
1) Paste the Css code into the Design Editor, in the CSS tab.
2) Add JavaScript to the block/menu displayed on all pages.
3) Paste the code of the drop-down list of languages into the block/menu where you want to place it, for example, into the site header.
4) Remove unnecessary languages from the block (class hotengine-shop-select-language-val)
Language selection menu code:
Code: html |
<span class="hotengine-shop-select-language-box"> <span class="hotengine-shop-select-language" data-lang="it"></span> <span class="hotengine-shop-select-language-values"> <a class="hotengine-shop-select-language-val" data-lang="by"></a> <a class="hotengine-shop-select-language-val" data-lang="de"></a> <a class="hotengine-shop-select-language-val" data-lang="en"></a> <a class="hotengine-shop-select-language-val" data-lang="es"></a> <a class="hotengine-shop-select-language-val" data-lang="fr"></a> <a class="hotengine-shop-select-language-val" data-lang="kz"></a> <a class="hotengine-shop-select-language-val" data-lang="pl"></a> <a class="hotengine-shop-select-language-val" data-lang="ru"></a> <a class="hotengine-shop-select-language-val" data-lang="uk"></a> </span> </span> |
CSS styles:
Code: CSS style |
/*LANGUAGE BLOCK*/ .hotengine-shop-select-language-box { display:inline-block; width:71px; height:auto; overflow:hidden; border:1px solid transparent; line-height:30px; position:relative; z-index:1000; } .hotengine-shop-select-language { display:block; width:100%; text-align:center; cursor:pointer; } .hotengine-shop-select-language-values { display:block; width:100%; vertical-align: top; position:absolute; background:rgba(255, 255, 255, 0.80); } .hotengine-shop-select-language-box:hover{ overflow:visible;} .hotengine-shop-select-language-values:hover .hotengine-shop-select-language-val{ position:relative; } .hotengine-shop-select-language-val { width:auto; display:block; margin:0px; vertical-align:top; cursor:pointer; text-align:center; color:inherit; text-decoration:none; } .hotengine-shop-select-language-val:hover {background:inherit;color:inherit;} .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="ru"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="ru"]:after { content: "RU"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="en"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="en"]:after { content: "EN"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="uk"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="uk"]:after { content: "UA"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="de"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="de"]:after { content: "DE"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="es"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="es"]:after { content: "ES"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="fr"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="fr"]:after { content: "FR"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="kk"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="kk"]:after { content: "KK"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="be"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="be"]:after { content: "BE"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="ro"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="ro"]:after { content: "RO"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="tr"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="tr"]:after { content: "TR"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="it"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="it"]:after { content: "IT"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="sk"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="sk"]:after { content: "SK"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="da"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="da"]:after { content: "DA"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="pl"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="pl"]:after { content: "PL"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="zh"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="zh"]:after { content: "ZH"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="hi"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="hi"]:after { content: "HI"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="ar"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="ar"]:after { content: "AR"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="pt"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="pt"]:after { content: "PT"; } .hotengine-shop-select-language-box .hotengine-shop-select-language[data-lang="bn"]:after, .hotengine-shop-select-language-box .hotengine-shop-select-language-val[data-lang="bn"]:after { content: "BN"; } /*LANGUAGE BLOCK*/ |
The file is automatically uploaded on the site if the available languages are specified:
Code: JavaScript |
<script type="text/javascript" src="/templates/scripts/hotengine-script-language.js"></script> |
File content
The text is split using the parent lang attribute of the html element.
Example:
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:"আপনার নাম:"; }
How can you translate the entire site?
When creating a multilingual site, specify the language in the created content (page, menu, categories ...)
And use paths with the language at the beginning, /ru/ /en/ ...
The main language will be the one specified when registering the site.
When adding goods, the language is determined in accordance with the category to which it is added.
You can replace most of the elements on the site using CSS styles and pseudo-elements.
Inscriptions about the quantity of goods
html:lang(en).hotengine-shop-product-price_for-lang-1:after{ content:"piece";}
Substitute a number, lang-1, where 1 stands for the selected unit of measure and (en) stands for the language.
List of values:
- 1 - piece;
- 2 - 100 pcs;
- 3 - 1000 pcs;
- 4 - for 1 package;
- 38 - for 100 grams;
- 5 - 1 kg;
- 6 - 1000 kg;
- 39 - 1 lb;
- 7 - 1 m 2 ;
- 8 - for 1 meter;
- 9 - for 1 km;
- 10 - per set;
- 11 - in 1 hour;
- 12 - in 1 day;
- 13 - in 1 month;
- 14 - for 1 year;
- 15 - per hundred square meters;
- 16 - per acre;
- 17 - per Hectare;
- 18 - per plot;
- 19 - per object;
- 30 - for 1 ml;
- 31 - for 1 liter;
- 32 - for 1 km 3 ;
- 33 - for 1 m 3 ;
- 34 - for 1 dm 3 ;
- 35 - for 1 cm 3 ;
- 36 - for 1 mm 3 ;
- 37 - for 1 hl;
Code: JavaScript |
<script> $(document).ready(function(){ $("#hotengine-shop-cart-form .hotengine-form-submit input[type='submit']").val('Send order'); }); </script> |
Read more ... ↓
Translation is carried out using the tool Translation of characteristic values.
You can also translate using JavaScript. However, with such an XML translation, the characteristics will be uploaded to MarketPlac's in one language.
Показать ↓
In this case, to upload XML to MarketPlace use the main language of the search filter.
Show ↓
Create a «Block/Menu» and place it on pages where the search filter is enabled.
For example, in the item «Enter characters upon detection of which to display Block/Menu:» specify:
/de/shop/
/de/pers_shop/
An example of translation of strings, as well as the «Apply button».
Code: js |
<script> $(function(){ var $dict = { 'Colour': 'Farbe', 'Blue': 'Blau', 'Green': 'Grün', 'Black': 'Schwarz' } $.each($dict, function(txtorig, txtnew){ $("#shop_catalog_product_types_id_ajax .product_types_valuebox_checkbox span:contains('"+txtorig+"')").html(txtnew); $("#shop_catalog_product_types_id_ajax .shop_catalog_product_types_block_title:contains('"+txtorig+"')").html(txtnew); $(".shop_catalog_product_properties_block .shop_catalog_product_types_block_title:contains('"+txtorig+"')").html(txtnew); $(".shop_catalog_product_properties_block .product_types_valuebox_checkbox:contains('"+txtorig+"')").html(txtnew); }); setTimeout(() => { $(".hotengine-smart_search_submit_button").find("input").val("Anwenden"); $("#searchinp_smart_search .button").val("Anwenden"); }, 100); }); </script> |
An example of a translation with word rewriting:
Code: js |
<script> $(function(){ var $dict = { 'Colour': 'Farbe', 'Blue': 'Blau', 'Green': 'Grün', 'Black': 'Schwarz' } $.each($dict, function(txtorig, txtnew){ $("#shop_catalog_product_types_id_ajax").html(function() { return $(this).html().replace(txtorig, txtnew); }); }); setTimeout(() => { $(".hotengine-smart_search_submit_button").find("input").val("Anwenden"); $("#searchinp_smart_search .button").val("Anwenden"); }, 100); }); </script> |
Likewise, you can add other languages and new words by placing the code on the appropriate language versions of the site.
How can I change the labels in the timer?
Using CSS styles, you can replace words in the timer. To do this, for example, in the product, insert the css html code:
Code: css |
<style type="text/css"> <!-- / * inscription left to end * / html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-day:after{ content:"дней"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-hourse:after{ content:"часов"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-minute:after{ content:"минут"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-seconds:after{ content:"секунд"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-left:after{ content:"осталось до конца акции!"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-done:after{ content:"Акция завершена!"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-day:after{ content:"days"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-hourse:after{ content:"hours"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-minute:after{ content:"minute"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-seconds:after{ content:"seconds"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-left:after{ content:"left before the end of the campaign!"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-done:after{ content:"Сampaign complete!"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-day:after{ content:"dni"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-hourse:after{ content:"godziny"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-minute:after{ content:"minuty"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-seconds:after{ content:"sekundy"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-left:after{ content:"pozostało do końca promocji!"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-description-akciya-countdown-l-done:after{ content:"Ackia ukończona!"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-days:after{ content:"дней"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-hours:after{ content:"часов"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-minutes:after{ content:"минут"; } html:lang(ru) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-seconds:after{ content:"секунд"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-days:after{ content:"days"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-hours:after{ content:"hours"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-minutes:after{ content:"minute"; } html:lang(en) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-seconds:after{ content:"seconds"; } html:lang(uk) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-days:after{ content:"днів"; } html:lang(uk) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-hours:after{ content:"годин"; } html:lang(uk) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-minutes:after{ content:"хвилин"; } html:lang(uk) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-seconds:after{ content:"секунд"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-days:after{ content:"dni"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-hours:after{ content:"godziny"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-minutes:after{ content:"minuty"; } html:lang(pl) #hotengine-shop-product-description-akciya-countdown-block .hotengine-shop-product-akciya-countdown-numbers-seconds:after{ content:"sekundy"; } --> </style> |
lang(en) or lang(ru) - this is the language for which the corresponding inscription will be, and then the block itself is set for which the inscription will be changed.
How to use Timer on other pages? Insert the following code to use our countdown counter:
Code: js |
<div id="hotengine-shop-product-description-akciya-countdown-block"><div id="hotengine-shop-product-description-akciya-countdown"></div><div class="hotengine-shop-product-akciya-countdown-numbers"><span class="hotengine-shop-product-akciya-countdown-numbers-days"><i></i></span><span class="hotengine-shop-product-akciya-countdown-numbers-hours"><i></i></span><span class="hotengine-shop-product-akciya-countdown-numbers-minutes"><i></i></span><span class="hotengine-shop-product-akciya-countdown-numbers-seconds"><i></i></span></div><span class="hotengine-shop-product-description-akciya-countdown-l-left"></span></div> <script type="text/javascript" src="/modules/jquery.cookie/jquery.cookie.min.js"></script> <link rel="stylesheet" type="text/css" href="/templates/javascript_timer_countdown/hotengine_timer_countdown.css" /> <script src="/templates/javascript_timer_countdown/hotengine_timer_countdown.js"></script> <script async="true" type="text/javascript"> <!-- $(function(){ var timerperiod = 5*12*60*60*1000; // timer period, in the example 5 days 12 hours (5 * 12 ...) (for example, here the date is constantly shifting, i.e. the current date + XX days.) // cookies last visit (to take away the time of the last visit) if($.cookie("cookie_lastvisit_countdown_timer") && $.cookie("cookie_lastvisit_countdown_timer")!="null"){ var cookie_lastvisit_minus = (new Date()).getTime() - $.cookie("cookie_lastvisit_countdown_timer"); } else { var cookie_lastvisit_minus = 0; } var checkdate = timerperiod-cookie_lastvisit_minus; // to check the date of the last visit and the end of the promotion if(checkdate>0){ counterdisable = false; } else { var cookie_lastvisit_minus = 0; counterdisable = true; }; var cookie_lastvisit_countdown_timerv = new Date().getTime() - cookie_lastvisit_minus; $.cookie("cookie_lastvisit_countdown_timer", cookie_lastvisit_countdown_timerv, {expires: null, path: "/"}); // cookies last visit (to take away the time of the last visit) ts = (new Date()).getTime() + timerperiod - cookie_lastvisit_minus; //set the end date of the promotion hotengine_inittimer("hotengine-shop-product-description-akciya-countdown-block", new Date(ts)); }); //--> </script> |
To change the labels of the counter, open the style file /templates/javascript_timer_countdown/hotengine_timer_countdown.css, copy its code, and paste it into the page to change the labels.
The main blocks of the site
ID and Class of the main blocks of the site.#hotengine-wrapper
#hotengine-header
#hotengine-footer
|
* - The main internal block with content is implemented using CSS Grid:
CSS Grid ↓
Code: CSS |
/*CONTENT GRID*/ #hotengine-content-container { display: grid; grid-template-areas:"container-left container-center container-right"; grid-template-columns:0% 1fr 0%; margin:0 auto; width:100%; } #hotengine-content-container[data-hasside="both"]{ grid-template-areas:"container-left container-center container-right"; grid-template-columns: auto 1fr auto; } #hotengine-content-container[data-hasside="left"]{ grid-template-areas:"container-left container-center"; grid-template-columns: auto 1fr; } #hotengine-content-container[data-hasside="right"]{ grid-template-areas:"container-center container-right"; grid-template-columns: 1fr auto; } .hotengine-wrap-container-side-center { grid-area: container-center; vertical-align:top; margin:0 auto; width:100%;} .hotengine-wrap-container-side-left { grid-area: container-left; vertical-align:top; margin:0 auto; width:auto; max-width:270px; } .hotengine-wrap-container-side-right { grid-area: container-right; vertical-align:top; margin:0 auto; width:auto; max-width:270px; } .menu_position_top { display:block; width:100%; } .menu_position_buttom { display:block; width:100%; } @media (max-width:767px){ #hotengine-content-container[data-hasside="both"]{ grid-template-areas:"container-center container-left container-right"; grid-template-columns: 1fr auto auto; } #hotengine-content-container[data-hasside="left"]{ grid-template-areas:"container-center container-left"; grid-template-columns: 1fr auto ; } #hotengine-content-container[data-hasside="right"]{ grid-template-areas:"container-center container-right"; grid-template-columns: 1fr auto ; } } /*CONTENT GRID*/ |
data-hasside - an additional attribute of the #hotengine-content-container element, which indicates the presence of a left and right block.
- [data-hasside="left"] - left block/menu is present
- [data-hasside="right"] - right block/menu is present
- [data-hasside="both"] - there is a left and right block/menu
Inside these blocks, the content you created, or the menu, will be located.
Each «page typeы» highlighted by the corresponding block, with the assignment of a specific ID.
For example:
- Pages - #hotengine-content-page
- News - #hotengine-content-news
- Article Directory - #hotengine-content-blog
- Product catalog - #hotengine-content-shop
- Product catalog (manufacturers) - #hotengine-content-shop
- Product catalog (collection) - #hotengine-content-shop
This block is created inside the #hotengine-content element
Also, on category pages where there is a child list of pages, a class is added:
- Product catalog - .hotengine-content-shop-category
- Product catalog (collection) - .hotengine-content-shop-collection
- Product catalog (manufacturer) - .hotengine-content-shop-producer
- Article Directory - .hotengine-content-blog-category
- News directory - .hotengine-content-news-category
In addition, an additional block is created for Blocks/Menus of news or articles list:
Last articles menu - #hotengine-content-menu-lastblogpost
Latest news menu #hotengine-content-menu-lastnewspost
Using the mouse pointer, you can change the height of the site header, the size of the logo, the position of the main menu and the slogan.
How to Create Your Own Website Header Design?
Create a Block/Menu with a location in the Header and place the necessary elements in it. For example, a Div with a phone number, and a Div with an inscription about the company (do not forget to assign them the appropriate class or id, for subsequent reference to them according to the specified values).
Open the design editor, set the position and design properties to the created elements in CSS styles.
In the same way, you can create any graphic elements on the site and place them in the places you need.
If you are using a plugin template, then its styles take less precedence than some of the above values. Before using the pluggable template, we recommend that you first return the default design value.
Default css styles: CSS file Main site blocks
If the displacement and positioning of elements cannot be done using CSS, then you can use Javascript and move objects around the page.
Changing the position of some elements using Javascript.
Code: html |
<script type="text/javascript"> $(function(){ var newproducer = $(".hotengine-shop-product-desc-block .hotengine-shop-product-producer").html(); if(typeof newproducer !== typeof undefined && newproducer !== false && newproducer !='undefined' && newproducer !=''){ $(".hotengine-shop-product-desc-block .hotengine-shop-product-producer").hide(); $(".hotengine-shop-product-sku-box").after('<span class="hotengine-shop-product-producer">'+newproducer+'</span>'); } }); </script> |
In this example, we check if the manufacturer is specified. If the manufacturer is specified, then hide it and place it after the "SKU" field.
"Wrapping" elements with Javascript.
Code: html |
<script type="text/javascript"> $(function(){ $(".element").wrap("<div class='new'></div>"); }); </script> |
As a result, the object with the element class will be "wrapped" in a div with the class "new" (<div class="new"><span class="element"></span></div>)
Template Catalog - https://templates.hotlist.biz/en/
You can enable visitor tracking using Google Analytics at Settings, in the Statistics/Google Analytics tab.
How to use it?
Tracking tags will send standard e-commerce events for Google Analytics 4 or Google Tag Manager. In addition, on the checkout or form submission page, you can additionally set your own conversion codes.
Event Descriptions:
Google Analytics 4
Google Tag Manager
In addition, you can implement passing your own tags using JavaScript, Short codes and Micromarking hotengine-markers, that allow you to replace dynamic data.
- add_to_cart - adding a product to the cart
- add_to_wishlist - adding a product to favorites
- begin_checkout - checkout start
- purchase - successful checkout
- remove_from_cart - remove an item from the cart
- search - site search
- select_item - product variety selection
- generate_lead - send data via form
- sign_up - registration
- view_cart - view cart
- view_item - view item card
Additional variables:
- Page type - ecomm_pagetype
- Product ID - ecomm_prodid
- Total value of goods - ecomm_totalvalue
Идентификатор отслеживания Facebook Pixel можно указать в общих настройках сайта, во вкладке «Статистика». Пиксель будет передавать данные о посещении страниц (PageView), события добавления товара в корзину (AddToCart), просмотр товара (ViewContent), начало (InitiateCheckout) и завершение оформления заказа (Purchase). Стоимость товара формируется в USD по курсу вашего сайта.
Кроме того, вы можете создать блок меню для генерации пикселя с данными о товаре самостоятельно.
Инструкция ↓
Внимание! При создании кода пикселя не через настройки сайта, обязательно нужно предварительно добавлять основной код пикселя. Для этого создайте блок/меню с основным кодом пикселя и расположите в служебных тегах, отображаемом на всех страницах. При этом в общих настройках сайта, код пикселя указывать не нужно. Если код пикселя в основных настройках указан, то код Products Merchant Facebook на сайте уже установлен.
Блок меню для генерации пикселя с данными о товаре
Создайте блок/меню со следующим кодом:
Code: |
<script> fbq('track', 'ViewContent', { content_name: '{HOTENGINE-SC:shop_cat_page_title}', content_ids: ['{HOTENGINE-SC:shop_cat_page_id}'], content_type: 'product', value: {HOTENGINE-SC:shop_cat_page_price}, currency: '{HOTENGINE-SC:shop_cat_page_currency_iso}' }); </script> |
Показывать Блок/Меню на страницах:Только на страницах Магазина
Введите символы, при обнаружении которых отображать Блок/Меню:htm
Введите символы, при обнаружении которых не отображать Блок/Меню:cart
Если необходимо добавить событие после отправки заявки через Форму, то после текста об успешной отправки данных добавьте следующий код:
Code: html |
<script> fbq('track', 'Purchase'); </script> |
- The site can use Referral Tails. When ordering goods or sending a letter through feedback, data about the source of the referral to your site will be added to the letter. Also when using UTM endings (URL Builder) this data will be added to letter.
In addition to the standard linker data, the source can be divided into groups, which are used in sales statistics to separate sources and more conveniently calculate conversions. The group value can be set using the GET variable "hotengine_referral_group". If no value is specified and utm_source is specified, then it will be used to specify the hotengine_referral_group.
Data about the referral source can be hidden by the visitor's browser settings or by using the secure protocol of the source site. In addition, you can additionally group orders using the "shop_cart_statistic_group" variable in the link, or manually after placing the order.
You can enable Referral Tails on the Settings page, in the Statistics tab.
Example of a link with UTM markup:
https://hotlist.biz/?utm_source=google&utm_medium=cpc&utm_term=slova&utm_content=soderjimoe&utm_campaign=nazvnie
An example of a link with Yandex Direct auto-markup and UTM markup:
https://hotlist.biz/?utm_source=yandex_{source_type}&utm_medium=cpc&utm_term={keyword}&utm_campaign=id:{campaign_id}&utm_content=ad:{ad_id}|gbid:{gbid}|phrase:{phrase_id}|param1:{param1}|position_type:{position_type}|position:{position}|source:{source}|source_type:{source_type}|param2:{param2}
Complete instruction
An example of a link with Google Adwords auto-markup, and UTM markup:
https://hotlist.biz/?utm_source=google_adwords_{network}&utm_medium=cpc&utm_term={keyword}&utm_campaign={campaignid}&utm_content=creative:{creative}|from:{ifsearch:search}{ifcontent:content}|matchtype:{matchtype}|adgroupid:{adgroupid}|feeditemid:{feeditemid}|targetid:{targetid}|device:{device}|adposition:{adposition}|placement:{placement}|network:{network}|param1:{param1}|param2:{param2}
Complete instruction
A POST request will be sent to the specified address, with all the information about the order, including the contact information of the customer, and the list of goods. Contact details and order information will be sent in JSON format by POST request.
For example, in «1c», you can implement receiving orders through «HTTP service»->«SiteExchange» -> «POSTData»
After placing an order, a POST request will be sent to the above address, with the following data:
Code: JSON |
array ( 'ORDER' => array ( 'form_name' => 'NAME', 'form_soname' => 'SONAME', 'form_phone' => 'PHONENUMBER123', 'form_email' => 'email@email.com', 'add_info_addres' => 'FLAT', 'form_address' => 'ADDRESS', 'form_delivery_select' => 'Extend ADDRESS (Selected)', 'form_delivery_select_storehouse' => 'Extend PICKUP POINT (Selected)', 'form_address1' => 'Extend ADDRESS (Region)', 'form_address2' => 'Extend ADDRESS (City)', 'form_address3' => 'Extend ADDRESS (Street)', 'form_address4' => 'Extend ADDRESS (Home number)', 'form_address5' => 'Extend ADDRESS (Flat)', 'form_address6' => 'Extend ADDRESS (Branch number)', 'form_text' => 'ADD TEXT', 'post' => '1596538754', 'lang' => 'ru', 'form_delivery' => '', 'form_delivery_country_code' => '', 'order_id' => 'XXXXX', 'user_id' => XXXX, 'order_discount' => '', 'order_hash' => '55d4ed2ed42b2c116d9927c2b2ce7fef', 'time' => 1596538769, 'delivery' => '', 'delivery_id' => 0, 'abtesting' => 0, 'referral_group' => '', 'group' => '', 'referral_url' => 'https://hotlist.biz/....', 'referral_utm' => '', 'site_id' => '10954', 'site_url' => 'hotlist.biz', 'transaction_id' => 'XXXXX', 'value' => 2264, 'currency' => 'UAH', 'shipping' => '0', 'items' => array ( 0 => array ( 'id' => '284430', 'name' => 'Adidas Originals Streetball Trainers FX9701 (42)', 'sku' => '200976_42', 'sku_parent' => '200976', 'variant' => '42 ', 'category' => 'sport_shoes', 'quantity' => '1', 'price' => '686', 'currency' => 'UAH', 'complectation_id' => '409151', ), 1 => array ( 'id' => '284436', 'name' => 'Shoe bag with pocket Kite Education College', 'sku' => '200982', 'sku_parent' => '200982', 'variant' => '', 'category' => 'bags_for_shoes', 'quantity' => '1', 'price' => '736', 'currency' => 'UAH', 'complectation_id' => 0, ), 2 => array ( 'id' => '284438', 'name' => 'ASICS Gel-Venture 8 Gs Trainers (43)', 'sku' => '200984_43', 'sku_parent' => '200984', 'variant' => '43 ', 'category' => 'sport_shoes', 'quantity' => '1', 'price' => '842', 'currency' => 'UAH', 'complectation_id' => '409154', ), ), ), ) |
If after sending a request, your service returns JSON data with the content «Number» or «crm_order_id», then an external order number will be added to the order.
A POST request will be sent to the specified address, with all the order data that is changed in the Sales Statistics. The information will be transmitted by POST request in JSON format.
For example, in 1c you can implement receiving orders through the «HTTP service»->«SiteExchange» -> «POSTData»
In addition, you can enable external access to your statistics by specifying the «Key to access sales statistics».
After changing the order status, a POST request will be sent to the above address in JSON format, with the following data:
Code: JSON |
array ( 'ORDER' = array ( 'shop_cart_statistic_crm_order_id' = '123', 'shop_cart_statistic_product_price' = '2264', 'shop_cart_statistic_product_currency' = '5', 'shop_cart_statistic_discount' = '', 'shop_cart_statistic_discount_before' = '', 'shop_cart_statistic_product_price_before' = '2264', 'shop_cart_statistic_product_currency_before' = '5', 'shop_cart_statistic_selldone_datestump_unsted' = '0', 'shop_cart_statistic_selldone' = '0', 'shop_cart_statistic_status_pay' = '0', 'shop_cart_statistic_allow_online_pay' = '0', 'shop_cart_statistic_selldone_from_seller' = '0', 'shop_cart_statistic_delivery_status' = '0', 'shop_cart_statistic_products_preview' = '', 'shop_cart_statistic_admin_note' = '', 'shop_cart_statistic_delivery_selected_id_before' = '3482', 'shop_cart_statistic_delivery_selected_id' = '3482', 'shop_cart_statistic_delivery_track_id' = '', 'shop_cart_statistic_delivery_track_id_link' = '', 'shop_cart_statistic_byer_name' = 'NAME SONAME', 'shop_cart_statistic_byer_phone' = 'PHONENUMBER123', 'shop_cart_statistic_byer_address' = 'ADDRESS', 'shop_cart_statistic_byer_address_eform0' => 'Extend ADDRESS (Selected)', 'shop_cart_statistic_byer_address_eform1' => 'Extend ADDRESS (Region)', 'shop_cart_statistic_byer_address_eform2' => 'Extend ADDRESS (City)', 'shop_cart_statistic_byer_address_eform3' => 'Extend ADDRESS (Street)', 'shop_cart_statistic_byer_address_eform4' => 'Extend ADDRESS (Home number)', 'shop_cart_statistic_byer_address_eform5' => 'Extend ADDRESS (Flat)', 'shop_cart_statistic_byer_address_eform6' => 'Extend ADDRESS (Branch number)', 'shop_cart_statistic_byer_email' = 'email@email.com', 'shop_cart_statistic_byer_paymentmethod_selected' => 'PaymentMethod (Selected)', 'shop_cart_statistic_group' = '', 'shop_cart_statistic_referral_group' = '', 'shop_cart_statistic_referral_url' = 'http://hotlist.biz', 'shop_cart_statistic_referral_utm' = '', 'shop_cart_statistic_site_manager_id_operator_current' = '1', 'cat_page_extend_1c_exportsalestat' = 'http://hotlist.biz/', 'buyer_id' = '1', 'manager_id_operator' = '0', 'order_products' = '284430,284436,284438', 'order_products_article' = '200976_42|200982|200984_43', 'order_products_num' = '1,1,1', 'order_products_complectationid' = '409151,407678,409154', 'order_products_prices' = '686,736,842', 'order_products_currency' = 'UAH,UAH,UAH', 'order_products_titles' = 'Adidas Originals Streetball Trainers FX9701|Shoe bag with pocket Kite Education College|ASICS Gel-Venture 8 Gs Trainers', 'order_products_complectation_titles' = '42||43', 'order_products_prices_without_discount' = ',,', 'post' = '1596578917', 'shop_cart_statistic_product_sendto_userid' = '1', 'Save' = 'Save', 'order_id' = 63738, 'order_discount' = '', 'time' = 1596578927, 'delivery' = NULL, 'delivery_id' = '3482', 'referral_group' = '', 'group' = '', 'referral_url' = 'http://hotlist.biz/ru/pers_shop/sport_shoes/284438.htm', 'referral_utm' = '', 'site_url' = 'hotlist.biz', 'transaction_id' = 63738, 'crm_oder_id' = '123', 'value' = '2264', 'currency' = 'UAH', 'items' = array ( 0 = array ( 'id' = '284430', 'name' = 'Adidas Originals Streetball Trainers FX9701', 'sku' = '200976_42', 'variant' = '42', 'quantity' = '1', 'price' = '686', 'currency' = 'UAH', 'complectation_id' = '409151', 'price_without_discount' = '', ), 1 = array ( 'id' = '284436', 'name' = 'Shoe bag with pocket Kite Education College', 'sku' = '200982', 'variant' = '', 'quantity' = '1', 'price' = '736', 'currency' = 'UAH', 'complectation_id' = '407678', 'price_without_discount' = '', ), 2 = array ( 'id' = '284438', 'name' = 'ASICS Gel-Venture 8 Gs Trainers', 'sku' = '200984_43', 'variant' = '43', 'quantity' = '1', 'price' = '842', 'currency' = 'UAH', 'complectation_id' = '409154', 'price_without_discount' = '', ), ), ), ) |
'shop_cart_statistic_selldone' - '3', transaction status // 0 - Not processed, 1 - Order in processing, 3 - Processed, 2 - Canceled, 5 - Canceled (Out of stock), 6 - Canceled (Refused), delete - Delete order completely
'shop_cart_statistic_status_pay' - '0', Order status // 0-Not specified, 1 - Paid online, not verified, 4 - Paid online and verified, 2 - Paid, 3 - Prepaid, 5 - Awaiting payment
'shop_cart_statistic_selldone_from_seller' - '1', Customer status // 0 - Not processed, 1 - Processing, 3 - Sent/Processed, 2 - Canceled
'shop_cart_statistic_admin_note' - 'Note to the administrator',
'shop_cart_statistic_delivery_status' - '0', '0 - Not specified, 1 - Delivered, 2 - Not delivered, 3 - Awaiting dispatch, 4 - Delivered to the courier, 5 - On the way, 6 - Sent to the post office, 7 - Sent to the recipient's address, 8 - Delivered to the post office, 9 - Delivered to the recipient's address'
'shop_cart_statistic_crm_order_id' - 'XXX', 'External order code (for use in third party CRMs)'
You can get more information on the fields in the statistics of sales, when editing an order.
When changing goods in the order, a JSON request is sent with a list of items, as well as the order number:
Code: JSON |
array ( 'ORDER' = array ( 'order_id' = 63738, 'time' = 1596589307, 'transaction_id' = 63738, 'crm_oder_id' = '123', 'value' = 2264, 'currency' = 'UAH', 'items' = array ( 0 = array ( 'id' = '284430', 'name' = 'Adidas Originals Streetball Trainers FX9701', 'sku' = '200976_42', 'variant' = '42', 'quantity' = '1', 'price' = '686', 'currency' = 'UAH', 'complectation_id' = '409151', ), 1 = array ( 'id' = '284436', 'name' = 'Shoe bag with pocket Kite Education College', 'sku' = '200982', 'variant' = 'XX', 'quantity' = '1', 'price' = '736', 'currency' = 'UAH', 'complectation_id' = '407678', ), 2 = array ( 'id' = '284438', 'name' = 'ASICS Gel-Venture 8 Gs Trainers', 'sku' = '200984_43', 'variant' = '43', 'quantity' = '1', 'price' = '842', 'currency' = 'UAH', 'complectation_id' = '409154', ), ), ), ) |
Specify the key to access the sales statistics in the settings, in the tab «Store». If you need to access sales statistics by an external application, then you can execute (POST/GET or AJAX) a request to the address «/ajax.php?statistic_sell»
In this case, you must specify the key in the request, with MD5 encryption. For example, if you have specified the key «123», then in the request it will be т «202cb962ac59075b964b07152d234b70».
In this case, the request will look like this: : «/ajax.php?statistic_sell&key=202cb962ac59075b964b07152d234b70»
In the request, you can specify data for sorting or searching (GET/POST parameters), which can be taken on your sales statistics page in the admin center (/page.php?p=statistic_sell&mystat). Sorting and selection of parameters is carried out by GET/POST request, for example, «&sort_dateperiod=1week» means that sales statistics for the week will be displayed.
The data is displayed in JSON format.
Please note that if you use the page requests that are open to visitors, they will be able to access your sales statistics using your key.
Specify the key to access the price list of the store in the settings, in the tab «Store». Full unloading of the price list is located at «/csv_export_products.csv»
In this case, you must specify the key in the request, with MD5 encryption. For example, if you have specified the key «123», then in the request it will be «202cb962ac59075b964b07152d234b70».
In this case, the request will look like this: «/csv_export_products.csv?key=202cb962ac59075b964b07152d234b70»
In the request, you can specify data for sorting and selecting fields, which can be taken on your export page in the admin center (/page.php?p=submit_catalog_page&subpage&export_from_shop). Sorting and selection of parameters is carried out by a GET/POST request, for example, «&export_product_access=export_product_access means that it will unload a field with data on product access.
Data is displayed in CSV format.
The upload file is cached to reduce the load and is updated once a day. You can delete the cache using the «Clear XML/CSV upload cache» button.
Example: https://blog.hotlist.biz/csv_export_products.csv?key=202cb962ac59075b964b07152d234b70
More information about advertising and promotion methods is described on this page https://hotlist.biz/it/ user_guide_seo.html
We recommend that you enable "language-specific forwarding". This feature helps to avoid duplicate start page (duplicates are bad for SEO). Due to the fact that the domain.com start page and the domain.com/it/ language-bound page are the same page, we recommend enabling 301 redirects to the language-bound page. This can be done in the Admin Center, Settings, Start Page.
If you plan to use your own domain, we recommend that you restrict access to the site on a temporary basis, and after purchasing a domain, open it.
If you need to Delete a site/Company information, then open the page for changing information about the Site/Company, and at the bottom, check the box "Delete site and all data" or "Remove site" After some time, information about the company/site will disappear from the search engine results.
Cache of multimedia files
According to the recommendations from the Search Engines, as well as for the convenience of visitors, we Enabled on your site «Data Compression&кaquo;, as well as Caching of graphic files and JavaScripts. The caching period of these files – one week.If you upload a new image on top of the old one, you will see the old image until the browser cache is cleared. Each browser has its own way of clearing the cache. For example, in Chrome, you need to press «CTRL+F5» to force a cleanup. in a browser window on your site.
Server cache
In addition, to speed up the work of sites, we also implemented caching of some text data, which is cleared automatically when it changes. However, if you changed the content of the page/product/article/menu, but the changes were not displayed on the page, then you need to forcibly clear the cache using the link in the «Clear cache« admin panel on the page in which the changes were not displayed.Maintaining the site and clearing the cache
The site caches data such as «Product variety», «Promotions» (including a timer), «RSS/XML/CSV» uploads, the number of products in a category. To clear the «RSS/XML/CSV» cache, select in the Admin Panel «XML/CSV/XLS/JSON» - «Clear cache of XML/CSV uploads».To recalculate varieties, the number of goods in categories and clear the cache of Promotions, go to «Settings», «Store» and at the bottom of the list in the item «Recalculation of goods and categories» select the necessary parameters for recalculation and service.
This procedure is recommended to be done after a large update of data in the store, changing categories, adding and changing or deleting a large number of varieties, adding and changing categories, transferring a product to other categories, or if the timer expires in promotions.
The site administration does not carry out trading activities and is not responsible for the quality of the services/goods sold within Hotlist.biz. The users who added them are responsible for all posted goods and services.
Contacts: https://hotlist.biz/en/feedback.html