Memang Facebook belum menyediakan icon smile untuk chating seperti yang biasa kita temui pada yahoo mesanger.
Terkadang hal ini bisa membuat sebagian orang males untuk chat menggunakan facebook.Namun sebenarnya kita bisa menggunakan smile smile pada saat chatting di faceBook dengan mengetik sbeberapa simbol di kolom chat faceBook...
Nah pada kesempatan kali ini slametfun mencoba berbagi sedikit ilmu yang di dapat dari Mbah google untuk sobat sekalian dan semoga bermanfua'at,amien...
ini dia beberapa simbol_nya untuk smile chating facebook_nya,MonggO...
1 :O
2 8|
3 >:(
4 :\
5 3:)
6 O:)
7 :-*
8 <3
9 :v
10 :3
11 ]
12 :putnam:
tinggal ketik simbol tersebut lalu tekan enter,klo masih kesulitan saya siap membantu...
Terimakasih... alis suksme atau matur nuwon atau keso'On gi... hehe...
Sabtu, 16 Oktober 2010
Jumat, 27 Agustus 2010
Merubah tampilan layout facebook
Kamu bosan dengan tampilan FaceBook yang gt2 aza...
pengen yang keren...
gaul..
dan bikin lo tambah betah OL seharian..
monggo di laksanaken di bawah ini...
-kunjungi website Yontoo
-pilih "Start Installation"
-install Add-ons dan restart mozila
-pasang aplikasi PageRage di facebook
-pilih tampilan yang diinginkan
-lihat profile anda
klo lom bisa silahken kirim pesan anda ke FB saya,saya bisa pasti saya bantu...
matur sembah nuwonnn
selamat mencoba....
smoga dalam keadaan damai semuanya...
pengen yang keren...
gaul..
dan bikin lo tambah betah OL seharian..
monggo di laksanaken di bawah ini...
-kunjungi website Yontoo
-pilih "Start Installation"
-install Add-ons dan restart mozila
-pasang aplikasi PageRage di facebook
-pilih tampilan yang diinginkan
-lihat profile anda
klo lom bisa silahken kirim pesan anda ke FB saya,saya bisa pasti saya bantu...
matur sembah nuwonnn
selamat mencoba....
smoga dalam keadaan damai semuanya...
Kamis, 19 Agustus 2010
CARA MENAMBAHKAN READ MORE.../BACA SELENGKAPNYA
Sering kali kita melihat postingan baik dalam blog ataupun web hanya muncul sebagian kata kata saja namun apabila kita klik pada bagian read more atau baca selengkapnya maka muncul banyak postingan lebih lengkapnya.Hal ini penting digunakan agar tampilan blog lebih maksimal.
TDRVNR28RB2D
Sudahkah blog anda berisikan Read More,atau mungkin bagi anda yang sudah pernah membuat Read More tapi belum maksimal silahkan bisa ikuti cara di bawah ini:
1. Login ke Blogger. Klik menu Layout lalu klik Edit HTML. Back-up terlebih dahulu template Anda dengan cara klik pada Download Full Template untuk menyimpan file template di komputer Anda.
2. Beri tanda centang pada opsi "Expand Widget Templates" (tunggu beberapa saat hingga proses selesai).
3. Setelah itu, cari kode </head> pada template Anda. Supaya lebih mudah untuk mencarinya, tekan Ctrl+F lalu masukkan kode </head> trus klik Next.
4. Jika sudah ketemu, letakkan kode dibawah ini diatas kode </head>
Catatan:
Bagi para blogger yang sudah pernah memasang kode read more harus dihapus terlebih dahulu kode read more-nya sebelum memasang kode ini.
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
</script>
</b:if>
5. Selanjutnya cari kode
<div class='post-body'>
<p><data:post.body/></p>
atau
<div class='post-body entry-content'>
<p><data:post.body/></p>
6. Kalau sudah ketemu, hapus kode tersebut lalu ganti dengan kode yang dibawah ini:
<div class='post-body' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<a expr:href='data:post.url'>Read More...</a>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
Catatan:
Kata Read More yang dicetak tebal diatas bisa anda ganti dengan kata lain misalnya Baca Selengkapnya, Selanjutnya, Lanjut membaca, dan lain-lain.
7. Jika sudah selesai, klik tombol Save Template. Kalau muncul "Your changes have been saved" berarti proses pengeditannya berhasil.
8. Kemudian klik Settings, lalu klik Formatting. Cari "Post Template". Kalau sudah ketemu, isi kotak kosong tersebut dengan kode berikut:
<span id="fullpost">
</span>
9. Jika sudah, klik tombol Save Settings
Cara memposting supaya muncul Read More pada saat artikel ditampilkan:
Pada saat Anda mau memposting, anda akan tampak 2 baris kode pada bagian Edit HTML kotak posting seperti pada gambar dibawah ini.
Letakkan postingan yang mau ditampilkan diatas kode <span id="fullpost">
Dan sisanya (yang mau disembunyikan) diantara
<span id="fullpost">
Dan
</span>
Klik Publish Post, lalu klik (in a new window) untuk melihat hasilnya pada halaman baru Catatan: Artikel yang sudah diposting sebelum memasang kode Read More akan tetap tampil penuh dihalaman muka. Untuk mengeditnya, Anda bisa menggunakan cara berikut: 1. klik Edit Posts pada menu posting 2. Klik Edit pada artikel yang ingin dipasang Read More 3. Klik mode Edit HTML, lalu pindahkan kode <span id="fullpost"> dibawah postingan yang mau ditampilkan dan letakkan kode </span> diakhir artikel
4. Klik tombol Publish Post, lalu klik (in a new window) untuk melihat hasilnya berhasil atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan atau salah. Coba liat kembali langkah diatas. Selamat Mencoba. Semoga berhasil...!!
TDRVNR28RB2D
Sudahkah blog anda berisikan Read More,atau mungkin bagi anda yang sudah pernah membuat Read More tapi belum maksimal silahkan bisa ikuti cara di bawah ini:
1. Login ke Blogger. Klik menu Layout lalu klik Edit HTML. Back-up terlebih dahulu template Anda dengan cara klik pada Download Full Template untuk menyimpan file template di komputer Anda.
2. Beri tanda centang pada opsi "Expand Widget Templates" (tunggu beberapa saat hingga proses selesai).
3. Setelah itu, cari kode </head> pada template Anda. Supaya lebih mudah untuk mencarinya, tekan Ctrl+F lalu masukkan kode </head> trus klik Next.
4. Jika sudah ketemu, letakkan kode dibawah ini diatas kode </head>
Catatan:
Bagi para blogger yang sudah pernah memasang kode read more harus dihapus terlebih dahulu kode read more-nya sebelum memasang kode ini.
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
</script>
</b:if>
5. Selanjutnya cari kode
<div class='post-body'>
<p><data:post.body/></p>
atau
<div class='post-body entry-content'>
<p><data:post.body/></p>
6. Kalau sudah ketemu, hapus kode tersebut lalu ganti dengan kode yang dibawah ini:
<div class='post-body' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<a expr:href='data:post.url'>Read More...</a>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
Catatan:
Kata Read More yang dicetak tebal diatas bisa anda ganti dengan kata lain misalnya Baca Selengkapnya, Selanjutnya, Lanjut membaca, dan lain-lain.
7. Jika sudah selesai, klik tombol Save Template. Kalau muncul "Your changes have been saved" berarti proses pengeditannya berhasil.
8. Kemudian klik Settings, lalu klik Formatting. Cari "Post Template". Kalau sudah ketemu, isi kotak kosong tersebut dengan kode berikut:
<span id="fullpost">
</span>
9. Jika sudah, klik tombol Save Settings
Cara memposting supaya muncul Read More pada saat artikel ditampilkan:
Pada saat Anda mau memposting, anda akan tampak 2 baris kode pada bagian Edit HTML kotak posting seperti pada gambar dibawah ini.
Letakkan postingan yang mau ditampilkan diatas kode <span id="fullpost">
Dan sisanya (yang mau disembunyikan) diantara
<span id="fullpost">
Dan
</span>
Klik Publish Post, lalu klik (in a new window) untuk melihat hasilnya pada halaman baru Catatan: Artikel yang sudah diposting sebelum memasang kode Read More akan tetap tampil penuh dihalaman muka. Untuk mengeditnya, Anda bisa menggunakan cara berikut: 1. klik Edit Posts pada menu posting 2. Klik Edit pada artikel yang ingin dipasang Read More 3. Klik mode Edit HTML, lalu pindahkan kode <span id="fullpost"> dibawah postingan yang mau ditampilkan dan letakkan kode </span> diakhir artikel
4. Klik tombol Publish Post, lalu klik (in a new window) untuk melihat hasilnya berhasil atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan atau salah. Coba liat kembali langkah diatas. Selamat Mencoba. Semoga berhasil...!!
CARA MEMBUAT FARIASI TAMPILAN LINK
Coba arahkan Cursor anda pada kata => slametfun . Lo kog tulisannya jadi besar..
Ya…ini adalah variasi tampilan link yang bias digunakan pada semua link.
Apakah anda tertarik????
Okelah kalo begitu…
Pertama-tama masuklah dalam kostumasi dan klik "edit html".
Temukan kode seperti di bawah ini
body {
margin:0; line-height:1.1em;
color:$textcolor;
font:x-small "Trebuchet MS", Trebuchet, Verdana, Sans-Serif;
font-size/* */:/**/small;
font-size: /**/small;
float: left;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
padding-left:15px;
Di bagian "hover" (ketika dilewati kursor) saya tambahkan kode di bawah ini:
padding-left:15px;
font-weight:bold; font-size:200%;
Pada angka yang berwarna merah bisa anda ganti dengan ukuran sesuai keinginan anda.
Variasi juga bisa dilakukan pada bagian "link" dan "visited". Dalam kode di atas kedua unsur itu tidak saya ubah, baik "color" (warna font) maupun dekorasinya. Semua saya ikutkan pada pengaturan umum yang perubahannya bisa dilakukan di editing "tata letak, font dan warna"
Oke...selamat mencoba sobat...
sukses ya???
Ya…ini adalah variasi tampilan link yang bias digunakan pada semua link.
Apakah anda tertarik????
Okelah kalo begitu…
Pertama-tama masuklah dalam kostumasi dan klik "edit html".
Temukan kode seperti di bawah ini
body {
margin:0; line-height:1.1em;
color:$textcolor;
font:x-small "Trebuchet MS", Trebuchet, Verdana, Sans-Serif;
font-size/* */:/**/small;
font-size: /**/small;
float: left;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
padding-left:15px;
Di bagian "hover" (ketika dilewati kursor) saya tambahkan kode di bawah ini:
padding-left:15px;
font-weight:bold; font-size:200%;
Pada angka yang berwarna merah bisa anda ganti dengan ukuran sesuai keinginan anda.
Variasi juga bisa dilakukan pada bagian "link" dan "visited". Dalam kode di atas kedua unsur itu tidak saya ubah, baik "color" (warna font) maupun dekorasinya. Semua saya ikutkan pada pengaturan umum yang perubahannya bisa dilakukan di editing "tata letak, font dan warna"
Oke...selamat mencoba sobat...
sukses ya???
Membuat Template Pribadi untuk Blog
Mungkin sobat sobat sekalian sudah banyak melihat para blogger menggunakan template pribadi pada blog mereka.Tentunya hal tersebut semakin mencerminkan kepribadian blog kita.Apakah kamu juga pengen sob…
Gampang banget kog,sekali coba pasti bisa…
Dah,lansung aza..
*Pertama tama tentunya kamu harus menyiapkan gambar ato foto yang ntar mo di bikin template blog lo….
*Kedua kamu harus punya alamat URL nya tentunya dengan meng UPLOAD di site penyimpanan gambar,misalnya di disini
*Selanjutnya silahkan LOGIN ke blog kamu,kemudian tata letak dan tambah gadget dan pilih HTML/JavaScrip.
*kemudian copy paste kode ato HTML di bawah ini:
<style type="text/css">body {background-image: url(http://i940.photobucket.com/albums/ad244/slametfun/slametfun-art.gif); background-position: center; background-repeat: repeat-y; background-attachment: fixed; )</style><div id="tag" style="Z-INDEX: 50; LEFT: 0px; WIDTH: px; POSITION: absolute; TOP: 30px; HEIGHT: 20px; border:px solid black"></div>
Tulisan yang berwarna merah silahkan ganti dengan alamat gambar ato foto kamu sob..
*kemudian silahkan di simpan ya sob...
Dan liat tuh blog kamu dah keren..
Selamat mencoba ya???
Jangan lupa commentnya
Gampang banget kog,sekali coba pasti bisa…
Dah,lansung aza..
*Pertama tama tentunya kamu harus menyiapkan gambar ato foto yang ntar mo di bikin template blog lo….
*Kedua kamu harus punya alamat URL nya tentunya dengan meng UPLOAD di site penyimpanan gambar,misalnya di disini
*Selanjutnya silahkan LOGIN ke blog kamu,kemudian tata letak dan tambah gadget dan pilih HTML/JavaScrip.
*kemudian copy paste kode ato HTML di bawah ini:
<style type="text/css">body {background-image: url(http://i940.photobucket.com/albums/ad244/slametfun/slametfun-art.gif); background-position: center; background-repeat: repeat-y; background-attachment: fixed; )</style><div id="tag" style="Z-INDEX: 50; LEFT: 0px; WIDTH: px; POSITION: absolute; TOP: 30px; HEIGHT: 20px; border:px solid black"></div>
Tulisan yang berwarna merah silahkan ganti dengan alamat gambar ato foto kamu sob..
*kemudian silahkan di simpan ya sob...
Dan liat tuh blog kamu dah keren..
Selamat mencoba ya???
Jangan lupa commentnya
Mengubah Logo Blogger Pada Blog
Pastinya Sobat sobat sekalian sudah melihat logo blog saya yang tidak lagi menggunakakn huruf B.
Tentunya Ini bisa membuat blog sobat sobat sekalian semakin keren dan pribadi.
Tapi Bagai manakah caranya,Bukankah blogger tidak memberikan layanan tersebut.
Baiklah Pada kesempatan kali ini saya ingin berbagi sedikit ilmu saya yang saya pwerolah dari mengotak atik mbah blogger.
*Pertama-tama tentunya sobat harus mempersiapkan gambar yang akan di jadikan logo blog.
*Kemudian Tentunya apabila ingin mendapatkan alamat URLnya harus di UpLoad pada site penyimpanan Gambar Seperti Yang sayagunakan Yaitu di photobucket .
Setelah Sobat endapatkan alamat URL gambarnya maka selanjutnya harus Login pada akun blogger sobat sekalian,Kemudian pilih tata letak ----> Edit HTML Lalu Cari Kode Seperti ini :
<b:skin><![CDATA[
Apabila Kesulitan silahkan sobat sekalian tekan ctrl dan F pada keyboard komputer secara bersamaan,kemudian akan keluar kotak search di bawah lalu masukan kode tersebut dan enter.
*Langkah berikutnya sobat sekalian tinggal Copas kede (copy paste) kode di bawah ini di atas kode tersebut:
<link href='http://i940.photobucket.com/albums/ad244/slametfun/slametfunanimasi.gif' rel='shortcut icon'/>
Silahkan ganti tulisan yang berwarna biru dengan URL gambar sobat2 yang telah di Upload tadi.
Kemudian untuk mencegah terjadinya kesalahan sebaiknya di Pratinjau terlebih dahulu,Kalo sudah oke jangan lupa di SAVE.
*Liat dech blog kamu dah keren sob....
selamat mencoba ya????
Terima kasih sudah berkunjung di slametfun,Jangan Comment nya.Dateng lagi...
tak tunggu lo....
Tentunya Ini bisa membuat blog sobat sobat sekalian semakin keren dan pribadi.
Tapi Bagai manakah caranya,Bukankah blogger tidak memberikan layanan tersebut.
Baiklah Pada kesempatan kali ini saya ingin berbagi sedikit ilmu saya yang saya pwerolah dari mengotak atik mbah blogger.
*Pertama-tama tentunya sobat harus mempersiapkan gambar yang akan di jadikan logo blog.
*Kemudian Tentunya apabila ingin mendapatkan alamat URLnya harus di UpLoad pada site penyimpanan Gambar Seperti Yang sayagunakan Yaitu di photobucket .
Setelah Sobat endapatkan alamat URL gambarnya maka selanjutnya harus Login pada akun blogger sobat sekalian,Kemudian pilih tata letak ----> Edit HTML Lalu Cari Kode Seperti ini :
<b:skin><![CDATA[
Apabila Kesulitan silahkan sobat sekalian tekan ctrl dan F pada keyboard komputer secara bersamaan,kemudian akan keluar kotak search di bawah lalu masukan kode tersebut dan enter.
*Langkah berikutnya sobat sekalian tinggal Copas kede (copy paste) kode di bawah ini di atas kode tersebut:
<link href='http://i940.photobucket.com/albums/ad244/slametfun/slametfunanimasi.gif' rel='shortcut icon'/>
Silahkan ganti tulisan yang berwarna biru dengan URL gambar sobat2 yang telah di Upload tadi.
Kemudian untuk mencegah terjadinya kesalahan sebaiknya di Pratinjau terlebih dahulu,Kalo sudah oke jangan lupa di SAVE.
*Liat dech blog kamu dah keren sob....
selamat mencoba ya????
Terima kasih sudah berkunjung di slametfun,Jangan Comment nya.Dateng lagi...
tak tunggu lo....
Cara Membuat Menu Horizontal
Pasti kamu dah pada tau,saat ini dah banyak banget blog yang make menu horizontal,kenapa ya???Mungkin jawabannya lebih praktis,gampang ato bisa juga lebih gaul and keren.Tapi bukankah saat kita membuat blog kita tidak menemukan template yang menyediakan menu horizontal???Betul..betul..betul...
Trus gimana caranya biar blog kita menunya menjadi hirozontal???
Okelah kalo begitu...Pada kesempatan kali ini,setelah pulang kerja,belum nyampek rumah..Saya sempetin buat berbagi sedikit ilmu yang saya dapet dari mbah google kepada sobat - sobAT sekalian...
*Pertama tama pastinya harus dah login pada blog sobat sekalian...
*Kemudian Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".
Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.
*Kemudian cari kode ini : ]]></b:skin> dan Copy-Paste (copas) kode berikut di atasnya.
Tips : Kalau sobat susah mencarinya, coba tekan ctrl tahan kemudian tekan F di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.
/* navbar
================== */
#bg_nav {
background: #ffffff;
width: 850px;
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000;
font-weight: bold;
margin: 0px auto 0px;
padding: 0px;
border-top: 1px solid #000000;
border-bottom: 1px solid #ffffff;
overflow: hidden;
}
#bg_nav a, #bg_nav a:visited {
color: #000000;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 3px;
}
#bg_nav a:hover {
color: #000000;
text-decoration: underline;
padding: 0px 0px 0px 3px;
}
#navleft {
width: 500px;
float: left;
margin: 0px;
padding: 0px;
}
#navright {
width: 220px;
font-size: 11px;
float: right;
margin: 0px;
padding: 3px 5px 0px 0px;
}
#navright a img {
border: none;
margin: 0px;
padding: 3px 5px 0px 0px;
}
#nav {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav a, #nav a:visited {
background: #ffffff;
color: #000000;
display: block;
font-weight: bold;
margin: 0px;
padding: 8px 15px 8px 15px;
border-left: 1px solid #ffffff;
}
#nav a:hover {
background: #c06000;
color: #000000;
margin: 0px;
padding: 8px 15px 8px 15px;
text-decoration: none;
}
#nav li {
float: left;
margin: 0px;
padding: 0px;
}
#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 150px;
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #ffffff;
width: 160px;
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
#nav li li a:hover, #nav li li a:active {
background: #c06000;
padding: 7px 30px 7px 10px;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}
#nav li:hover ul {
left: auto;
display: block;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
Kemudian silahkan sobat cari kembali kode seperti di bawah ini:
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1'
showaddelement='no'>
<b:widget id='Header1' locked='true' title='test
(Header)' type='Header'/>
............................dan seterusnya...................................................
</b:section>
</div>
Copas kode berikut tepat di bawah kode </b:section> atau </div> (sesuaikan dengan template blog kamu).
<div id='bg_nav'>
<div id='navleft'>
<div id='nav'>
<ul>
<li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
</ul>
</div>
</div>
<div id='navright'>
<form action='http://Alamat_Blog_Kamu.blogspot.com/search' id='searchform' method='get' name='searchform'> <input id='s' name='q' type='text' value=''/> <input id='searchsubmit' type='submit' value='Cari'/>
</form>
</div>
</div><!-- akhir bg_nav -->
Sebelum di save sebaiknya pratinjau terlebih dahulu untuk meyakinkan.
Setelah sukses pastinya jangan lupa Di save....
Wah coba liat blog kamu dah keren tu...
selamat ya sobat....
jangan lupa commentnya...
blogger yang baik tentunya harus gitu dunk,OK???
terimakasih atas kunjungannya,sayu tunggu kunjungan sobat kembali ...
Trus gimana caranya biar blog kita menunya menjadi hirozontal???
Okelah kalo begitu...Pada kesempatan kali ini,setelah pulang kerja,belum nyampek rumah..Saya sempetin buat berbagi sedikit ilmu yang saya dapet dari mbah google kepada sobat - sobAT sekalian...
*Pertama tama pastinya harus dah login pada blog sobat sekalian...
*Kemudian Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".
Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.
*Kemudian cari kode ini : ]]></b:skin> dan Copy-Paste (copas) kode berikut di atasnya.
Tips : Kalau sobat susah mencarinya, coba tekan ctrl tahan kemudian tekan F di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.
/* navbar
================== */
#bg_nav {
background: #ffffff;
width: 850px;
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000;
font-weight: bold;
margin: 0px auto 0px;
padding: 0px;
border-top: 1px solid #000000;
border-bottom: 1px solid #ffffff;
overflow: hidden;
}
#bg_nav a, #bg_nav a:visited {
color: #000000;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 3px;
}
#bg_nav a:hover {
color: #000000;
text-decoration: underline;
padding: 0px 0px 0px 3px;
}
#navleft {
width: 500px;
float: left;
margin: 0px;
padding: 0px;
}
#navright {
width: 220px;
font-size: 11px;
float: right;
margin: 0px;
padding: 3px 5px 0px 0px;
}
#navright a img {
border: none;
margin: 0px;
padding: 3px 5px 0px 0px;
}
#nav {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav a, #nav a:visited {
background: #ffffff;
color: #000000;
display: block;
font-weight: bold;
margin: 0px;
padding: 8px 15px 8px 15px;
border-left: 1px solid #ffffff;
}
#nav a:hover {
background: #c06000;
color: #000000;
margin: 0px;
padding: 8px 15px 8px 15px;
text-decoration: none;
}
#nav li {
float: left;
margin: 0px;
padding: 0px;
}
#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 150px;
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #ffffff;
width: 160px;
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
#nav li li a:hover, #nav li li a:active {
background: #c06000;
padding: 7px 30px 7px 10px;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}
#nav li:hover ul {
left: auto;
display: block;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
Kemudian silahkan sobat cari kembali kode seperti di bawah ini:
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1'
showaddelement='no'>
<b:widget id='Header1' locked='true' title='test
(Header)' type='Header'/>
............................dan seterusnya...................................................
</b:section>
</div>
Copas kode berikut tepat di bawah kode </b:section> atau </div> (sesuaikan dengan template blog kamu).
<div id='bg_nav'>
<div id='navleft'>
<div id='nav'>
<ul>
<li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
<li><a href='http://Link_yang_dituju'>Add Link</a></li>
</ul>
</div>
</div>
<div id='navright'>
<form action='http://Alamat_Blog_Kamu.blogspot.com/search' id='searchform' method='get' name='searchform'> <input id='s' name='q' type='text' value=''/> <input id='searchsubmit' type='submit' value='Cari'/>
</form>
</div>
</div><!-- akhir bg_nav -->
Sebelum di save sebaiknya pratinjau terlebih dahulu untuk meyakinkan.
Setelah sukses pastinya jangan lupa Di save....
Wah coba liat blog kamu dah keren tu...
selamat ya sobat....
jangan lupa commentnya...
blogger yang baik tentunya harus gitu dunk,OK???
terimakasih atas kunjungannya,sayu tunggu kunjungan sobat kembali ...
Langganan:
Postingan (Atom)