dZONA TAHTA Entertaint: Tips Blogging

Showing posts with label Tips Blogging. Show all posts

Red Horizontals Menu

Langkah-langkah membuat Red Horizontals Menu :

>> >>
Klik kotak kecil di samping tulisan .
Kemudian cari kode ]]></b:skin>
( Untuk memudahkan pencarian, gunakan tombol ctrl+f pada keyboard lalu ketik ]]></b:skin> pada kolom kosong yang muncul)
Jika sudah menemukan kode tersebut, copy kode di bawah ini, dan paste atau letakkan di atas ]]></b:skin> :

ul.menu {list-style-type:none;width:auto;position:relative;display:block;height:33px;font-size:.6em;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSeVmzAZhWJOR-5KkPAiBAoVbK0VFQ4DLp_Hhy0XqotQL7lF9BgTjBmkIxhwUwq8fjUHOuHdIqH9yvBXEbKyrcZOf2-4yFR0lmonEWZhDJFzuAb6WXQ8aGMdVG3ID93qhhgL7XagRhesc/s1600/bg.png") repeat-x top left;font-family:Verdana,Helvetica,Arial,sans-serif;border:1px solid #000;margin:0;padding:0;}
ul.menu li {display:block;float:left;margin:0;padding:0;}
ul.menu li a {float:left;color:#A79787;text-decoration:none;height:24px;padding:9px 15px 0;font-weight:normal;}
ul.menu li a:hover,.current {color:#fff;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSeVmzAZhWJOR-5KkPAiBAoVbK0VFQ4DLp_Hhy0XqotQL7lF9BgTjBmkIxhwUwq8fjUHOuHdIqH9yvBXEbKyrcZOf2-4yFR0lmonEWZhDJFzuAb6WXQ8aGMdVG3ID93qhhgL7XagRhesc/s1600/bg.png") repeat-x top left;text-decoration:none;}
ul.menu .current a {color:#fff;font-weight:700;}
/*Garis Merah*/
ul.menu.red{background-color:#B11718;} ul.menu.red li a:hover, .menu.red li.current {background-color:#DE3330;}

Selanjutnya klik untuk menuju ke halaman "Rancangan/Layout”

Klik
Setelah muncul jendela baru, cari
Klik tanda tambah (+) pada pilihan .
Copy kode di bawah ini dan paste ke kolom konten :

<ul class="menu red">
<li><a class="current"><a href="http://omvan.blogspot.com">Home</a></li>
<li><a href="http://omvan.blogspot.com/2011/05/daftar-isi.html">Daftar Isi</a></li>
<li><a href="http://omvan.blogspot.com/search/label/Randoms%20Tips">Random Tips</a></li>
<li><a href="http://omvan.blogspot.com/search/label/Cerita%20Lucu">Cerita Lucu</a></li>
<li><a href="http://omvan.blogspot.com/2011/05/tuker-link-yuk.html">Tukar Link</a></li>

<li><a href="http://omvan.blogspot.com/search/label/TV%20Online">TV Online</a></li>

<li><a href="http://omvan.blogspot.com/2011/09/sms-gratis.html">SMS Gratis</a></li>
</ul>

Ket.:
Merah = ganti dengan alamat yang ingin dipasang
Hijau = ganti dengan judul menu
Jika ingin menambah tab menu, copy code di bawah ini dan letakkan sebelum </ul>
Seperti ini :

<li><a href="#">Judul menu</a></li>

</ul>

Selesai

Black Horizontal Menu

Langkah-langkah membuat Black Horizontals Menu :

>> >>
Klik kotak kecil di samping tulisan .
Kemudian cari kode ]]></b:skin> (Untuk memudahkan pencarian, gunakan tombol ctrl+f pada keyboard lalu ketik ]]></b:skin> pada kolom kosong yang muncul)
Jika sudah menemukan kode tersebut, copy kode di bawah ini, dan paste atau letakkan di atas ]]></b:skin> :

ul#menu {width: 100%;height: 43px;background: #FFF url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKA7ba8yLtiBHKk-xVxGli6Jwd5joDPcyjdrj-cCEnm1wTZbsq4q9T2PubAdONEZ5dlTy5zu9HLbFSBmM7HMJhFYpDDwjVu6hCddKEwynvHDvUAU0j0YuXYZiRfAaiV_5fa2qqLlQPzM8/s1600/menu-bg.gif") top left repeat-x;font-size: 0.8em;font-family: "Lucida Grande", Verdana, sans-serif;font-weight: bold;list-style-type: none;margin: 0;padding: 0;}
ul#menu li {display: block;float: left;margin: 0 0 0 5px;}
ul#menu li a {height: 43px;color: #777;text-decoration: none;display: block;float: left;line-height: 200%;padding: 8px 15px 0;}ul#menu li a:hover {color: #333;} ul#menu li a.current {color: #FFF;background: #FFF url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuc72E-F5DQQuGJAk4ZkRr1xNy6xswGQtaCWQs4iNv2STzhUlOTL07oCO-YMNJUgN43ys97OYJlRgKAT4THXH4HX2jt8ZY6NLY9iCWKgNslcUtlDgRD_hv-Ni7kh3Yk3B_ILvHyP_w1lA/s1600/current-bg.gif") top left repeat-x;padding: 5px 15px 0;}

Selanjutnya klik untuk menuju ke halaman "Rancangan/Layout”

Klik
Setelah muncul jendela baru, cari
Klik tanda tambah (+) pada pilihan .
Copy kode di bawah ini dan paste ke kolom konten :

<ul id="menu">
<li><a class="current"><a href="http://omvan.blogspot.com">Home</a></li>
<li><a href="http://omvan.blogspot.com/2011/05/daftar-isi.html">Daftar Isi</a></li>
<li><a href="http://omvan.blogspot.com/search/label/Randoms%20Tips">Random Tips</a></li>
<li><a href="http://omvan.blogspot.com/search/label/Cerita%20Lucu">Cerita Lucu</a></li>
<li><a href="http://omvan.blogspot.com/2011/05/tuker-link-yuk.html">Tukar Link</a></li>

<li><a href="http://omvan.blogspot.com/search/label/TV%20Online">TV Online</a></li>

<li><a href="http://omvan.blogspot.com/2011/09/sms-gratis.html">SMS Gratis</a></li>
</ul>

Ket.:
Merah = ganti dengan alamat yang ingin dipasang
Hijau = ganti dengan judul menu
Jika ingin menambah tab menu, copy code di bawah ini dan letakkan sebelum </ul>
Seperti ini :

<li><a href="#">Judul menu</a></li>

</ul>

Selesai

Menu Horizontal Sederhana

Langkah - langkah membuat Menu Horizontal Sederhana :

>> >>
Klik kotak kecil di samping tulisan .
Kemudian cari kode ]]></b:skin> (Untuk memudahkan pencarian, gunakan tombol ctrl+f pada keyboard lalu ketik ]]></b:skin> pada kolom kosong yang muncul)
Jika sudah menemukan kode tersebut, copy kode di bawah ini, dan paste atau letakkan di atas ]]></b:skin> :

/* Horizontal Starts */
a.burastabs, a.burastabs:link, a.burastabs:visited {display:block; width:102px; height:30px; background:#444444; border:1px solid #ebebeb; margin-top:2px; text-align:center; text-decoration:none; font-family:arial, sans-serif; font-size:12px; font-weight:bold color:#FFFFFF; line-height:25px; overflow:hidden; float:left;}
a.burastabs:hover {color:white; background:#666666;}
#burasbar {width:auto; margin:0 auto;}
/* Horizontal Ends */

Selanjutnya klik untuk menuju ke halaman "Rancangan/Layout”
Klik
Setelah muncul jendela baru, cari
Klik tanda tambah (+) pada pilihan .
Copy kode di bawah ini dan paste ke kolom konten :

<div id='burasbar'>
<a href="http://omvan.blogspot.com" class="burastabs">Home</a>
<a href="http://omvan.blogspot.com/2011/05/daftar-isi.html" class="burastabs">Daftar Isi</a>
<a href="http://omvan.blogspot.com/search/label/Randoms%20Tips" class="burastabs">Random Tips</a>
<a href="http://omvan.blogspot.com/search/label/Cerita%20Lucu" class="burastabs">Cerita Lucu</a>
<a href="http://omvan.blogspot.com/2011/05/tuker-link-yuk.html" class="burastabs">Tukar Link</a>
<a href="http://omvan.blogspot.com/search/label/TV%20Online" class="burastabs">TV Online</a>
<a href="http://omvan.blogspot.com/2011/09/sms-gratis.html" class="burastabs">SMS Gratis</a>
</div>

Ket.:
Merah = ganti dengan alamat yang ingin dipasang
Hijau = ganti dengan judul menu
Jika ingin menambah tab menu, copy code di bawah ini dan letakkan sebelum </div>
Seperti ini :

<a href="#" class="burastabs">Judul menu</a>
</div>

Selesai

Tips Membuat Tabview Menu Horizontal di Blogspot

Untuk memudahkan pengunjung menelusuri isi dari suatu web atau blog, ada baiknya kalau blog dipasang tab menu, baik itu menu vertikal maupun yang horizontal.

Tapi sayangnya,template bawaan (default) blogspot tidak memiliki fasilitas tab view menu tersebut. Tapi jangan kuatir, kita bisa membuatnya dengan cara lain.

Kali ini saya ingin berbagi tips membuat tabview menu horizontal di blogspot.

Buat yang ingin memasang tab menu horizontal,silahkan pilih model yang diinginkan dan ikuti langkah pembuatannya :

1. Menu Horizontal Sederhana :

Cara membuatnya..

2. Black Horizontals Menu

Cara membuatnya..

3. Red Horizontals Menu

Cara membuatnya..

Semoga bermanfaat!

Tips Membuat Kotak Komentar Menarik Pada Blogspot | VANBLOGGER

Ide ini muncul setelah beberapa hari yang lalu form kotak komentar default blogspot saya error. Ini terjadi karena saya mengganti template blog saya. Berulangkali saya coba perbaiki tapi tidak membuahkan hasil, akhirnya saya putuskan untuk membuat form kotak komentar yang baru dengan tool menarik yang disediakan oleh pihak ketiga yaitu intensedebate. dan DISQUS Alhasil jadilah kotak komentar saya seperti yang sobat lihat di bawah ini.

Kalau sobat memiliki masalah dengan form kotak komentar dan ingin menggantinya dengan kotak komentar dari intensedebate, sobat dapat mengikuti langkah-langkah berikut :

Langkah Pertama

Sebelum menuju pada langkah pembuatan kotak komentar baru, sebaiknya pengaturan komentar default dirubah dahulu.

Log in blogger
Pada Dasbor pilih Setelan

Pada halaman setelan pilih tab Komentar

Pada pilihan Default Komentar untuk Entri pilih Entri Baru Tidak Memiliki Komentar

Selanjutnya klik “Simpan Setelan”

Langkah Kedua

Mendaftar ke http://intensedebate.com, atau langsung klik di sini.
Sobat akan dibawa ke halaman berikut :

Isi dengan lengkap Username,Email dan Password pada form pendaftaran
Centang pada pilihan “I want to install IntenseDebate on my blog or website”
Klik Sign up
Selanjutnya buka email Sobat untuk melanjutkan proses verifikasi.

Jika proses sign up sudah selesai,selanjutnya menuju pada Langkah Ketiga atau Langkah terakhir

Langkah Ketiga

Kemudian Sobat akan menuju ke halaman berikut :

Klik tab menu “Sites” dan pilih “+Add blog/site”
Selanjutnya masukkan alamat lengkap blog Sobat, kemudian klik “Next Step”

Kemudian Sobat akan dibawa ke halaman berikut :

pada pilihan nomor 1, centang “Widget”
pada pilihan nomor 2 :

centang “Only on new posts” jika Sobat menginginkan kotak komentar hanya akan ditampilkan pada postingan baru (yang akan datang).
centang “On all blog posts” jika Sobat ingin kotak komentar tampil pada semua postingan blog Sobat.

Kemudian geser scroll ke bawah dan pada poin "4.Click below to continue the installation" klik “Add widget to my blog” (lihat gambar berikut)

Selanjutnya akan muncul jendela baru (pop up).

Jika Sobat memiliki lebih dari satu blog, tentukan dulu blog Sobat pada “Pilih sebuah blog”
Lalu klik “MENAMBAH WIDGET”

Geser widget "Intense Debate Comments" dan letakkan tepat di bawah posting blog

Simpan dan lihat hasilnya.

Selesai

Jika Sobat mengalami masalah, silahkan tinggalkan komentar. Semoga bermanfaat!

TIPS MEMASANG ALEXA TOOLBAR DI BROWSER

Kunjungi situs Alexa untuk instal atau downloadnya di sini.
Ada dua pilihan yang tersedia yaitu Toolbar Dan Statusbar . Klik tombol “ Instal Alexa Toolbar “ , untuk diinstall sebagai browser toolbar atau klik tombol “ Install as Statusbar “ untuk diinstall sebagai statusbar.
Sekarang baru tersedia Toolbar untuk Firefox dan Internet Explorer saja.

Toolbar Alexa

Statusbar Alexa

Setelah terinstal, restart browser sobat. Maka toolbar Alexa akan muncul pada browser yang sobat gunakan.

Selesai. Semoga bermanfaat.

TIPS MENINGKATKAN ALEXA RANK

Setelah kita mengetahui apa itu Alexa Rank dan kegunaannya, serta sudah memasang widgetnya di blog, tentunya kita ingin meningkatkan peringkat Alexa pada blog. Ini ada beberapa tips cara meningkatkan Alexa Rank yang saya dapat dari berbagai sumber.

1. Blogwalking

Ini adalah cara manual yang paling mudah dilakukan,yaitu berkunjung ke blog-blog lain,tukaran link/banner, berkomentar (apalagi jika komentar di blog yang berstatus do follow), Submit Blog ke Search Engine, dll..

2. Pasang Alexa Toolbar

Menginstal Toolbar Alexa pada browser katanya akan bisa meningkatkan ranking blog/website kita, karena akan terjadi penambahan ranking point dari tante Alexa . Caranya bisa lihat di sini.

3. Bookmark Blog Sebagai Homepage Browser

Setelah menginstal Alexa Toolbar, selanjutnya adalah mem-bookmark blog anda sebagai homepage di komputer yang sering digunakan untuk browsing (baik itu dirumah, dikantor, diwarnet atau dimana saja), makin banyak makin bagus. Logikanya kalau ada 20 komputer homepage nya blog anda maka setiap orang yang membuka browser tersebut maka yng pertama tampil adalah blog anda dan ini akan menjadi traffic tersendiri.

4. Pasang Widget Alexa Rank

Memasang Widget Alexa Rank juga salah satu cara yang bisa meningkatkan peringkat Alexa. Cara memasangnya bisa dilihatr di sini.

5. Tulis artikel Tentang Alexa

Tulis artikel tentang Alexa misalnya seperti yang sedang sobat baca ini dan ajak para pembaca untuk men-download Alexa Toolbar.

6. Label atau Kategori Alexa Pada Artikel.

Saat membuat artikel tentang Situs Alexa, selalu gunakan label atau kategori dengan keyword : alexa, alexa rank, alexa traffic rank, rangking alexa, dan lain sebagainya. Intinya ada kata 'Alexa' , ini akan membuat senang tante Alexa.

7. Update Blog atau Web

Jangan lupa untuk selalu update blog sobat. Akan lebih baik jika berkala atau secara teratur misalnya 3 hari sekali minimal 1 artikel .

8. Berdoa.

Tetap semangat dan selalu berdoa, semoga tante Alexa rajin nyenggol-nyenggol kita. Hehe. Mungkin teman bisa menambahkan? Silahkan tulis atau tinggalkan pesan pada kolom komentar di bawah ini.

Semoga bermanfaat.

APA ITU ALEXA RANK DAN APA KEGUNAANNYA

Sebagai blogger pemula atau yang sering disebut dengan istilah “newbie”, pasti bingung dengan hal yang bernama “Alexa”. Begitu juga saya, yang awalnya gak ngerti apa itu Alexa Rank dan apa gunanya buat website atau blog.

Setelah browsing sana-sini, Tanya-tanya sama mbah Gugel, akhirnya saya mulai ngerti kalau ternyata Alexa Rank sangat bermanfaat untuk perkembangan suatu blog atau website.

Alexa Rank atau Rangking Alexa adalah peringkat yang diberikan terhadap suatu website/blog berdasarkan trafik atau banyaknya pengunjung. Karena data trafik atau pengunjung yang diperoleh Alexa diambil dari Toolbar Alexa yang dipasang di setiap browser pengguna internet. Tapi selain trafik, ada juga beberapa faktor lain yang berpengaruh dalam meningkatkan ranking Alexa.

Berbeda dengan PageRank, Alexa Rank atau Rangking Alexa setiap website/blog berbeda-beda. Ranking alexa suatu website/blog bisa sampai puluhan juta. Semakin sedikit angka yang terdapat pada Alexa Rank, berarti peringkat peringkat Alexanya semakin tinggi. Ini tentunya kebalikan dari Page Rank yang semakin tinggi peringkatnya,akan semakin tinggi pula nilai Page Rank nya.

Alexa Rank bisa membangun pamor dan menunjukkan kepopuleran website / blog. Selain itu, jika website/blog yang memiliki peringkat Alexa yang sangat tinggi, maka pemiliknya sudah bisa disebut sebagai seorang webmaster.

Lantas apa gunanya memiliki Alexa Rank yang tinggi?

Sebagai blogger, baik itu yang sudah senior apalagi yang masih pemula, pasti menginginkan perkembangan yang lebih baik terhadap blog yang dikelolanya. Apalagi sampai bisa menghasilkan uang dari nge-blog, ini tentunya jadi impian para blogger mania dimanapun (seperti saya..hehe)

Nah untuk menuju kea rah itu, Alexa Rank sangat bermanfaat karena :

Banyak yang ingin memasang iklan berbayar.
Memenuhi syarat pada situs-situs tertentu, seperti paid review.
Mendapatkan penghasilan yang lebih dari adsense, seperti pada ppcindo.
Membangun kredibilitas terhadap website Anda.
Website Anda akan lebih dipandang dan tampak lebih profesional.

Oleh sebab itu, kita tentunya perlu meningkat peringkat Alexa pada website/ blog kita. Dan perlu kita tau Alexa Rank tidak hanya berdasarkan trafik atau jumlah pengunjung saja, tapi ada beberapa factor lain yang dapat mempengaruhi meningkatnya peringkat Alexa. Beberapa faktor yang bisa meningkatkan peringkat alexa dapat sobat baca di sini.

Mungkin ada teman-teman yang bisa membagi ilmunya, bagaimana cara meningkatkan Alexa Rank? Tulis atau tinggalkan pesan di kolom komentar.

Buat yang belum dan ingin memasang Widget Alexa Rank, bisa ikuti caranya di sini.

Semoga bermanfaat.

TIPS MEMASANG WIDGET ALEXA RANK

Sebelum memasang Widget Alexa Rank, sebaiknya pelajari dulu apa itu Alexa Rank dan manfaatnya di sini.

Untuk mengetahui rank blog kita tersebut tentunya kita harus memasang widget Alexa Rank, caranya sebagai berikut :

Masuk ke www.alexa.com atau langsung klik di sini.

Pada Widgets klik Get Traffic Widgets

Scroll pada bagian bawah maka akan terlihat seperti gambar ini :

Lalu isikan url blog pada kolom kosong di samping tulisan BUILD WIDGET.
Isi url blog tanpa http://. Misalkan url blog adalah http://blogsaya.blogspot.com, maka cukup masukkan blogsaya.blogspot.com saja.
Jika sudah diisi klik "Build Widget". Maka akan muncul 3 buah kotak kode, dengan 3 buah pilihan model widget.
Pilih salah satu dan copy kodenya. Paste atau simpan sementara kode tersebut di notepad atau atau dimana saja. Karena kode ini yang akan digunakan pada pemasangan widget di blog.

Selanjutnya Login ke Blogger.

Pada dasbor pilih

Klik

Pilih

Pastekan kode yang di simpan tadi pada konten.

Selesai. Semoga bermanfaat.

TIPS MERUBAH WARNA BACKGROUND HANYA DENGAN SEKALI KLIK

Dengan menu yang berbentuk button seperti ini, aku mudah merubah warna backround template hanya dengan sekali klik, tanpa perlu mengedit template, dan gak membuat blog menjadi berat. Menurutku ini sangat menarik, walaupun perubahan warna backround bersifat sementara, tapi dengan tampilan warna-warna yang bisa dirubah sesuai keinginan sendiri hanya dengan sekali pencet, membuat aku gak jenuh dengan warna yang itu-itu saja.

Kalau sobat merasa tertarik untuk mencobanya, sobat bisa lakukan cara sebagai berikut :

Silahkan

Pada dasbor pilih

Klik

Pilih

Copy dan masukkan code html berikut :

function bgChange(bg)

{document.body.style.background=bg;}

</script>

Ket.:

Sobat bisa memperbanyak sendiri button warna dengan menambahkan code :

Kalau sudah selesai, silahkan disimpan.

Coba sobat cek dengan menekan button warna yang sudah sobat buat. Menarik bukan...?

TIPS MEMBUAT MENU MULTI KOLOM

Untuk menghemat halaman blog yang tentunya semakin lama semakin penuh dengan tampilan widget atau gambar-gambar yang terpasang, pemasangan menu multi kolom tentunya sangat diperlukan. Selain tampilannya juga menarik, dengan menu ini kita tentu bisa mengatur halaman blog dengan rapi.

Okey kalau minat, langsung tarik aja maz..

Silahkan

Pada dasbor pilih

pilih

Centang kotak kecil disamping

Sebaiknya backup dulu template sobat dengan meng-klik

Selanjutnya cari code : ]]></b:skin> Gunakan tombol ctrl+F untuk mempermudah pencarian.

Kalau sudah ketemu, copy code di bawah ini dan letakkan di atas ]]></b:skin>

div.TabView div.Tabs

{

height: 40px;

overflow: hidden;

}

div.TabView div.Tabs a

{

float: left;

display: block;

width: 75px;

text-align: center;

height: 40px;

padding-top: 3px;

-moz-border-radius: 10px;

box-shadow:0 0 10px #111;

-moz-box-shadow:0 0 10px #111;

-webkit-box-shadow:0 0 10px #111;

margin-left:4px;

vertical-align: middle;

border: 2px solid #A50F07;

text-decoration: none;

font-family: "Arial", Times New Roman, Serif;

font-weight: 900;

color: #000080;

}

div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active

{

background-color: #A50F07;

}

div.TabView div.Pages

{

clear: both;

background-color: #FFFFFF;

-moz-border-radius: 10px;

box-shadow:0 0 10px #111;

-moz-box-shadow:0 0 10px #111;

-webkit-box-shadow:0 0 10px #111;

border: 3px solid # A50F07;

text-align:left;

overflow: hidden;

}

div.TabView div.Pages div.Page

{

height: 100%;

padding: 0px;

overflow: hidden;

}

div.TabView div.Pages div.Page div.Pad

{

padding: 3px 5px;

}

Ket.: Code berwarna merah dan orange dapat dirubah sesuai dengan tampilan blog

Selanjutnya cari code </head>,

lalu copy dan letakan code berikut tepat di atas </head>

function tabview_aux(TabViewId, id)

{

var TabView = document.getElementById(TabViewId);

// ----- Tabs -----

var Tabs = TabView.firstChild;

while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;

var Tab = Tabs.firstChild;

var i = 0;

{

if (Tab.tagName == "A")

{

i++;

Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";

Tab.className = (i == id) ? "Active" : "";

Tab.blur();

}

while (Tab = Tab.nextSibling);

// ----- Pages -----

var Pages = TabView.firstChild;

while (Pages.className != 'Pages') Pages = Pages.nextSibling;

var Page = Pages.firstChild;

var i = 0;

{

if (Page.className == 'Page')

{

i++;

if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";

Page.style.overflow = "auto";

Page.style.display = (i == id) ? 'block' : 'none';

}

while (Page = Page.nextSibling);

}

// ----- Functions -------------------------------------------------------------

function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }

function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }

</script>

Selanjutnya menuju ke

Klik

Pilih

Lalu copy dan masukkan code berikut :

<form action="tabview.html" method="get">

<div class="TabView" id="TabView">

<div class="Tabs" style="width: 380px;">

<a>Judul Menu 1</a>

<a> Judul Menu 2</a>

<a> Judul Menu 3</a>

</div>

<div class="Pages" style="width: 380px; height: 300px;">

<div class="Page">

<div class="Pad">

ISI MENU 1

</div>

<div class="Page">

<div class="Pad">

ISI MENU 2

</div>

<div class="Page">

<div class="Pad">

ISI MENU 3

</div>

</div></form>

<script type="text/javascript">

tabview_initialize('TabView');

</script>

Ket.:

Code Warna Biru = Isi Dengan Judul Menu

Code Warna Merah = Isi Menu

Code Warna Orange = Sesuaikan dengan ukuran sidebar sobat.

Kalau sudah selesai,jangan lupa disimpan. Semoga bermanfaat..

TIPS MEMBUAT GARIS TEPI PADA GAMBAR POSTING

Terkadang gambar yang kita upload dari url tidak bergaris tepi, sehingga kalau kita sisipkan pada postingan bisa membuat tampilannya terlihat kurang menarik. Untuk membuat garis tepi pada gambar tersebut, kita gak perlu repot mengeditnya. Sobat hanya perlu menambahkan sedikit kode pada url gambar yang di upload.

Gambar sebelum bergaris tepi :

tambahkan kode di bawah ini pada url gambar yang di upload. untuk lebih jelasnya perhatikan kode di bawah ini.

hasilnya:

Keterangan :

Warna merah : ganti kode warna merah dengan ukuran tinggi dan lebar gambar.

Warna hijau : ganti dengan url gambar sobat

Selesai. Silahkan mencoba.. semoga bermanfaat.

TIPS MEMBUAT LABEL BERWARNA DAN BERGERAK

Buat sobat yang ingin membuat tampilan blog lebih menarik, gak ada salahnya sobat coba TIPS MEMBUAT LABEL BERWARNA DAN BERGERAK berikut ini..:

Pada dasbor pilih

Klik

Pilih

Masukkan kode berikut :

<a href="URL BLOG ANDA" style="font-size:30px;text-decoration:none; border-bottom: 1px dotted; color: #FF0099;">JUDUL LABEL</a> </marquee>

<a href="URL BLOG ANDA" style="font-size:22px;text-decoration:none; border-bottom: 1px dotted; color: #66CC00;">JUDUL LABEL</a>

</marquee>

<a href="URL BLOG ANDA" style="font-size:29px;text-decoration:none; border-bottom: 1px dotted; color: #FF9900;">JUDUL LABEL</a>

</marquee>

<a href="URL BLOG ANDA" style="font-size:23px;text-decoration:none; border-bottom: 1px dotted; color: #33CCFF;">JUDUL LABEL</a>

</marquee>

<a href="URL BLOG ANDA" style="font-size:21px;text-decoration:none; border-bottom: 1px dotted; color: #6633CC;">JUDUL LABEL</a>

</marquee>

<a href="URL BLOG ANDA" style="font-size:27px;text-decoration:none; border-bottom: 1px dotted; color: #CCCC00;">JUDUL LABEL</a>

</marquee>

<a href="URL BLOG ANDA" style="font-size:27px;text-decoration:none; border-bottom: 1px dotted; color: #DE2159;"> JUDUL LABEL </a>

</marquee>

</div>

Ket.:

Kode berwarna Orange : Ganti ukuran sesuai dengan template kamu

Kode berwarna Merah : Ganti dengan alamat URL blog kamu.

Kode berwarna Hijau : Ganti dengan Judul Label Kamu

Contoh :

<a href=" http://omvan.blogspot.com/search/label/Cerita%20Lucu" style="font-size:23px;text-decoration:none; border-bottom: 1px dotted; color: #CC6600;">Cerita Lucu</a>

Jika ingin menambahkan label baru, masukkan code :

<a href="URL BLOG ANDA" style="font-size:23px;text-decoration:none; border-bottom: 1px dotted; color: #CC6600;">JUDUL LABEL</a>

</marquee>

sebelum kode :

</div>

Selesai. Cek tampilan baru blog sobat..!

dZONA TAHTA Entertaint

Red Horizontals Menu

Black Horizontal Menu

Menu Horizontal Sederhana

Tips Membuat Tabview Menu Horizontal di Blogspot

Tips Membuat Kotak Komentar Menarik Pada Blogspot | VANBLOGGER

TIPS MEMASANG ALEXA TOOLBAR DI BROWSER

TIPS MENINGKATKAN ALEXA RANK

APA ITU ALEXA RANK DAN APA KEGUNAANNYA

TIPS MEMASANG WIDGET ALEXA RANK

TIPS MERUBAH WARNA BACKGROUND HANYA DENGAN SEKALI KLIK

TIPS MEMBUAT MENU MULTI KOLOM

TIPS MEMBUAT GARIS TEPI PADA GAMBAR POSTING

TIPS MEMBUAT LABEL BERWARNA DAN BERGERAK

Blog Archive

Labels