{"id":15126,"date":"2018-02-22T16:20:49","date_gmt":"2018-02-22T13:20:49","guid":{"rendered":"https:\/\/belvg.com\/blog\/?p=15126"},"modified":"2025-02-11T13:12:57","modified_gmt":"2025-02-11T11:12:57","slug":"product-tabs-for-cms-prestashop-1-7","status":"publish","type":"post","link":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html","title":{"rendered":"Product Tabs for CMS Prestashop 1.7"},"content":{"rendered":"\n<p>Recently we&rsquo;ve started redesigning some Prestashop modules. The first module we&rsquo;re upgrading is Produ&#1089;tTabs. The module allows creating and adding extra tabs on the product page as well as displaying additional information about most important products in the store. So let&rsquo;s consider how to upgrade it to CMS 1.7.<!--more--><\/p>\n<p>As you know, Prestashop 1.7 architecture is based on Symfony2, but only two parts of the back office including the Products and Modules pages underwent changes. With that in mind, we also need to consider additional changes.<\/p>\n<p>The basic settings page in the admin panel looks like that:<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_1.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15127 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_1.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_1\" width=\"1571\" height=\"909\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<ul>\n<li>There are new horizontal tabs appeared.<\/li>\n<li>The most important product settings are in the first tab.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_2.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15128 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_2.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_2\" width=\"1590\" height=\"853\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<ul>\n<li>Instead of previous additional tabs for every module, there&rsquo;s a list of modules appeared.<\/li>\n<\/ul>\n<p>Additionally, there&rsquo;s new functionality to save a product without refreshing a page. But it in its turn requires the number of changes in module management functionality (creating product tabs). We decided not to use the hookActionProductSave function but create the controller:<\/p>\n<pre class=\"lang:default decode:true\">&lt;?php\r\nclass AdminProductTabsController extends ModuleAdminController\r\n{\r\n&nbsp;&nbsp;&nbsp;&nbsp;public function ajaxProcessDeleteProductTab()\r\n&nbsp;&nbsp;&nbsp;&nbsp;{\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;try {\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$product_tab = new ProductTab(Tools::getValue('id_product_tab'));\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$product_tab-&gt;delete();\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$this-&gt;ajaxProcessGetProductTabList();\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} catch (Exception $e) {\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;throw new PrestaShopException($e-&gt;getMessage());\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}\r\n&nbsp;&nbsp;&nbsp;&nbsp;}\r\n\r\n&nbsp;&nbsp;&nbsp;public function ajaxProcessGetProductTabList()\r\n&nbsp;&nbsp;&nbsp;&nbsp;{\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;try {\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$product_tabs = ProductTab::getTabsByProductId(Tools::getValue('id_product'), false);\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$this-&gt;context-&gt;smarty-&gt;assign(array(\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'product_tabs' =&gt; $product_tabs,\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'product_tabs_link_get' =&gt; $this-&gt;context-&gt;link-&gt;getAdminLink('AdminProductTabs') . '&amp;ajax=1&amp;action=getproducttab',\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'product_tabs_link_delete' =&gt; $this-&gt;context-&gt;link-&gt;getAdminLink('AdminProductTabs') . '&amp;ajax=1&amp;action=deleteproducttab',\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;));\r\n\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;die($this-&gt;context-&gt;smarty-&gt;fetch(PRODUCT_TABS_DIR . 'views\/templates\/admin\/list.tpl'));\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} catch (Exception $e) {\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;throw new PrestaShopException($e-&gt;getMessage());\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}\r\n&nbsp;&nbsp;&nbsp;&nbsp;}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&hellip;\r\n}<\/pre>\n<p>It let us divide code into logical chains and use them twice, for example, as it is in the ajaxProcessDeleteProductTab method of AdminProductTabsController. After the tab is removed, the ajaxProcessGetProductTabList method is called to display the list of tabs left.<\/p>\n<p>The major change in the product template is the possibility to add a tab for every module using displayProductExtraContent:<\/p>\n<pre class=\"lang:xhtml decode:true\">...\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {foreach from=$product.extraContent item=extra key=extraKey}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li class=\"nav-item\"&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;a class=\"nav-link\" data-toggle=\"tab\" href=\"#extra-{$extraKey}\"&gt;\r\n{$extra.title}\r\n&lt;\/a&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/li&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{\/foreach}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &hellip;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {foreach from=$product.extraContent item=extra key=extraKey}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div class=\"tab-pane fade in {$extra.attr.class}\" id=\"extra-{$extraKey}\" {foreach $extra.attr as $key =&gt; $val} {$key}=\"{$val}\"{\/foreach}&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{$extra.content nofilter}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;\/div&gt;\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{\/foreach}\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ...<\/pre>\n<p>Unfortunately, this functionality wasn&rsquo;t suitable for us, as functionality changes should have affected the possibility of placing tabs in the certain order set by the website manager. That&rsquo;s why we had to act differently, as the template didn&rsquo;t allow intercepting tabs data array or HTML. For rendering with our module, we had to use javaScript to transfer the created tabs to the script:<\/p>\n<pre class=\"lang:js decode:true\">public function hookHeader()\r\n&nbsp;&nbsp;&nbsp;&nbsp;{\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (Tools::getValue('id_product')) {\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$id_product_tab_settings = ProductTabSettings::getIdByProductId(Tools::getValue('id_product'));\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$product_tab_settings = new ProductTabSettings($id_product_tab_settings);\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Media::addJsDef(array(\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'product_tabs' =&gt; $product_tabs,\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'product_tab_settings' =&gt; $product_tab_settings,\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;));\r\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}\r\n&nbsp;&nbsp;&nbsp;&nbsp;}<\/pre>\n<p>As a result, we got a user-friendly interface for managing product tabs:<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_3.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15130 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_3.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_3\" width=\"1617\" height=\"876\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_4.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15131 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_4.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_4\" width=\"1586\" height=\"845\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<p>The English version of the website:<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_5.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15133 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_5.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_5\" width=\"605\" height=\"178\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<p>The German version of the website:<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_6.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy alignnone wp-image-15134 size-full\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CRM-Prestashop-1.7_6.jpg\" alt=\"Product Tabs for CMS Prestashop 1.7_6\" width=\"599\" height=\"174\" title=\"Product Tabs for CMS Prestashop 1.7\"><\/a><\/p>\n<p>As you can judge considering the pictures above, the module works not only with different languages but also with different websites running on the same platform suitable for creating tabs for all categories, for all products, for producer and supplier.<\/p>\n<p>The module is available in our <a href=\"https:\/\/store.belvg.com\/extensions\/prestashop.html\" target=\"_blank\" rel=\"noopener\">Prestashop store<\/a>.<\/p>\n\n","protected":false},"excerpt":{"rendered":"So let\u2019s consider how to upgrade Prestashop Product Tabs module from 1.6 to 1.7 version.","protected":false},"author":2,"featured_media":15171,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"image","meta":{"_acf_changed":false,"footnotes":""},"categories":[15,520,523],"tags":[],"class_list":["post-15126","post","type-post","status-publish","format-image","has-post-thumbnail","hentry","category-prestashop","category-prestashop-custom-development","category-prestashop-seo","post_format-image"],"acf":[],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.4 - aioseo.com -->\n\t<meta name=\"description\" content=\"Recently we\u2019ve started redesigning some Prestashop modules. The first module we\u2019re upgrading is Produ\u0441tTabs.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Pavel Novitsky\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.4\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#article\",\"name\":\"Product Tabs for CMS Prestashop 1.7 | BelVG Blog\",\"headline\":\"Product Tabs for CMS Prestashop 1.7\",\"author\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/luge#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/02\\\/Product-Tabs-for-CMS-Prestashop-1.7.jpg\",\"width\":770,\"height\":433,\"caption\":\"Product Tabs for CMS Prestashop 1.7\"},\"datePublished\":\"2018-02-22T16:20:49+02:00\",\"dateModified\":\"2025-02-11T13:12:57+02:00\",\"inLanguage\":\"en-US\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#webpage\"},\"articleSection\":\"Prestashop, PrestaShop Custom Development, PrestaShop SEO, Image\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/prestashop#listItem\",\"name\":\"Prestashop\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/prestashop#listItem\",\"position\":2,\"name\":\"Prestashop\",\"item\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/prestashop\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#listItem\",\"name\":\"Product Tabs for CMS Prestashop 1.7\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#listItem\",\"position\":3,\"name\":\"Product Tabs for CMS Prestashop 1.7\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/prestashop#listItem\",\"name\":\"Prestashop\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\",\"name\":\"BelVG Blog\",\"description\":\"Magento and Prestashop articles\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/luge#author\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/luge\",\"name\":\"Pavel Novitsky\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/2c4388e3468896377123f434a9a2a2d64f479816da1570f85619b074102127b7?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"Pavel Novitsky\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#webpage\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html\",\"name\":\"Product Tabs for CMS Prestashop 1.7 | BelVG Blog\",\"description\":\"Recently we\\u2019ve started redesigning some Prestashop modules. The first module we\\u2019re upgrading is Produ\\u0441tTabs.\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/luge#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/luge#author\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/02\\\/Product-Tabs-for-CMS-Prestashop-1.7.jpg\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html\\\/#mainImage\",\"width\":770,\"height\":433,\"caption\":\"Product Tabs for CMS Prestashop 1.7\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/product-tabs-for-cms-prestashop-1-7.html#mainImage\"},\"datePublished\":\"2018-02-22T16:20:49+02:00\",\"dateModified\":\"2025-02-11T13:12:57+02:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\",\"name\":\"BelVG Blog\",\"description\":\"Magento and Prestashop articles\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"Product Tabs for CMS Prestashop 1.7 | BelVG Blog","description":"Recently we\u2019ve started redesigning some Prestashop modules. The first module we\u2019re upgrading is Produ\u0441tTabs.","canonical_url":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#article","name":"Product Tabs for CMS Prestashop 1.7 | BelVG Blog","headline":"Product Tabs for CMS Prestashop 1.7","author":{"@id":"https:\/\/belvg.com\/blog\/author\/luge#author"},"publisher":{"@id":"https:\/\/belvg.com\/blog\/#organization"},"image":{"@type":"ImageObject","url":"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CMS-Prestashop-1.7.jpg","width":770,"height":433,"caption":"Product Tabs for CMS Prestashop 1.7"},"datePublished":"2018-02-22T16:20:49+02:00","dateModified":"2025-02-11T13:12:57+02:00","inLanguage":"en-US","mainEntityOfPage":{"@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#webpage"},"isPartOf":{"@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#webpage"},"articleSection":"Prestashop, PrestaShop Custom Development, PrestaShop SEO, Image"},{"@type":"BreadcrumbList","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/#listItem","position":1,"name":"Home","item":"https:\/\/belvg.com\/blog\/","nextItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/prestashop#listItem","name":"Prestashop"}},{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/prestashop#listItem","position":2,"name":"Prestashop","item":"https:\/\/belvg.com\/blog\/category\/prestashop","nextItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#listItem","name":"Product Tabs for CMS Prestashop 1.7"},"previousItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#listItem","position":3,"name":"Product Tabs for CMS Prestashop 1.7","previousItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/prestashop#listItem","name":"Prestashop"}}]},{"@type":"Organization","@id":"https:\/\/belvg.com\/blog\/#organization","name":"BelVG Blog","description":"Magento and Prestashop articles","url":"https:\/\/belvg.com\/blog\/"},{"@type":"Person","@id":"https:\/\/belvg.com\/blog\/author\/luge#author","url":"https:\/\/belvg.com\/blog\/author\/luge","name":"Pavel Novitsky","image":{"@type":"ImageObject","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/2c4388e3468896377123f434a9a2a2d64f479816da1570f85619b074102127b7?s=96&d=mm&r=g","width":96,"height":96,"caption":"Pavel Novitsky"}},{"@type":"WebPage","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#webpage","url":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html","name":"Product Tabs for CMS Prestashop 1.7 | BelVG Blog","description":"Recently we\u2019ve started redesigning some Prestashop modules. The first module we\u2019re upgrading is Produ\u0441tTabs.","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/belvg.com\/blog\/#website"},"breadcrumb":{"@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#breadcrumblist"},"author":{"@id":"https:\/\/belvg.com\/blog\/author\/luge#author"},"creator":{"@id":"https:\/\/belvg.com\/blog\/author\/luge#author"},"image":{"@type":"ImageObject","url":"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/02\/Product-Tabs-for-CMS-Prestashop-1.7.jpg","@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html\/#mainImage","width":770,"height":433,"caption":"Product Tabs for CMS Prestashop 1.7"},"primaryImageOfPage":{"@id":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html#mainImage"},"datePublished":"2018-02-22T16:20:49+02:00","dateModified":"2025-02-11T13:12:57+02:00"},{"@type":"WebSite","@id":"https:\/\/belvg.com\/blog\/#website","url":"https:\/\/belvg.com\/blog\/","name":"BelVG Blog","description":"Magento and Prestashop articles","inLanguage":"en-US","publisher":{"@id":"https:\/\/belvg.com\/blog\/#organization"}}]}},"aioseo_meta_data":{"post_id":"15126","title":"Product Tabs for CMS Prestashop 1.7 | #site_title","description":"Recently we\u2019ve started redesigning some Prestashop modules. The first module we\u2019re upgrading is Produ\u0441tTabs.","keywords":null,"keyphrases":null,"focus_keyword":null,"additional_keywords":null,"truseo_locale":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_custom_url":null,"og_image_custom_fields":null,"og_image_url":null,"og_image_width":null,"og_image_height":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_image_url":null,"twitter_title":null,"twitter_description":null,"schema_type":"default","schema_type_options":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"limit_modified_date":false,"ai":null,"breadcrumb_settings":null,"seo_analyzer_scan_date":null,"created":"2026-11-03 18:37:11","updated":"2026-11-03 18:37:11"},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/belvg.com\/blog\/\" title=\"Home\">Home<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/belvg.com\/blog\/category\/prestashop\" title=\"Prestashop\">Prestashop<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\tProduct Tabs for CMS Prestashop 1.7\n\t\t<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/belvg.com\/blog\/"},{"label":"Prestashop","link":"https:\/\/belvg.com\/blog\/category\/prestashop"},{"label":"Product Tabs for CMS Prestashop 1.7","link":"https:\/\/belvg.com\/blog\/product-tabs-for-cms-prestashop-1-7.html"}],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts\/15126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/comments?post=15126"}],"version-history":[{"count":1,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts\/15126\/revisions"}],"predecessor-version":[{"id":28819,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts\/15126\/revisions\/28819"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/media\/15171"}],"wp:attachment":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/media?parent=15126"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/categories?post=15126"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/tags?post=15126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}