Cara Memasang Translate Menu Pada Menu Blog

Cara Memasang Translate Menu Pada Menu Blog

Pada kesempatan kali ini saya akan share tentang Cara Memasang Translate Menu Pada Menu Blog. Sebenarnya Anda bisa memiliki translate menu juga menggunakan template yang telah menyediakannya, akan tetapi template tersebut belum tentu cocok dengan selera sobat blogger. Oleh karena itu, kali ini saya akan share cara memasang translate menu ini pada menu bar atau Navigation Menu.

Sedikit review dari kelebihan translate menu ini. Kelebihannya adalah visitor yang berasal dari luar negri akan langsung di arahkan menuju google translate dan mengubah bahasa pada blog Anda ketika melakukan klik pada menu tersebut. Tidak hanya itu jika di klik, blog anda akan mendapatkan backlink langsung dari google translate. Kekurangannya sendiri hanya bisa melakukan translate ke bahasa Internasional yaitu bahasa inggris. Kecuali Anda melakukan setting ulang sehingga bahasanya bisa di ganti. BIla Anda tertarik untuk membuatnya, silahkan ikuti tutorial berikut.

1. Pastikan template blog sobat sudah memiliki menu bar atau navigation menu, bukan dari widget laman.

2. Masuk ke edit HTML lalu cari kode dari menu bar tersebut. Contoh kodenya seperti di bawah ini.

<ul id="menu">
    <li><a href="#">Home</a></li>
    <li>
        <a href="#">Categories</a>
        <ul>
            <li><a href="#">CSS</a></li>
            <li><a href="#">Graphic design</a></li>
            <li><a href="#">Development tools</a></li>
            <li><a href="#">Web design</a></li>
        </ul>
    </li>
    <li><a href="#">WorkShop</a></li>
    <li><a href="#">About</a></li>
</ul>

2. Tambahkan kode translate menu pada menu bar tersebut, berikut kodenya.

<a href='#' onclick='window.open(&apos;http://translate.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&amp;amp;langpair=id%7cen&amp;amp;hl=en&apos;); return false;' rel='nofollow' target='_blank' title='English'><span itemprop='name'>Translate</span></a>

3. Jangan lupa berikan kode <li> sebagai tag pembuka dan </li> sebagai tag penutup. Setelah di pasang dan di letakkan pada menu bar tadi, hasilnya akan seperti ini.

<ul id="menu">
    <li><a href="#">Home</a></li>
    <li>
        <a href="#">Categories</a>
        <ul>
            <li><a href="#">CSS</a></li>
            <li><a href="#">Graphic design</a></li>
            <li><a href="#">Development tools</a></li>
            <li><a href="#">Web design</a></li>
        </ul>
    </li>
    <li><a href="#">WorkShop</a></li>
    <li><a href="#">About</a></li>
    <li><a href='#' onclick='window.open(&apos;http://translate.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&amp;amp;langpair=id%7cen&amp;amp;hl=en&apos;); return false;' rel='nofollow' target='_blank' title='English'><span itemprop='name'>Translate</span></a></li>
</ul>

4. Silahkan save dan lihat hasilnya.

Untuk resultnya bisa Anda lihat pada menu bar di blog ini. Sekian tutorial kali ini, silahkan mencoba sendiri dan jangan lupa tinggalkan jejak dengan berkomentar pada artikel ini. Terima kasih banyak

Bagikan Artikel ini