Cara Membuat Menu Tab View Di Blog

Cara Membuat Menu Tab View Di Blog, Sebenarnya ini sudah banyak di publish di blog tetangga, tapi apa salahnya publih lagi untuk Anda yang belum membuat dan ingin Membuat Menu Tab View Di Blog.
Bagaimana Cara Pasang Tab View Menu Di blog ?, Jangan kemana-mana ikuti terus Master Chef karena Master Chef akan membahas tuntas mengenai resep ini. Berikut langkah-langkahnya :

Cara Membuat Menu Tab View Di Blog
Menu Tab View Blog
  1. Silahkan masing-masing login kehalaman blog
  2. Jika semua sudah masuk ke akun blog masing-masing, sekarang Akses halaman Edit HTML Blogspot
  3. Jangan lupa juga untuk download template lengkap untuk antisipasi kesalahan dalam edit HTML
  4. Jika sudah masuk hlaman Edit HTML cari kode ]]></b:skin> ( Gunakan tombol CTRL + F dan F3 untuk mempermudah pencarian kode )
  5. Jika kode sudah ditemukan Copy kode dibawah dan letakan diatas kode ]]></b:skin>
  6. div.TabView div.Tabs { height: 24px; overflow: hidden; } div.TabView div.Tabs a { float: left; display: block; width: 90px; /* Lebar Menu Utama Atas */ text-align: center; height: 24px; /* Tinggi Menu Utama Atas */ padding-top: 3px; vertical-align: middle; border: 1px solid #000; /* Warna border Menu Atas */ border-bottom-width: 0; text-decoration: none; font-family: "Times New Roman", Serif; /* Font Menu Utama Atas */ font-weight: 900; color: #000; /* Warna Font Menu Utama Atas */ } div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active { background-color: #FF9900; /* Warna background Menu Utama Atas */ } div.TabView div.Pages { clear: both; border: 1px solid #6E6E6E; /* Warna border Kotak Utama */ overflow: hidden; background-color: #FF9900; /* Warna background Kotak Utama */ } div.TabView div.Pages div.Page { height: 100%; padding: 0px; overflow: hidden; } div.TabView div.Pages div.Page div.Pad { padding: 3px 5px; }
     6. Kode yang berwana Biru merupakan keterangan dari kode yang bisa kamu rubah untuk penyesuaian dengan halaman blog kamu
    7. Sekarang Klik Simpan template 8. Ok Langkah selanjutnya, Kembali ke dashbord blog kamu pilih "Tata Letak atau Layout" 9. Klik Add a Gadget atau Tabah a Gadget 10. Tunggu bebera saat akan muncul tampilan seperti dibawah, kemudian pilih Widget HTML/JavaScript 11. Copy Kode Berikut dan letakan kedalam kolom Widget HTML/JavaScript
      <form action="tabview.html" method="get"> <div class="TabView" id="TabView"> <div class="Tabs" style="width: 350px;"> <a>Tab 1</a> <a>Tab 2</a> <a>Tab 3</a> </div> <div class="Pages" style="width: 350px; height: 250px;"> <div class="Page"> <div class="Pad"> Tab 1.1 <br /> Tab 1.2 <br /> Tab 1.3 <br /> </div> </div> <div class="Page"> <div class="Pad"> Tab 2.1 <br /> Tab 2.2 <br /> Tab 2.3 <br /> </div> </div> <div class="Page"> <div class="Pad"> Tab 3.1 <br /> Tab 3.2 <br /> Tab 3.3 <br /> </div> </div> </div> </div> </form> <script type="text/javascript"> tabview_initialize('TabView'); </script>
      Keterangan :
      1. Code yang berwarna biru diatas adalah lebar dan tinggi tabview yang bisa kamu sesuaikan.
      2. Code yang berwarna Merah adalah text judul dari menu tabel (tab 1, tab 2, tab 3 ....)
Contoh punya saya: Tab 1 ganti dg BLOG
Tab 2 ganti dg Facebook
Tab 3 ganti dg Tips Trik
                        3. Code yang berwarna Pink diatas adalah halaman dari tabel yang bisa  kamu pasangi code-code gagdet, gambar atau link.
          12.  Klik Simpan
          13. Selesai dan Lihat hasilnya

Sangat mudah bukan? Sekian tutorial saya mengenai  Cara Membuat Menu Tab View Di Blog, Untuk Anda yang sedang mencari gadget apa yang paling bagus? saran kami adalah Acer Iconia PC Tablet Dengan Windows 8, setelah memiliki gadget ini pasti ingin memasukkan software dan game kan? saran kami adalah download di JalanTikus.com: Download Gratis, Aman dan Cepat. Dan untuk menyenangkan si buah hati, kunjungi Keretamini.com Pabrik Kereta Mini No 1 Ready Stock terima kasih.
See You Next Post

Artikel Menarik Lainnya

23 comments :

Inasub | Free Download Anime Subtitle Indonesia said...

Wah, keren banget artikelnya..

Anonymous said...

Iya, makasih sudah berkiunjung,
BTW udah dipraktekin pa belom,?

Dhiyas kn said...

Wah suka utak atik blog ya cocok ni.

Unknown said...

kode ]]> gak ada koq,,? denger2 sih tampilan baru memang tdak ada lagii,, tross cara laen gimana..?

psdink said...

ko agan ga pk, ane jajal nyoba gan
nice share

Unknown said...

http://iqbalalisofyan.blogspot.com

psdink said...

thx gan infonya

Racun Utk Pacar said...

Blogwalking

muhammad farhan said...

Terimakasih, kebetulan saya lagi ingin memasang tab view di blog saya, lumayan lah buat hemat space blog, hehe:)

Unknown said...

oke

Dwiky said...

Thanks Gan

Jaya said...

Thanks hadir Sob ,,

Unknown said...

tolongin dong pasangin tab nya susah nih...

gagal mulu :'(

Unknown said...

gak bisa nih!

Unknown said...

kok gk dijawab

Unknown said...

kok gk dijawab

Ic Creem said...

mantap gan ... ane coba deh .. visit back

gedde said...

cara biar tiap iklan tampil otomatis dengan naruh di template blog gmana cra nya ? balas di blog q ya iklan chitikanya

Unknown said...

Tankz ... Sy akan cobah... Slam bloggin....

CUB said...

Turotialnya mudah di pahami, sayang ngga ad contohnya,..
Tapi tetep nice shared Om,

said blog said...

visit :)

Tutorial Komputer dan Jaringan said...

thanks gan. . .

Sitekno said...

Ninggalin jejak dulu, bagus nihhh,,,,,

Post a Comment

Tinggalkan jejak Anda dikomentar ini.
Kami membutuhkan kritik dan saran Anda untuk kemajuan Blog ini.
Terima kasih sudah berminat untuk meluangkan waktu berkomentar disini, semua kritik dan saran Anda akan saya dengarkan untuk memajukan Blog ini.
Gunakan name/url untuk berkomentar.
Anonymous = Spam

.
.
.
.
.

---->>Alexa<-----

---->Histats<----

Link Sobat