Jumat, 11 Mei 2012

Lagu Bruno Mars untuk blog

Posted On 00.24 by Muhammad Yahya 0 komentar

Login ke blog
rancangan + gadget
+HTML/javaScript
taruh di situ lalu tunggu 
Lihat hasil nya



                                                    Mars - Just The Way You Are

Copas Embed Nya
 

Bruno Mars - Grenade

Copas Embed Nya

Bruno Mars - The Lazy Song

Copas embed nya


Semoga Bermanfaat


 

Kamis, 10 Mei 2012

macam macam css border

Posted On 22.40 by Muhammad Yahya 0 komentar

BEBERAPA MACAM CSS BORDER
    1. none
    2. dotted
    3. dashed
    4. solid
    5. double 
    6. groove 
    7. ridge 
    8. inset 
    9. outset    		: Tidak mendefinisikan garis perbatasan
    : Mendefinisikan perbatasan garis titik-titik.
    : Mendefinisikan perbatasan garis putus-putus.
    : Mendefinisikan perbatasan garis penuh.
    : Mendefinisikan perbatasan garis ganda.
    : Mendefinisikan perbatasan garis berlekuk 3D.
    : Mendefinisikan perbatasan garis bergerigi 3D.
    : Mendefinisikan perbatasan garis inset 3D.
    : Mendefinisikan perbatasan garis outset 3D.
Cara menggunakannya:
  1. none
    2. <p style="border: 3px none; #000000; padding: 20px;">Tidak mendefinisikan garis perbatasan</p>
    Tidak mendefinisikan garis perbatasan
  2. dotted
    3. <p style="border: 3px dotted; #000000; padding: 20px; align: center;"> Mendefinisikan perbatasan garis titik-titik.</p>
    Mendefinisikan perbatasan garis titik-titik.
  3. dashed
    4. <p style="border:3px dashed; #000000; padding: 20px;"> Mendefinisikan perbatasan garis putus-putus.</p>
    Mendefinisikan perbatasan garis putus-putus.
  4. solid
    5. <p style="border:3px solid; #000000; padding: 20px;"> Mendefinisikan perbatasan garis penuh.</p>
    Mendefinisikan perbatasan garis penuh.
  5. double
    6. <p style="border: 5px double; #000000;padding: 20px;"> Mendefinisikan perbatasan garis ganda.</p>
    Mendefinisikan perbatasan garis ganda.
  6. groove
    7. <p style="border: 10px groove; #000000; padding: 20px;"> Mendefinisikan perbatasan garis berlekuk 3D.</p>
    Mendefinisikan perbatasan garis berlekuk 3D.
  7. ridge
    8. <p style="border: 10px ridge; #000000; padding: 20px;"> Mendefinisikan perbatasan garis bergerigi 3D.</p>
    Mendefinisikan perbatasan garis bergerigi 3D.
  8. inset
    9. <p style="border: 10px inset; #000000; padding: 20px;"> Mendefinisikan perbatasan garis inset 3D.</p>
    Mendefinisikan perbatasan garis inset 3D.
  9. outset
    10. <p style="border: 10px outset; #FF3300; padding: 20px;"> Mendefinisikan perbatasan garis outset 3D.</p>
    Mendefinisikan perbatasan garis outset 3D.








Get Free Music at http://tukaranbanneryuk.blogspot.com/

Get Free Music at http://tukaranbanneryuk.blogspot.com/



Free Music at divine-music.info


 

cara mudah membuat menu horizontal

Posted On 22.38 by Muhammad Yahya 0 komentar

Menu ini biasanya terletak di bawah header.
Di bawah ini adalah gambar menu navigasi horizontal yang akan kita buat.

Kita langsung saja menuju bagaimana cara membuatnya.
  • Masuk ke blog sobat
  • Pilih tata letak atau rancangan.
  • Klik tambah gadget.
  • Pilih HTML/Java Script.
  • Kemudian masukkan kode di bawah ini.
    <style type="text/css">
    /*----------------------------------*/
    .Nav a { width: auto; height: auto; text-decoration: none; }
    .Nav a { text-align: center; text-decoration:none;color:#ffffcc; padding:1px 20px 1px 20px;font-weight:bold; font-size:12px; }
    .Nav a:hover {padding:3px 20px 3px; 20px; text-align:center; text-decoration:none; color:#000033; font-weight:bold; border:3px; background-color: #000000;}
    </style>
    <div style="border: 3px solid #ffcc99; height:px;background-color:#FF3366;">
    <div style="width: auto; padding: 10px;" class="Nav" align="left">
    <a href="http://activekita.blogspot.com"target="_blank"><span style="font-weight:bold; color:#FFFF00; ">HOME</span></a>
    <a href="http://activekita.blogspot.com/2010/01/kode- warna.html"target="_blank"><span style="font-weight:bold;color:#FFff00;">JUDUL1 </span></a>
    <a href="http://activekita.blogspot.com/2010/08/menambah-satu-kolom-di-bawah-header.html"target="_blank"><span style="font-weight:bold; color:#FFff00;">JUDUL 2</span></a>
    <a href="http://activekita.blogspot.com/2010/10/membuat-menu-navigasi-horizontal.html"target="_blank"><span style="font-weight:bold; color:#FFff00;">JUDUL 3</span></a>
    <form action="http://activekita.blogspot.com/search" id="searchform" method="get" style="display: inline; float:right; padding-right:10px; padding-bottom:px" > <input id="searchbox" maxlength="" name="q" onblur="if (this.value == "") {this.value = "Search...";}" onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" /> <input class="btn" name="" " value="search" type="submit" span style="font-weight:bold; font-size:12px; color:#ff3399" />
    </form>
    </div></div> 
  • Ganti yang warna hijau dengan alamat link milik sobat. Bila perlu sobat bisa tambah dengan link sobat yang lain.
    Jangan lupa isi juga keterangan yang sesuai pada judul.
  • Klik simpan.


 

cara mudah daftar ke ziddu

Posted On 22.33 by Muhammad Yahya 0 komentar

    Untuk register seperti biasa harus memasukan:
  • Nama: tulis nama.
  • Email: Masukkan email (untuk login selanjutnya).
  • Password: masukkan password.
  • Confirmasi Password: ulangi masukkan password.
  • Verification Code: Masukkan kode yang tertera.
  • Beri tanda centang pada I Agree Terms and Conditions.
  • Klik submit.
Di sini sobat sudah otomatis login jadi tidak perlu login lagi. Tapi jika sewaktu-waktu ingin upload file lagi sobat di haruskan login. Untuk itu Email id dan password harus sobat ingat bila perlu disimpan.
Setelah masuk pada pojok kanan atas sobat klik upload, maka akan terlihat tampilan sepeti ini:

  • Kemudian klik Browse.
  • Cari file dari komputer milik sobat yang ingin sobat upload.
  • Jika sudah ketemu Klik dua kali.
  • Kemudian baru klik upload.
    Maka sobat akan melihat tampilan seperti gambar dibawah.


  • Tunggu sampai proses upload selesai.
  • Jika proses upload selesai sobat langsung dibawa pada link file hasil dari upload tadi.


 

cara melihat posisi blog kita

Posted On 22.31 by Muhammad Yahya 0 komentar

Di sini ada sebuah layanan yang mungkin bisa sobat coba. Kita bisa memanfaatkan layanan ini untuk mengetahui pada posisi keberapa kata kunci yang kita gunakan pada blog.
Biasanya pertama kali google akan mengindex kata kunci pada judul artikel yang kita buat,makanya kita harus memanfaatkan dengan baik dalam membuat judul.
Pada layanana ini sobat tinggal memasukkan alamat blog dan kata kunci yg sobat gunakan.
Untuk mulai memanfaatkan layanan ini sobat bisa masuk ke:http://www.seoserp.com/google.page.rank.checker/
  • Pilih negara atau tetap pada www.google.com
  • Masukkan keywords yang sobat gunakan misal judul halaman atau judul artikel.
    Misal di sini saya memasukkan kata kunci dengan judul MELIHAT POSISI BLOG PADA SEARCH ENGINE
  • Masukkan alamat domain milik sobat misal: http://tukaranbanneryuk.blogspot.com
  • Kemudian klik GO FOR SERP
  • Tunggu sampai proses selesai, kemudian bisa dilihat pada posisi berapa blog milik sobat.


 

cara membuat text tidak bisa di copy

Posted On 22.25 by Muhammad Yahya 0 komentar

Dulu ada salah satu blog saya yang memakai script ini, tapi tidak lama sudah saya lepas.
Jika blog sobat ingin anti klik kanan langsung saja kita menuju bagaimana cara membuat dan memasangnya.
  • Seperti biasa login dulu ke blog sobat.
  • Klik tata letak (layout) atau rancangan.
  • Klik tambah gadget.
  • Pilih HTML/JavaScript.
  • Masukkan script di bawah ini pada konten.
    <SCRIPT language=JavaScript> var message="Function Disabled!"; /////////////////////////////////// function clickIE4(){ if (event.button==2){ alert(message); return false; } } function clickNS4(e){ if (document.layers||document.getElementById&&!document.all){ if (e.which==2||e.which==3){ alert(message); return false; } } } if (document.layers){ document.captureEvents(Event.MOUSEDOWN); document.onmousedown=clickNS4; } else if (document.all&&!document.getElementById){ document.onmousedown=clickIE4; } document.oncontextmenu=new Function("alert(message);return false") // --> </SCRIPT> 
  • Klik simpan.
  • Jangan lupa lihat hasilnya.


 

cara membuat recent komentar di blog

Posted On 22.24 by Muhammad Yahya 0 komentar

Mungkin sobat ada yang ingin menambahkan recent comment pada blogspot. Caranyapun tidak begitu sulit. Sobat tinggal menambahkan alamat feed milik sobat, seperti cara di bawah ini.
  • Login ke blog sobat
  • Pilih tata letak.
  • Klik tambah gadget.
  • Pilih feed
    Tambahkan konten dari feed RSS atau Atom ke blog Anda.
  • Masukkan alamat feed milik sobat. Pilih salah satu yang rss atau yang atom.
    Untuk yang rss cara penulisannya seperti ini
    http://tukaranbanneryuk.blogspot.com/feeds/posts/default Sedang untuk yang atom penulisannya seperti ini.
    http://tukaranbanneryuk.blogspot.com/feeds/comments/default
  • Kemudian klik lanjutkan.
  • Beri Judul,misal recent comments atau atau komentar baru terserah sobat.
  • Sobat juga bisa memilih item yang ingin sobat tampilkan, seperti di bawah ini.
    Tampilkan item.
    Tanggal Item.
    Sumber/pengarang item.
    Buka link di jendela baru.
  • Kemudian Klik simpan.


 

cara membuat gambar membesar ketika di sorot

Posted On 22.18 by Muhammad Yahya 0 komentar

Untuk membuatnya sobat bisa menggunakan cara di bawah ini.
  • Masuk ke blog sobat.
  • Klik tata letak.
  • Pilih edit HTML.
  • Cari kode </head>.
  • Letakkan script di bawah ini di atasnya, hingga posisinya sbb:
    <style type='text/css'>
    border:none;
    vertikal-align:top;}
    </style>
    <script src="http://sites.google.com/site/darmasites/my-forms/gambarmembesarketikadisorot.js" type="text/javascript">
    </script>
    </head>.
  • Kemudian klik simpan.
Ketika akan posting gambar atau image sobat tinggal menambahkan sedikit kode pada alamat gambar yang sobat punya.
Misal:

<img class="expando" border="0" src="http://i761.photobucket.com/albums/xx252/darma_bucket/th_garudajpn.png"width="75" height="75"> 

Untuk melihat hasilnya arahkan cursor sobat pada gambar di bawah.


 

cara mudah membuat emotcion pada kotak komentar

Posted On 22.10 by Muhammad Yahya 0 komentar


 :)  :(  ;)  :D  ;;)  :-/  :x  :P  :-* =((  :-o  x(  :((  :))  :|  =))  8-}  :-L  B-(  ;))  :)]  ~x(  :-t

Bagi yang belum tahu cara memasang emoticon pada kotak komentar bisa ikuti langkah-langkahnya:
  • Masuk ke blog sobat.
  • Klik tata letak.
  • kemudian klik edit HTML.
  • Beri tanda pada Expand Template Widget.
  • Cari kode </body>
  • Letakkan kode ini di atasnya. Hingga posisinya sbb:
    <script src='http://sites.google.com/site/darmasites/my-forms/emoticon.js' type='text/javascript'/>
    </body>
  • Langkah selanjutnya cari kode yang mirip seperti di bawah ini.
    <p class='comment-footer'>
    <b:if cond='data:post.embedCommentForm'>
    <b:if cond='data:post.allowNewComments'>
    <b:include data='post' name='comment-form'/>
    <b:else/>
  • Kemudian letakkan kode emotnya di bawah kode <p class='comment-footer'>
    Sehingga hasil penempatannya akan seperti di bawah ini:
    <p class='comment-footer'>
    <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/3.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/5.gif'/> ;;)
    <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/8.gif'/> :x
    <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/11.gif'/> :-*
    <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/14.gif'/> x(
    <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> :((<br/>
    <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/22.gif'/> :|
    <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.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/62.gif'/> :-L
    <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/71.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/102.gif'/> ~x(
    <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> :-t
    <b:if cond='data:post.embedCommentForm'>
    <b:if cond='data:post.allowNewComments'>
    <b:include data='post' name='comment-form'/>
    <b:else/>
  • Kemudian klik pratinjau.
  • Setelah dirasa aman baru klik simpan.
    SEMOGA BERMANFAAT


 

cara rubah warna link untuk blogger

Posted On 22.08 by Muhammad Yahya 0 komentar

  • cara nay mudah ikuti aja langkah langkah ini
  • Masuk ke blog sobat
  • Klik tata letak 
  • Pilih edit HTML 
  • Cari kode yang hampir mirip di bawah ini:
    a:link {
    color:#0000cc;
    text-decoration: underline;
    }
    a:hover {
    color:#ff0000;
    text-decoration: underline;
    }
    a:visited {
    color:#006600;
    text-decoration: underline;
    }
Jika sebelumnya menghilangkan garis di bawah link kita merubah underline menjadi none, maka untuk merubah warna link di blogspot kita tinggal merubah kode warna yang di cetak biru di atas.
  • Jika sudah selesai mengganti jangn lupa Simpan perubahan
Sedikit keterangan:
    a:link { color:#0000cc; text-decoration: underline; } Link ini akan berwarna biru. a:hover { color:#ff0000; text-decoration: underline; } Jika mouse kita arahkan pada link maka akan berubah menjadi warna merah. a:visited { color:#006600; text-decoration: underline; } Jika link selesai diklik pengunjung maka link akan berubah menjadi hijau.
semoga berhasil


 

cara membuat judul bergambar

Posted On 22.01 by Muhammad Yahya 0 komentar

Pertama yang harus sobat lakukan adalah mengupload dulu gambar di tempat yang biasa sobat lakukan,bisa di photobucket atau di mana saja yang rasanya tidak terlalu sulit untuk mencarinya di internet. Agar lebih memudahkan sebelum upload gambar tentukan dulu ukuran gambarnya. Setelah gambar terupload ambil alamat yang ada.
Misalnya saya mendapatkan kode alamat seperti ini:
    http://i761.photobucket.com/albums/xx252/darma_bucket/Menambah-gambar-ke- dalam-judul-post.gif
Kemudian tambah tag hingga menjadi seperti di bawah ini:
    <img align='left' height='50' width='50' src="http://i761.photobucket.com/albums/xx252/darma_bucket/Menambah-gambar -ke-dalam-judul-post.gif" ></img><br/>
Setelah siap baru kita masukkan gambarnya,caranya:
  • Masuk ke blog sobat.
  • Klik tata letak.
  • Pilih edit HTML.
  • Beri tanda pada Expand Template Widget
  • Cari Kode seperti di bawah ini.

    <b:includable id='post' var='post'>
    <div class='post hentry uncustomized-post-template'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <img align='left' height='50' width='50' src="http://i761.photobucket.com/albums/xx252/darma_bucket/Menambah-gambar -ke-dalam-judul-post.gif" ></img><br/><b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
  • Sisipkan alamat gambar milik sobat di antara kode di atas posisinya seperti yang terlihat.
    Perhatikan juga spasinya , karena ini sangat berpengaruh.
  • Klik prajinjau.
  • Setelah di rasa aman baru di SAVE.
  • lihat hasil nya


 

cara mudah membuat table di blog

Posted On 21.31 by Muhammad Yahya 0 komentar

cara membuat table ini bisa sedikit membantu.

Langsung saja supaya cepat ingat kita buat saja table nya.
Tag yang biasa digunakan untuk membuat table:
    <Table></Table> <tr></tr> Merupakan baris table. <td></td> Jumlah kolom dalam baris table yang letaknya di dalam tr
Di bawah ini adalah contoh satu baris table dengan jumlah kolom:

Satu baris table dengan satu kolom table:
Tag yang kita buat seperti ini:

<table border="1" width="200">
<tr>
<td>Kolom 1</td>
</tr>
</table>
Maka akan menghasilkan seperti ini:
Kolom 1

Satu baris table dengan dua kolom table:
Tag yang kita buat seperti ini:

<table border="1" width="200">
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
</table>
Maka akan menghasilkan seperti ini:
Kolom 1Kolom 2
Jika membuat lebih dari satu baris, misalnya di sini kita buat dua baris dengan beberapa jumlah kolomnya.

Dua baris table dengan masing -masing satu kolom table:
Tag yang kita buat seperti ini:

<table border="1" width="200">
<tr>
<td>Kolom 1</td>
</tr>
<tr>
<td>Kolom 1</td>
</tr>
</table>
Maka akan menghasilkan seperti ini:
Kolom 1
Kolom 1

Dua baris table dengan masing-masing dua kolom table:
Tag yang kita buat seperti ini:

<table border="1" width="200">
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
</table>
Maka akan menghasilkan seperti ini:
Kolom 1Kolom 2
Kolom 1Kolom 2
Sekarang kita coba dengan memberi atribut cellspacing dan
cellpandding.
Cellspasing : adalah jarak antara kolom.
Cellpadding : adalah jarak di dalam kolom.
Kita tambahkan juga colspan yaitu untuk menyesuaikan dari jumlah cell
yang ada.
Di bawah ini adalah sebuah table dengan 4 cell.

<table border="1" width="500" cellpadding="4" cellspacing="5">
<tr>
<td align="center" colspan="4">Table</td>
</tr>
<tr>
<td align="center">cell 1</td>
<td align="center">cell 2</td>
<td align="center">cell 3</td>
<td align="center">cell 4</td>
</tr>
</table>

Table
cell 1cell 2cell 3cell 4

Kita juga bisa memberi warna ( bgcolor).


<table bgcolor="#9933cc" border="0" cellpadding="4" cellspacing="5" style="width:500px;">
<tr>
<td align="center" bgcolor="#006699" colspan="3">Table</td>
</tr>
<tr>
<td align="center" bgcolor="#666633">cell 1</td>
<td align="center" bgcolor="#666633">cell 2</td>
<td align="center" bgcolor="#666633">cell 3</td>
</tr>
</table>

Table
cell 1cell 2cell 3
Biar ingat lagi coba perhatikan fungsi dari colspan diatas.

Untuk lebih detailnya mungkin kita bisa buat sebuah tabel misalnya seperti daftar harga di bawah ini:
Kita tambahkan juga tag <th>... </th> (Table head) dan
<caption>....</caption> (Title).

<table align="left" border="2" bgcolor=#FF3366" cellpadding="5"
cellspacing="0"><caption align="top" color="FF3366"><b>Daftar
harga</b></caption>
<tr >
<th colspan="1" bgcolor="#0066FF">No</th>
<th colspan="1" bgcolor="#0066FF">Kode stok</th>
<th colspan="1" bgcolor="#0066FF">Nama barang</th>
<th colspan="1" bgcolor="#0066FF">Gol.</th>
<th colspan="2" bgcolor="#0066FF">Harga jual / satuan</th>
</tr>
<tr>
<td bgcolor="#006600">1. </td>
<td bgcolor="#006600">Cm </td>
<td bgcolor="#006600">Computer </td>
<td bgcolor="#006600">HD </td>
<td bgcolor="#006600">3.300.000 </td>
<td bgcolor="#006600">Unit </td>
</tr>
<tr>
<td bgcolor="#006600">2. </td>
<td bgcolor="#006600">tv </td>
<td bgcolor="#006600">Televisi </td>
<td bgcolor="#006600">ET </td>
<td bgcolor="#006600">2.300.000 </td>
<td bgcolor="#006600">Unit </td>
</tr>
<tr>
<td bgcolor="#006600">3. </td>
<td bgcolor="#006600">Rd </td>
<td bgcolor="#006600">Radio </td>
<td bgcolor="#006600">Vs </td>
<td bgcolor="#006600">1.300.000 </td>
<td bgcolor="#006600">Unit </td>
</tr>
<tr>
<td bgcolor="#006600">4. </td>
<td bgcolor="#006600">gbr </td>
<td bgcolor="#006600">baby </td>
<td bgcolor="#006600"><img src="alamat gambar"> </td>
<td bgcolor="#006600"><img src="alamat gambar"></td>
<td bgcolor="#006600"><img src="alamat gambar"></td>
</tr>
</table>

Daftar harga
NoKode stokNama barangGol.Harga jual / satuan
1.CmComputerHD3.300.000Unit
2.tvTelevisiET2.300.000Unit
3.RdRadioVs1.300.000Unit
4.gbrbaby













Kita juga bisa memasukkan alamat gambar ke dalam table.

Semoga bermanfaat.



 

cara mudah menambah scroll pada komentar

Posted On 21.28 by Muhammad Yahya 0 komentar

Bagi sobat yang tidak ingin pada kolom komentar terlihat memanjang ke bawah karena sering kebanjiran komentar, bisa menambah fungsi scroll pada kolom komentar. Untuk membuatnya sobat cukup menambahkan sedikit kode.

Caranya:
  • Masuk ke blogsobat.
  • Pilih tata letak.
  • Klik edit HTML.
  • Beri tanta pada Expand Template Widget.
  • Ini adalah kode yang harus ditambahkan.

    <div class="scrollbox" style="overflow:auto; height:350px; width:600px;">
    .............................................


 

cara menampilkan judul halaman saja

Posted On 21.25 by Muhammad Yahya 0 komentar

J
ika kita klik kategori label, archive atau memasukkan kata kunci pada kolom pencarian yang telah terpasang di blog kita, biasanya akan muncul beberapa judul posting beserta isi halaman. Tentu saja ini akan memakan waktu yang cukup lama untuk loading. Apa lagi jika kita sudah mempunyai banyak postingan.
Sebenarnya kita bisa mengatasi hal ini dengan hanya menampilkan judul halaman posting saja tanpa menyertakan isi dari halaman tersebut.
Jika sobat tertarik bisa ikuti cara di bawah ini:
  • Masuk ke blog sobat.
  • Klik tata letak.
  • Pilih edit HTML.
  • Beri tanda pada Expand Template Widget
  • Cari Kode seperti di bawah ini.

    <b:include data='pos' name='post/>
  • Hapus dan ganti kode di atas dengan kode di bawah ini:

    <b:if cond='data:blog.homepageUrl != data:blog.url'>
    <b:if cond='data:blog.pageType != "item"'>
    <a expr:href='data:post.url'>
    <data:post.title/></a><br/><br/>
    <b:else/>
    <b:include data='post' name='post'/>
    </b:if>
    <b:else/>
    <b:include data='post' name='post'/>
    </b:if>
  • Klik simpan.
  • Lihat hasilnya.



 

cara membuat label untuk blog

Posted On 21.21 by Muhammad Yahya 0 komentar

dengan membuat sebuah kategori label. Sebenarnya blogger sudah menyediakan fasilitas ini,namun bagi sobat yang baru bikin blog dan masih belum tahu cara membuatnya bisa ikuti cara di bawah ini :


  • Masuk ke blog sobat
  • Klik edit entri
  • Beri tanda pada judul-judul posting yang ingin sobat kelompokkan menjadi satu kategori.
    Misal: Saya ingin mengelompokan tentang cara membuat menu,maka saya akan beri tanda pada--> Cara membuat menu dropdown-- > Cara membuat menu horizontal -- > Cara membuat kategori label... dan seterusnya.
  • Jika sudah diberi tanda Klik Aksi label.
  • Pilih dan klik label baru.
  • Jika keluar jendela pop up masukkan nama kategori yang sobat inginkan. Misal: Cara membuat menu.
  • Kemudian klik ok.
  • Maka pada samping kiri aksi label akan muncul label dengan nama yang telah sobat buat tadi.
Untuk mengelompokkan kategori selanjutnya sobat bisa ulangi lagi seperti cara di atas.Beri tanda pada judul posting..> Klik aksi label..> Pilih label baru..> Beri nama ..> klik ok.
Dari sini mungkin sobat sudah paham.
Sekarang kita beralih tentang bagaimana cara memasang widget kategori lebelpada sidebar milik sobat.
  • Klik tata letak.
  • Klik Tambah gadget,maka akan terbuka jendela pop up.
  • Klik gambar yang bertuluskan lebel untuk ditambahkan. Maka akan muncul konfigurasi lebel.
    Judul : Beri judul lebel,misal pilih katagori.
    Tampilkan : jika ingin menampilkan semua pilih dan beri tanda pada semua lebel.
    Tampilan terserah sobat ingin model daftar/list bisa juga cloud.
Note :
  • Jika sobat ingin menambahkan postingan baru dan ingin menggabungkan pada salah satu kategori,sobat tinggal beri tanda postingan tersebut seperti di atas kemudian klik aksi label dan pilih judul di mana sobat ingin menambahkan posting baru tersebut.
  • Memasang kategori lebel ini selain memudahkan pengunjung blog, juga mempermudah sobat jika nanti ingin menganti model kategori label dengan model yang lain.


 

cara seting blogger

Posted On 21.06 by Muhammad Yahya 0 komentar

Bagi sahabat yang baru buat blog ingin blognya di kenal dan lebih akrab dengan mesin pencari milik google,kita perlu melakukan beberapa pengaturan setting


-->Masuk ke blog sobat.-->Pilih pengaturan.
1. Klik Dasar
  • Isi dengan judul blog milik sobat. Misal : Belajar ngeblog yuk.
  • Uraian: Isi dekripsi sobat. Misal : Ini adalah blog pertama saya...dan seterusnya.
  • Tambahkan blog anda ke daftar kami : Pilih ya.
  • Biarkan mesin pencari menemukan blog anda : Pilih ya.
  • Tampikan Editing cepat di blog anda : pilih ya.
  • Tampilkan link posting email : Terserah sobat,tapi sebaiknya pilih ya.
  • Konten dewasa : Pilih tidak.
  • Pilih editor entri : Pilih editor yang diperbaharui.
  • Aktifkan transliterasi : Pilih Nonaktifkan.
  • Klik simpan.
2. Klik Publikasikan.
  • Alamat Blog*Spot : Isi alamat blog sobat. Jika sudah terisi biarkan saja.
  • Verifikasi kata : Masukkan karakter yang ada dalam gambar.
  • Klik Simpan.
3. Klk Format.
  • Tampilkan : Masukkan jumlah posting yang ingin sobat tampilkan. Misal 3 posting.
  • Format Header Tanggal : Terserah model format yang sobat suka.
  • Format Tanggal Index Arsip : Pilih model yang sobat sukai
  • Format Timestamp : Pilih yang sobat suka.
  • Zona Waktu : Misal untuk jakarta (GMT+07:00) Jakarta.
  • Bahasa : Pilih bahasa yang sesui bahasa blog sobat.
  • Konversi ganti baris : Pilih ya.
  • Tanpilkan Field Judul : Pilih ya.
  • Tampilkan kolom link : Pilih tidak.
  • Aktifkan perataan Float : Pilih ya.
  • Klik Simpan.
4. Klik Komentar.
  • Komentar : Pilih tampilkan.
  • Siapa yang bisa berkomentar : Pilih siapapun. Agar semua bisa berkomentar.
  • Penempatan Formulir Komentar : Pilih di semat di bawah entri.
  • Default Komentar untuk Entri : Pilih Entri Baru Memiliki Komentar.
  • Taut balik : Pilih tampilkan.
  • Bawaan Taut balik : Pilih Entri baru memiliki taut balik.
  • Format Timestamp Komentar : Pilih yang sobat suka.
  • Moderasi komentar : Sebaiknya tidak.
  • Tampilkan verifikasi kata untuk komentar : Untuk menghindari spam Pilih ya. 
  • Tampilkan gambar profil dalam komentar : Pilih ya.
  • Email pemberitahuan Komentar : Masukkan Email milik sobat, supaya setiap kali ada komentar sobat mendapatkan email. 
  • Klik Simpan.
5. Klik Arsipkan.
  • Frekuensi Arsip : Pilih tiap bulan.
  • Aktifkan halaman posting : Pilih ya.
  • Klik Simpan.
6. Klik Feed Situs.
  • Izinkan Feed Blog : Pilih penuh.
  • Posting URL Pengubahan Arah Feed : Misal feed burner.jika belum punya kosongkan.
  • Footer Feed Posting : Isi dengan kode iklan milik sobat. Jika belum punya kosongkan.
  • Klik Simpan.


 

Cara uplod photobucket

Posted On 21.04 by Muhammad Yahya 0 komentar

Photobucket adalah tempat menyimpan gambar atau foto album secara online. Jika sobat ingin upload gambar atau foto secara gratis bisa menggunakan layanan ini.Yang nantinya sobat bisa buka file gambar pada layanan ini kapan saja dan di manapun berada dengan syarat harus terhubung dengan internet. Ya..iyalah..!!

Jika sobat tertarik caranyapun cukup mudah,dengan bermodal email kita bisa langsung mendaftar. Sobat bisa langsung menuju ke lokasi melalui klik logo di bawah ini.

 
    Pada tahap pertama.
  • Klik pada Join now !
  • Masukkan User name : terserah nama sobat yang nantinya untuk login.
  • Masukkan Password:terserah yang mudah sobat ingat.
  • Ulangi masukkan password/Re-type password. 
  • Klik Next stepTahap selanjutnya.
  • Masukkan Nama pertama sobat.
  • Masukkan Nama kedua sobat.
  • Masukkan email milik sobat
  • Pilih gender male atau female.
  • Masukan bulan tanggal tahun kelahiran.
  • Masukan kode post.
  • Lihat kode chaptcha dan masukkan pada Re-type it here.
  • Klik I accept. Sign me up!
    Jika berhasil masuk berarti sobat sudah terdaftar.
  • Klik My Home.
  • Lihat pada Upload images & vidios.
    Sobat bisa pilih mau upload dari mana,jika memilih dari computer beri tanda pada My computer.
  • Kemudian klik pada Upload images & vidios.
  • Klik dua kali gambar yang ingin sobat Upload.
  • Tunggu sampai proses upload selesai.
  • Jika upload selesai sobat bisa masukkan title,description dan tag.
  • Untuk mendapatkan kodenya klik save & get link.
  • Kemudian bisa kembali ke return to album
  • selamat mencoba


 

cara membuat widget hanya halaman selanjut nya

Posted On 21.01 by Muhammad Yahya 0 komentar

Jika tidak ingin ini terjadi sobat bisa mengatur dari letak widget-widget tersebut.Misalnya sobat ingin menampilkan widget hanya pada halaman muka saja dan tidak akan tampil pada halaman selanjutnya.
Sobat bisa ikuti cara di bawah ini:
  • Masuk ke blog sobat.
  • Pilih tata letak..
  • Klik edit html.
  • Beri tanda pada Expand Template Widget.
  • Cari kode seperti di bawah ini.
    Ini adalah contoh widget yang berada pada kolom sidebar.
    <div id='sidebar-wrapper'> <b:section class='sidebar' id='sidebar' preferred='yes'> <b:widget id='HTML7' locked='false' title='' type='HTML'> <b:includable id='main'> <b:if cond='data:blog.homepageUrl==data:blog.url'><!-- only display title if it's non-empty --> <b:if cond='data:title != ""'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div> </b:if><b:include name='quickedit'/> </b:includable> </b:widget> Kode yang berwarna merah adalah kode yang harus sobat tambahkan.
  • Klik pratinjau.
  • Jika sudah tekan simpan.Ini akan lebih mudah jika kita memberi judul pada tiap widget yang nanti akan muncul pada title.
    Tapi sebenarnya setiap kali kita pasang widget akan diberi tanda:
    <b:widget id='HTML1' locked='false' title='' type='HTML'> atau
    <b:widget id='HTML2' locked='false' title='' type='HTML'> dan seterusnya.
Silahkan dicoba 


 

cara membuat menu text berjalan di bar

Posted On 20.59 by Muhammad Yahya 0 komentar

Menu judul atau title bar ini letaknya ada di atas dan di pojok kiri pada browser milik sobat. Jika ingin title bar tersebut nampak berjalan,sobat bisa tambahkan kode script seperti di bawah ini:

<script language="JavaScript">
var txt=" SELAMAT DATANG ";
var kecepatan=200;var segarkan=null;function bergerak(){ document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</script>


CARA MEMASUKKAN KODENYA:
  • Yang pasti login dulu ke blog sobat.
  • Klik tata letak.
  • Pilih edit html.
  • Cari kode </head.>
  • Jika sudah ketemu masukkan kode diatas tadi tepat di atas kode </head.>
  • Yang bisa sobat edit:
    Kata SELAMAT DATANG bisa dirubah sesui keinginan sobat.
    Nilai kecepatan semakin tinggi semakin lambat jalannya.
    Supaya kata yang berjalan tidak berhimpitan beri spasi pada sebelum atau sesudah kata SELAMAT DATANG.
  • Pratinjau dulu kemudian simpan


 

cara membuat show di blog

Posted On 20.55 by Muhammad Yahya 0 komentar

Fungsi dari spoiler ini adalah untuk menampilkan (show) atau menyembunyikan (hide) image maupun text pada halaman posting atau bisa juga di letakkan pada sidebar. Untuk menghemat tempat biasanya para blogger menyiasati dengan menggunakan spoiler tersebut. Bagi sobat yang ingin membuat spoiler dan belum tahu caranya bisa ikuti cara ini:

Di bawah ini adalah kode yang bisa sobat gunakan untuk membuat spoiler:
<div id="spoiler"><div><input style="margin: 10px; padding: 0px; height:60px; font-size: 50px; font-weight:bold;" value="OPEN" onclick="if
(this.parentNode.parentNode.getElementsByTagName('div') ['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')
['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')
['hide'].style.display= 'none'; this.innerText = ''; this.value = 'CLOSE'; } else { 
this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display= ''; this.innerText = ''; this.value = 'OPEN'; }" type="button"/><div id="show" style="border: 5px; solid red; margin 5px; padding: 2px; display: none; width: 90%;">
Sobat bisa memasukkan text atau alamat gambar di sini.
<br>
<img src="http://i761.photobucket.com/albums/xx252/darma_bucket/th_garudajpn.png"a>
</div><div id="hide"></div></div></div>

Ganti yang berwarna merah dengan text atau alamat gambar sobat.
Di bawah ini adalah hasil dari kode-kode di atas.
Silahkan diklik untuk melihat hasilnya.