SELAMAT DATANG DIBLOG KAMAI

Sabtu, 29 September 2012

Cara Membuat Buku Tamu Tersembunyi di Blog

Cara Membuat Buku Tamu Tersembunyi di Blog - Cara memasang buku tamu/guest book tersembunyi di blog atau cara agar buku tamu/guest book bisa tersembunyi di blog.
Buku tamu merupakan tempat untuk menaruh pesan singkat di blog anda ketika sedang ada yang berkunjung.  Membuat buku tamu harus menggunakan jasa web yang menyediakan layanan buku tamu. Maksud dari judul tersembunyi disini bukan lah buku tamu yang tidak bisa dilihat oleh pengujung, tetapi buku tamu ini akan berada di sebelah artikel blog yang akan terbuka jika ada yang klik gambar buku tamu tersebut. Langkah ini merupakan salah satu langkah dalam menghemat tempat di blog kita. Selain itu, untuk menghemat tempat, anda juga menambahkan tab view di blog Anda. Baca: cara membuat tab view di blog. Jika anda tertarik untuk membuat buku tamu tersembunyi ini, silahkan ikuti langkah berikut:
Sebelum anda membuat buku tamu di blog anda, anda harus memiliki kode buku tamu, anda bisa mendapatkannya di Shoutbox, Cbox, atau Shoutmix. Setelah anda memiliki kode buku tamu tersebut, lanjut ke langkah berikut:

1. Login di blogger dengan ID anda.
2. Klik Tata Letak >> Tambah Gadget >> Pilih HTML/Java Script.
3. Lalu Copy kode berikut dan Pastekan Pada kotak HTML
 
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

< Letakkan disini kode Shoutbox Anda>

<div style="text-align:right">
<a href="http://amronbadriza.blogspot.com/2012/05/cara-membuat-buku-tamu-tersembunyi-di.html">
[Blogaul]
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>

Ganti tulisan < Letakkan disini kode Shoutbox Anda> dengan kode script buku tamu sobat.
4. Save Widget tersebut.

Jika langkah tersebut sudah anda lakukan, anda dapat melihat hasilnya pada blog anda masing-masing. Demikianlah cara memasang buku tamu tersembunyi ini, semoga bermanfaat


Source: http://amronbadriza.blogspot.com/2012/05/cara-membuat-buku-tamu-tersembunyi-di.html#ixzz27v1AnS7f

Kamis, 27 September 2012

Selasa, 18 September 2012

kirim sms gratis



Kamis, 13 September 2012

Angry Duck Space -


Free Online Games brought to you by FreeGamePick

Angry Birds Rio Online -


Free Online Games brought to you by FreeGamePick

Angry Birds Space HD


Free Online Games brought to you by FreeGamePick

Minggu, 09 September 2012

Cek Kecepatan Loading Blog


Cek Kecepatan Loading Blog

Written By Belajar Internet on Sabtu, 07 Juli 2012 | 23:19

Artikel sebelumnya kita sudah membahas Cek Berat Blog dan Cek Link Rusak pada Blog sekarang kita akan bahas tentang Cek Kecepatan Loading Blogyang semuanya kita bahas di blog Belajar Internethttp://matcuoi.com

Cek kecepatan loading blog berbeda dengan cek berat blog yang pernah kita bahas, apalagi cek link rusak blog. Kalau cek berat blog, yang kita cek adalah berapa besar ukuran dari suatu blog kita yang disampaikan dalam bentuk kilo byte (KB), tapi kalau cek kecepatan loading blog, yang di cek adalah berapa ukuran kecepatan loading blog kita hingga terbuka sempurna.

Kecepatan blog yang bagus adalah dengan nilai 100, jadi semakin dekat ukuran kecepatan blog kita sampai 100 maka semakin bagus pula kecepatan loading blog kita.
Baiklah, dari pada terus berlama-lama dan tak berujung, lebah baik kita lansung ke KTP, ekhh salah ke TKP.

1. Silahkan masuk ke Google Page Speed Online
2. Masukkan URL kamu dan klik ANALYZE, seperti tampilan di bawah ini


3. Tunggu sampai prosesnya selesai, maka Anda akan melihat hasilnya seperti tampilan di bawah ini

Nah, lihat ternyata ukuran kecepatan loading blog Belajar Internet yaitu 84, lumayan lah. Sekarang, silahkan cek berapa kecepatan loading blog sobat, semoga lebih dari yang aku punya yah, kalau bisa 100 juga boleh, http://matcuoi.com

Cara Memasang Emoticon di Komentar Blog


Cara Memasang Emoticon di Komentar Blog

Written By Belajar Internet on Selasa, 10 Juli 2012 | 20:19

Apa kabar sobat semua? Sudah pada makan belum? Sudah, selamat ya..
Lanjut, Belajar Internet kali ini akan membahas tentang Cara Memasang Emoticon di Komentar Blog. Emoticon ini mirip dengan emoticon di Yahoo!, pada tahu kan? Baiklah, kali ini emoticon di Yahoo! tersebut akan kita pasang di komentar blog sobat. Caranya? Sangat mudah dan sekedar contoh emoticon yang ingin kita buat adalah seperti gambar di bawah ini.

Cara Memasang Emoticon di Komentar Blog


Lansung saja kita ke TKP. Check it Out....
1. Masuk ke akun blogger Anda
2. Masuk pada bagian template
3. Klik Edit HTML
4. Seperti biasa, jangan lupa centang Expand Template Widget
5. Cari kode </body> untuk lebih mudah lansung saja tekan CTRL+F
6. Letakkan kode berikut tepat di atas kode </body> tadi
  <script src='http://tutorialblogger.googlecode.com/files/smiley.js' type='text/javascript'/>
7. Kemudian, kita cari lagi kode <b:include data='post' name='comment-form'/> dan untuk memudahkan pencarian tekan CTRL+F
8. Letakkan kode berikut tepat di atas kode no.7 tadi

<b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>
:))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
:)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
:D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
:p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
:((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
:)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
:(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
:X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
=((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
:-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
:-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
:-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
:|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
:-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
:-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
=))</b>
<center><blink><a href="http://belajarinternet100.blogspot.com/2012/07/cara-memasang-emoticon-di-komentar-blog.html" target="_blank">Pasang Emoticon Anda!</a></blink></center>

9. Klik Simpan Template

Daftar Situs Social Bookmark Terlengkap


Daftar Situs Social Bookmark Terlengkap

Written By Belajar Internet on Sabtu, 28 Juli 2012 | 21:33

Daftar Situs Social Bookmark Terlengkap
Situs Social Bookmark adalah situs yang menyediakan tempat untuk Anda dapat mempromosikan web / blog Anda secara (gratis). Dengan hal ini, pengunjung yang masuk ke web / blog Anda otomatis akan meningkat. Tentunya inilah yang Anda mau bukan? Setiap artikel yang baru saja Anda publikasikan, bisa kalian masukkan ke dalam Situs Social Bookmark tersebut. Yang terpenting adalah artikel yang Anda kirimkan bukanlah artikel yang melanggar aturan dari setiap Social Bookmark. Baiklah, tanpa basa-basi lagi, blogBelajar Internet akan lansung memberikan beberapa Daftar Situs Social Bookmark tersebut. Silahkan daftar / register di situs yang Anda inginkan (semua juga boleh).

Situs Social Bookmark Indonesia

http://lintasme.com/
http://infogue.com
http://sajikan.com
http://www.kombes.com
http://sundulberita.com
http://directory.blogbareng.com
http://www.liputankhusus.com
http://bookmarking.bloggerceria.info/
http://www.business-planet.net/
http://www.nuansaiklan.com/
http://www.galia-online.com/
http://www.bookmarkindonesia.com
http://jaditerkenal.com
http://sekilasinfo.net
http://berbobot.com/
http://beritakamu.com
http://indofeed.com
http://disuka.com/
http://www.indokami.com/
http://www.cherianews.com/
http://definisi.net/
http://tunden.com/
http://bookmarkspro.com/
http://www.bagiurl.com/
http://negeriku.info/
http://debuk.com/
http://tipspad.com
http://beritasaya.com
http://bookmarkindo.com/
http://www.tentang.net/
http://beritapilihan.com
http://populerkan.com
http://beritague.com

 
http://slashdot.org   
http://technorati.com   
http://del.icio.us   
http://digg.com 
http://squidoo.com  
http://mixx.com   
http://propeller.com   
http://reddit.com   
http://stumbleupon.com   
http://google.com/bookmarks  
http://blinklist.com   
http://folkd.com   
http://foxiewire.com    
http://mister-wong.com
http://newsvine.com   
http://sphere.com       
http://wikio.com   
http://co.mments.com   
http://designfloat.com   

http://linkarena.com   
http://linkswarm.com   
http://mobiseer.com   
http://myhq.com   
http://myjeeves.ask.com   
http://mylinkvault.com     

http://bibsonomy.org   
http://fcc.com   
http://gabbr.com   
http://givealink.org   
http://haohaoreport.com   
http://indianpad.com    
http://blogcatalog.com   
http://diigo.com   
http://dzone.com   
http://faves.com   
http://findnews.org   
http://jumptags.com   
http://kwoff.com    
http://onlywire.com   
http://pusha.se   
http://scoopit.co.nz   
http://simpy.com   
http://sphinn.com   
http://tipd.com    

http://netvouz.com

http://joomocracy.com   
http://kirtsy.com   
http://linkagogo.com    
http://ma.gnolia.com
 

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com


Cara Membuat Polling atau Voting di Blog dengan BooRoo.com

Written By Belajar Internet on Selasa, 31 Juli 2012 | 01:27

Cara Membuat Polling atau Voting di Blog dengan BooRoo.comSelamat siang dan apa kabar!! Menjelang berbuka puasa (masih lama), mari kita ngabuburit bareng dengan menyimak sebentar postingan blog Belajar Internet kali ini yang akan membahas tentang Cara Membuat Polling atau Voting di Blog dengan BooRoo.com. Postingan ini merupakan permintaan dari "saudara" (bukan kandung) blogger kita.
Sebenarnya website membuat polling atau votingsangatlah banyak (terutama yang gratisan), bukan cuma BooRoo.com. Tapi karena yang saya pikirkan, tampilan polling atau voting dari BooRoo.com lebih sederhana tapi menarik. Jika Anda belum tahu tampilannya seperti apa, Anda bisa lihat gambar di bawah ini:

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
Sudah mengerti bukan? Gimana tampilannya? Sederhana tapi menarik. Lansung saja, tanpa berlama-lama lagi, kita ke TKP.

1. Masuk ke BooRoo.com
2. Silahkan Sign Up dengan memasukkan data (lengkap) Anda. Kemudian klik Sign Up Now!

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
3. Maka Anda akan dibawa ke tampilan seperti di bawah ini, tanpa melihat ke kanan, ke kiri, ke bawah ataupun ke atas lansung klik Your Survey

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com

 4. Klik Create New ...

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com

5. Klik Instant Poll

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com


6. Setelah itu, silahkan pilih tema yang Anda inginkan

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
 7. Scroll ke bawah, dan silahkan isi lengkap data yang ada, seperti pertanyaan dan jawaban.

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
8. Kembali ke atas dan klik pada Launch

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
9. Selanjutnya, silahkan copy atau salin kode HTML yang diberikan pada bagian ke 3

Cara Membuat Polling atau Voting di Blog dengan BooRoo.com
10. Masuk ke akun blog Anda
11. Masuk ke bagian Tata Letak
12. Klik Tambah Gadget dan pilih HTML/Javascript
13. Pastekan kode tadi di tempat itu, kemudian klik Simpan

Akhirnya, selesai juga. Selamat Mencoba.... Wait!! tunggu dulu, loh ko pas di pasang, lebar banget? Nah, sekarang waktunya Anda mengedit kode HTML itu, untuk mengatur lebarnya silahkan Anda caristyle="width:300px;" pada bagian kode HTML tersebut. Setelah itu, ganti 300 dengan lebar yang Anda inginkan. Sesuaikan saja dengan tampilan blog Anda.
Anda mungkin juga meminati:

Cara Menghilangkan / Menghapus Widget Attribution Blogger


Cara Menghilangkan / Menghapus Widget Attribution Blogger

Written By Belajar Internet on Selasa, 31 Juli 2012 | 23:59

Cara Menghilangkan / Menghapus Widget Attribution Blogger
Selamat siang para blogger!! Siang yang bener-benermendung ini, admin yang baik hati ini dari blog Belajar Internet akan membahas tentang Cara Menghilangkan / Menghapus Widget Attribution Blogger di Blog. Kenapa harus dihilangkan? Karena jika tidak dihilangkan pasti akan terus muncul. Jawabannya tepat, tapi bukan maksudnya.
Sebenarnya kalian "tahu ngga sih" apa itu Widget Attribution Blogger ? Kalian pernah lihat kan pada setiap blog di internet dengan tulisan "Powered by Blogger"atau "Didukung oleh Blogger". Nah, itulah yag kami maksudkan dengan Widget Attribution Blogger.

Widget ini memang didesain utama oleh blogger itu sendiri, mungkin sebagai hak cipta. Kita juga harus sadar kalau kita berada dinaungan mana, yaitu blogger atau blogspot. Tapi, yang di sayangkan adalah terkadang widget ini tidak berada di posisi yang seharusnya atau terlihat lebih mengganggu. Namun, beruntung jika widget pada blog Anda termasuk blog ini berada di posisi seharusnya, jadi kita tidak usah hilangkan bukan?

Baiklah, buat kalian yang merasa Widget Attribution Blogger di Blog kalian memang terasa mengganggu, ayo kita hilangkan saja. Cara hilanginnya sangat mudah dan simple banget, tinggal kasih pemanis, selesai deh. Lansung saja kita ke TKP.

1. Masuk ke akun blogger kalian
2. Silahkan masuk ke bagian Template
3. Klik Edit HTML
4. Silahkan cari kode ]]></b:skin> , untuk lebih mudah silahkan tekan CTRL+F untuk mencarinya
5. Pastekan kode di bawah ini tepat di atas kode ]]></b:skin> tadi

#Attribution1
height:0px;
visibility:hidden;
display:none
}

6. Untuk lihat hasilnya terlebih dahulu, silahkan klik Pratinjau dan jika Anda merasa widget tersebut sudah menghilang, silahkan klik Simpan Template

Cara Membuat Efek Petir pada Blog


Cara Membuat Efek Petir pada Blog

Written By Belajar Internet on Rabu, 01 Agustus 2012 | 02:45

Cara Membuat Efek Petir pada Blog
Selamat sore, blog Belajar Internet kali ini akan membahas tentang Cara Membuat Efek Petir pada BlogEfek Petir pada Blog ini sudah banyak digunakan pada blog-blog tetangga. Mungkin, Efek Petir pada Blog ini lebih menarik bagi mereka. Buat kalian yang sekedar ingin melihat bagaiman petir tersebut di blog Anda, bisa di lihat gambar di samping. Jadi, daripada berlama-lama lagi, ayo kita buat Efek Petir pada Blog sobat semua.

1. Masuk dulu ke akun blogger sobat
2. Silahkan masuk ke bagian Tata Letak
3. Klik Tambah Gadget, kemudian pilih HTML/Javascript
4. Silahkan salin kode di bawah ini dan pastekan di tempat tersebut

<style
type="text/css">body { background-image:
url(http://i958.photobucket.com/albums/ae69/putrablidz/storm.gif);
background-color:transparent; }</style>



5. Anda tidak perlu memberikan judul, lansung klik Simpan

Cara Membuat Kotak Komentar Facebook dan Blog Berdampingan


Cara Membuat Kotak Komentar Facebook dan Blog Berdampingan

Written By Belajar Internet on Rabu, 08 Agustus 2012 | 02:31

Cara Membuat Kotak Komentar Facebook dan Blog Berdampingan
Tutorial yang satu ini, pasti sudah tidak asing lagi bagi para blogger sekalian. Hal semacam ini sudah banyak yang nangkring di beberapa blog. Tapi, apa salahnya berbagi informasi dengan para sobat sekalian. Kalau hanya untuk kotak komentar facebook juga sudah pernah saya bahas pada artikel sebelumnya.

Nah, kali ini kita akan membahas yang berdampingan, sekedar contoh Anda bisa lihat gambar di bawah ini, yang saya ambil dari blog baru saya DISINI.

Komentar Facebook dan Blog Berdampingan


Jelas kan?? Biar kalian tahu, tutorial macam ini sudah banyak di google, tapi rata-rata dari tutorial mereka tidak berhasil dari beberapa template yang biasa dan mungkin hanya pada template premium. Oleh sebab itu, disini saya akan mengulas sedikit Cara Membuat Kotak Komentar Facebook dan Blog Berdampingan yang semoga berhasil pada template blog kalian. Aminn..

1. Masuk ke akun blogger sobat
2. Selanjutnya masuk pada bagian Template
3. Klik Edit HTML
4. Silahkan centang Expand Template Widget
5. Sudah itu, Anda cari kode ]]></b:skin>, untuk memudahkan pencarian, silahkan tekan ctrl+f.
6. Setelah ketemu, silahkan letakkan kode di bawah ini tepat di atas kode tadi

.comments-page { background-color: #f2f2f2;}
    #blogger-comments-page { padding: 0px 5px; display: none;}
    .comments-tab { float: left; padding: 5px; margin-right: 3px;
    cursor: pointer; background-color: #f2f2f2;}
    .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
    .comments-tab:hover { background-color: #eeeeee;}
    .inactive-select-tab { background-color: #d1d1d1;}

catatan:
Silahkan hapus kode berwarna merah itu, jika Anda ingin membuat kotak komentar facebook menjadi transparan.

7. Kemudian Anda cari kode </head> , seperti tadi untuk lebih memudahkan pencarian tekan ctrl+f
8. Jika sudah ketemu, silahkan letakkan kode di bawah ini tepat di atas kode </head> tadi

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
    <script src='http://code.jquery.com/jquery-latest.js'/>
    <meta content='ID FB Anda disini' property='fb:admins'/>
    <script type='text/javascript'>
    function commentToggle(selectTab) {
    $(".comments-tab").addClass("inactive-select-tab");
    $(selectTab).removeClass("inactive-select-tab");
    $(".comments-page").hide();
    $(selectTab + "-page").show();
    }
    </script>

catatan:
Silahkan Anda ganti tulisan berwarna merah tersebut dengan ID FB Anda. Sudah tahu kan, apa itu ID FB? Jika Anda sudah ganti, misalnya http://facebook.com/justangzealotous berarti ID FB kamujustangzealotous. Namun, jika Anda belum menggantinya, maka ID FB Anda adalah sebuah angka-angka, contoh http://facebook.com/1234567890. Untuk melihat ID FB, Anda bisa masuk ke profil FB kamu, kemudian silahkan lihat pada adress bar.

9. Selanjutnya, silahkan Anda cari kode <div class='comments' id='comments'>
10. Umumnya, kode <div class='comments' id='comments'>, terdapat 2. Silahkan Anda letakkan kode berikut tepat di bawah kedua kode tersebut.

  <div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
    <img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
    <fb:comments-count expr:href='data:post.url'/> Comments
    </div>
    <div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
    <img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
    </div><div class='clear'/>
    </div>
    <div class='comments-page' id='fb-comments-page'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='fb-root'/>
    <fb:comments expr:href='data:post.url' num_posts='3' width='400'/>
    </b:if>
    </div>
    <div class='comments comments-page' id='blogger-comments-page'>

catatan:
Silahkan Anda, hapus kode berwarna merah tersebut, jika kode di bawah sama. Kalau tidak, yah tidak perlu dihapus. Perhatikan, untuk yang nomor 3 adalah jumlah komentar yang akan muncul di kotak komentar facebook, untuk yang nomor 400 adalah lebar kotak komentar. Silahkan ganti sesuai dengan keinginan Anda.

11. Setelah itu, klik Simpan Template

Selesai, juga deh kotak komentar facebook dan blog yang berdampingan. Selamat mencoba.
Sumber: http://super-bee.blogspot.com

Cara Membuat Tab View Multitab di Blog


Cara Membuat Tab View Multitab di Blog

Written By Belajar Internet on Sabtu, 18 Agustus 2012 | 07:16

Cara Membuat Tab View Multitab di Blog
Setelah ganti template blog Belajar Internet, dan hasilnya seperti Anda lihat sendiri (sudah bagus ngga?) dan ada yang baru di blog admin, yaitu Tab View Multitab. Jujur, tab view multitab ini sudah pernah saya coba untuk template lama, tapi ternyata selalu gagal, karena tutorial yang saya pakai adalah super simple (bukan mr. simple). Tapi, untung saja setelah berjelajah ke google, akhirnya saya temukan caranya di blog http://catatanku-yd.blogspot.com, memang tidak simple tapi hasilnya Berhasil!!!. Lansung saja, artikel yang admin akan posting pada malam takbiran ini di bulan Ramadhan adalah membahas tentang Cara Membuat Tab View Multitab di Blog. Sudah tahu kan, apa itu tab view multitab? Jika Anda belum tahu, silahkan Anda perhatikan di bagian sidebar kanan blog ini atau lansung saja perhatikan gambar di bawah ini.

Cara Membuat Tab View Multitab di Blog
Tab View Multitab ini sangat berguna untuk memberikan ruang yang lebih untuk widget-widget yang ada di blog Anda. Tentunya, dengan hal ini tampilan blog Anda akan lebih rapi. Tanpa basa basi lagi, ayo kita TKP.

1. Silahkan masuk ke akun blogger Anda
2. Masuk pada bagian template dan klik Edit HTML
3. Setelah itu silahkan Anda cari kode ]]></b:skin>, untuk memudahkan pencarian, silahkan Anda tekan CTRL+F
4. Silahkan salin kode di bawah ini dan letakkan tepat di atas kode ]]></b:skin> tadi.

/* Menu Tab View
----------------------------------------------- */
div.TabView div.Tabs {widht:100%;
padding-top: 0px;
height: 24px;
overflow: hidden;
}
/* Menu Utama */
div.TabView div.Tabs a {
float: left;
display: block;
width: 110px; /* ukuran lebar menu */ 
text-align: center;
height: 30px; /* ukuran tinggi menu */
padding-top: 7px;
margin-right:4px; /* jarak antarmenu */
vertical-align: middle;
border: 1px solid #ccc; /* warna border menu */ 
border-bottom-width: 0;
margin:0px;
padding: 5px 0;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold; /* besar hurup menu */ 
background-color: #6666FF; /* warna latar menu */
color: #FFFFFF; /* warna hurup menu */ 
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
}
div.TabView div.Tabs a.Active {
background-color: #FFFFFF; /* warna background menu aktif */ 
color: #000000;
}
div.TabView div.Tabs a:hover {
background-color: #999999; /* warna background menu hover */ 
color: #FFFFCC;
font-weight: bold;
}
/* Kotak Utama */
div.TabView div.Pages {
clear: both;
border: 1px solid #CCC; /* warna border kotak utama */ 
overflow: hidden;
background:#FFFFFF; /* background kotak utama */ 
}
div.TabView div.Pages div.Page {
height: 100%;
padding: 7px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad {
padding: 5px 0px;
font-size: 12px; /* besar hurup kotak utama */ 
}
/* tabview css end */

5. Selanjutnya cari kode </head> dan silahkan salin kode di bawah ini tepat di atas kode </head>

<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/tabview.js' type='text/javascript'/>

6. Simpan template, kemudian kembali ke Tata Letak, klik Tambah Gadget
7. Pilih HTML/Javascript
8. Selanjutnya salin kode di bawah ini dan letakkan disana, judul tidak perlu diisi.

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 950px;">
<a>Judul 1</a>
<a>Judul ke 2</a>
<a>Judul ke 3</a>
<a>Judul ke 4</a>

</div> 
<div class="Pages" style="width: 950px; height: 270px;"> 
<div class="Page"> 
<div class="Pad">

Isi tab view pertama


</div></div>


<div class="Page"> 
<div class="Pad">

Isi tab view ke 2

</div></div> 

<div class="Page"> 
<div class="Pad">

Isi tab View ke 3

</div></div> 


<div class="Page"> 
<div class="Pad">

Isi Tab view ke 4

</div></div> 

</div></div> 
</form> 
<script type="text/javascript"> 
tabview_initialize('TabView'); 
</script>

9.  Simpan dan lihat hasilnya

Kode Warna HTML Lengkap

Kode Warna HTML Lengkap - Belajar Internet
Apa kabar semua? Sudah pada tau ngga sih kalian kode warna HTML? Belum tahu? Ayo silahkan lihat disini, Tinggal klik warna yang kalian inginkan, maka akan muncul kodenya. Kode warna HTML biasa ditandai dengan pagar (#). Contoh kode warna merah adalah #FF0000. Selamat mencari warna yang diinginkan.


Share this article :
Comments
2 Comments

2 komentar:

belajar html mengatakan... [Reply]
mantap gan
Blogaul mengatakan... [Reply]
Wah,, yg ane cari cari ketemu disini juga.. Thanks berat gan..
:) :( ;) :D ;;-) :-/ :x :P :-* =(( :-O X( :7 B-) :-S #:-S 7:) :(( :)) :| /:) =)) O:-) :-B =; :-c :)] ~X( :-h :-t 8-7 I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ #-o =D7 :-SS @-) :^o :-w 7:P 2):) X_X :!! \m/ :-q :-bd ^#(^ :ar!
Pasang Yahoo Emoticon Anda

Poskan Komentar

Jika ada yang kurang paham mengenai artikel ini, silahkan kirim komentar dan harus relevan dengan isi artikel di atas.INGAT jangan memberikan komentar dengan bumbu SPAM,P*RNO,PROMO,LINK !!! Terima Kasih dan jangan lupa follow blog ini nanti saya akan follback promise



Back To Top : Klik untuk Kembali ke Halaman Atas ↑↑↑
Copyright © 2011. Belajar Internet - All Rights Reserved
Template Modify by Creating Website Inspired Wordpress Hack
Proudly powered by Free Coupons

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | cheap international voip calls