Menu Tab Bar
Jika ini pertamakalinya Anda punya Blog atau website atau toko online baru, Anda harus memikirkan Bagaimana pengunjung akan pergi dari homepage ke halaman lain yang berisi content lebih spesifik? Atau sebaliknya, bagaimana navigasi cepat dari konten spesifik untuk kembali ke Homepage?
Navigasi sangat penting bagi tamu pengunjung website Anda, agar cepat menemukan content yang diinginkan. Pada saat yang sama, hal ini juga membantu Search Engine memahami content apa yang menjadikan Webmaster Tools (Google) berpikir dan menganggapnya penting. Pada umumnya pengunjung sangat mengandalkan Menu Tab Bar yang biasanya diletakkan secara horizontal di bagian atas halaman web. dan diujung kiri adalah link HOME yang menuju Homepage.
Semua situs punya halaman paling Utama (biasanya sebagai halaman root). Sebagai link untuk navigasi pengunjung, biasanya HOMEPAGE ini ditaruh pada urutan pertama paling kiri dengan judul di menu tab HOME atau Beranda. Kemudian diikuti daftar bagian yang lebih spesifik ke kanan dan seterusnya. Bentuk navigasi untuk pengunjung selain tersebut diatas adalah Daftar Label, Headline, Post Populer atau link-link lainnya yang tersebar di halaman website.
Blok Top Menu atau Wiznav Bar
Blok top menu merupakan Menu Tab Bar bawaan Prestashop, seperti yang ada pada versi terbaru 1.5.2.0. Sebenarnya tampilannya tidaklah mengecewakan, tetapi boleh jadi kita ingin alternatif menu tab bar lain, misalnya WIZNAV BAR. Terus terang, untuk memasangkannya sangat rumit. Ketika pertama memasang pun saya berkali-kali mengalami kegagalan. Namun jika berminat ikuti panduan ini.
1. Download modulnya disini : http://www.ziddu.com/download/20901149/WIZNAV2.1.3.zip.html
2. Open file zip hasil download, klik “Extract To” dan tentukan dimana Anda simpan (misal di My Document)
3. Anda akan mendapati folder ini : WIZNAV2.1.3 >> UPLOAD >> modules >> wiznav
4. Lakukan upload menggunakan FTP (misalnya FileZilla) ke public_html/modules pada root server Anda.
5. Buka Back Office Prestashop >> Modules. Ketik wiznav pada kotak search, kemudian klik modul Wiznav.
6. Klik “Install” dan silahkan atur settingannya.
Apakah sudah selesai? BELUM tampilan menu tab Bar belum tampak. Masalah rumit baru dimulai seperti cuplikan dari Forum Prestashop di bawah ini :
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(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'))
));
Ketika saya membuka file header.php, sayang sekali saya keseluruhan isi file hanya seperti di bawah ini, 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).
$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'))
));
if (isset(Context::getContext()->controller))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 :
$controller = Context::getContext()->controller;
else
{
$controller = new FrontController();
$controller->init();
}
Tools::displayFileAsDeprecated();
$controller->displayHeader();
Tools::displayFileAsDeprecated();
$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'),Add 'HOOK_WIZNAV' => Module::hookExec('wiznav'), Finally you see like this :
'HOOK_TOP' => Hook::exec('displayTop'),
'HOOK_HEADER' => Hook::exec('displayHeader'),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 – misal Prestashop atau Prestanesia atau nama lain).
'HOOK_WIZNAV' => Module::hookExec('wiznav'),
'HOOK_TOP' => Hook::exec('displayTop'),
<!-- Header -->Sisipkan ini dibawah
<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>Sehingga menjadi ini :
{$HOOK_TOP}
</div>
<!-- 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}
Terakhir SIMPAN. Selamat mencoba.
SELESAI
0 comments:
Post a Comment