Menu Tab Bar di website store Prestashop
Pertamakali punya blog (website) atau toko online, Anda harus pikirkan "Bagaimana pengunjung akan pergi dari HOMEPAGE ke halaman lain berisi content lebih spesifik? atau sebaliknya, bagaimana navigasi cepat dari content spesifik (INNER-PAGE) untuk kembali ke Homepage?
Navigasi website sangat penting agar pengunjung cepat menemukan content yang diinginkan. Pada saat yang sama juga membantu Search Engine memahami content apa yang menjadikan Webmaster Tools (Google) berpikir dan menganggapnya penting. Tamu biasa mengandalkan Menu-Tab-Bar diletakkan secara horizontal di bagian atas webpage, dan diujung kiri adalah link HOME.
Homepage situs merupakan halaman paling Utama (halaman root). Sebagai link untuk navigasi tamu HOMEPAGE ditaruh di urutan pertama paling kiri menu tab dengan judul HOME (Beranda) lalu diikuti daftar bagian lebih spesifik ke kanan dan seterusnya. Bentuk navigasi selain Menu Tab Bar adalah Label, Headline, Post Populer atau link-link lain tersebar di halaman website.
Blok Top Menu atau Wiznav Bar - arsip website
Blok top menu ialah Menu Tab Bar bawaan Prestashop. Tampilan sebenarnya tidak mengecewakan, tetapi boleh jadi kita ingin alternatif menu tab bar lain, misalnya WIZNAV BAR. Untuk memasangnya sangat rumit. Saya berhasil setelah berkali-kali gagal.
Jika berminat ikuti panduan ini :
Apakah sudah selesai? BELUM tampilan menu tab Bar belum tampak. Masalah nan rumit baru dimulai seperti cuplikan dari Forum Prestashop berikut :- Download modul di
http://www.ziddu.com/download/20901149/WIZNAV2.1.3.zip.html - Open file zip hasil download,
Extract To>> Lokasi simpan (e.g My Document) - Anda akan mendapati folder WIZNAV2.1.3 >> UPLOAD >> modules >> wiznav
- Upload pakai FTP (e.g. FileZilla) ke public_html/modules pada root server
- Buka Back Office >> Modules. Ketik wiznav di kotak search, klik modul Wiznav
- Klik “Install” dan silahkan atur setting.
I recently downloaded and installed Wiznav. However the instructions for assigning it to a hook tell me to amend the '
header.php'.To quote the instructions, open your header.php file and edit the following :
$smarty->assign(array(
'HOOK_HEADER' => Module::hookExec('header'),
'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
'HOOK_TOP' => Module::hookExec('top'),
'static_token' => Tools::getToken(false),
'token' => Tools::getToken(),
'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
'content_only' => intval(Tools::getValue('content_only'))
));
Edit it to the following :'HOOK_HEADER' => Module::hookExec('header'),
'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
'HOOK_TOP' => Module::hookExec('top'),
'static_token' => Tools::getToken(false),
'token' => Tools::getToken(),
'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
'content_only' => intval(Tools::getValue('content_only'))
));
$smarty->assign(array(
'HOOK_HEADER' => Module::hookExec('header'),
'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
'HOOK_WIZNAV' => Module::hookExec('wiznav'),
'HOOK_TOP' => Module::hookExec('top'),
'static_token' => Tools::getToken(false),
'token' => Tools::getToken(),
'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
'content_only' => intval(Tools::getValue('content_only'))
));
Berhari-hari saya mencoba memahami apa yang terjadi, bagian mana yang salah (apakah instruksinya salah atau memang isi file php ini memang tidak familiar dengan modul WIZNAV 2.1.3).
if (isset(Context::getContext()->controller))
$controller = Context::getContext()->controller;
else
{
$controller = new FrontController();
$controller->init();
}
Tools::displayFileAsDeprecated();
$controller->displayHeader();
$controller = Context::getContext()->controller;
else
{
$controller = new FrontController();
$controller->init();
}
Tools::displayFileAsDeprecated();
$controller->displayHeader();
Atau disini - http://www.prestashop.com/forums/user/358599-yusufzulkarnain/. Dalam forum tersebut saya sampaikan inisiatif copy paste snippet kedua diatas tepat di bagian snippet bawah ini :
Tools::displayFileAsDeprecated();
$controller->displayHeader();
$controller->displayHeader();
Sementara masalahnya saya biarkan, saya ikuti instruksi selanjutnya :
Then open public_html/classes/controller/FrontController.php and edit this (I find it at line of 448) :
'HOOK_HEADER' => Hook::exec('displayHeader'),
'HOOK_TOP' => Hook::exec('displayTop'),
'HOOK_TOP' => Hook::exec('displayTop'),
Add 'HOOK_WIZNAV' => Module::hookExec('wiznav'), Finally you see like this :
'HOOK_HEADER' => Hook::exec('displayHeader'),
'HOOK_WIZNAV' => Module::hookExec('wiznav'),
'HOOK_TOP' => Hook::exec('displayTop'),
'HOOK_WIZNAV' => Module::hookExec('wiznav'),
'HOOK_TOP' => Hook::exec('displayTop'),
Terakhir buka public_html/themes/
default/header.tpl (default nama template bawaan Prestashop 1.5.2.0 yang boleh jadi sudah Anda ganti dengan nama lain (misalnya Prestanesia atau nama lain). <!-- Header -->
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
</a>
<div id="header_right" class="grid_6 omega">
{$HOOK_TOP}
</div>
</div>
<div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">
{/if}
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
</a>
<div id="header_right" class="grid_6 omega">
{$HOOK_TOP}
</div>
</div>
<div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">
{/if}
Sisipkan ini dibawah
<div>
{$HOOK_TOP}
</div>
{$HOOK_TOP}
</div>
Sehingga menjadi ini :
<!-- Header -->
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
</a>
<div id="header_right" class="grid_6 omega">
{$HOOK_TOP}
</div>
</div>
<div>
{$HOOK_WIZNAV}
</div> <div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">
{/if}
<div id="header" class="grid_9 alpha omega">
<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
</a>
<div id="header_right" class="grid_6 omega">
{$HOOK_TOP}
</div>
</div>
<div>
{$HOOK_WIZNAV}
</div> <div id="columns" class="grid_9 alpha omega clearfix">
<!-- Left -->
<div id="left_column" class="column grid_2 alpha">
{$HOOK_LEFT_COLUMN}
</div>
<!-- Center -->
<div id="center_column" class=" grid_5">
{/if}
Terakhir SIMPAN. Selamat mencoba.
.
.
.
.
.
.
.
.
![[Valid Atom 1.0]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgqz1Fz0W3QZkeG4LsKvQplfCdmyhCrU3j95NWl1i-XarshrBBaYCr4hKUMKj5XbhHwJRvEFMd3j2pDLZepCzvjQU0kMiNhvbs51qAWczA_Mrw7y_wj0czorZsxBhfr9Y5Q8IN_vsORSA/w88-h31-no/valid-atom.jpg "Validate my Atom 1.0 feed")
