Macam Macam Div Style

Diposting oleh Unknown on Sabtu, 04 Februari 2012

Macam Macam Div Style | Tutorial Blog

Pada postingan ini saya akan berbagi tentang beberapa kode untuk membuat Div Style. Langsung saja Sob, berikut kodenya :
  • Kode :
    <div style="border: 2px solid blue;"> <div style="border: 3px solid red;"> <div align="center"> Tulis Text Disini</div> </div> </div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 4px solid yellow;"> <div align="center"> <span style="color: coral;">Tulis Text Disini</span></div> </div>
    Hasilnya
    Tulis Text Disini
  • Kode :
    <div style="border: 3px double #ff0000; padding: 5px;"><div align="center">Tulis Text Disini</div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 3px double #0000ff; padding: 5px;"><div style="border: 2px solid #0077ff; padding: 5px;"><div align="center">Tulis Text Disini</div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border-color: lime; border-style: dotted; border-width: 2px; margin: 1px; padding: 1px;"><center>Tulis Text Disini</center></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border-style:inset;border-width:5pt;border-color:black" align="center">Tulis Text Disini</div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="background: #bbddff; border: 5px outset#c0c0c0; margin: 0px; padding: 5px;"><div align="center">Tulis Text Disini</div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 2px solid#220000;"><div style="border: 2px solid#dddddd;"><div style="border: 4px solid#220000;"><div style="border: 2px solid#dddddd;"><div style="border: 2px solid#220000;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 1px solid#2222ff;"><div style="border: 1px solid#3333ff;"><div style="border: 1px solid#4444ff;"><div style="border: 1px solid#5555ff;"><div style="border: 1px solid#2222ff;"><div style="border: 1px solid#3333ff;"><div style="border: 1px solid#4444ff;"><div style="border: 1px solid#5555ff;"><div style="background-color: #44ccff;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 3px solid#2222ff;"><div style="background-image: url('http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/linerbn.gif'); border: 0px; margin: 2px; padding: 2px;"><div style="background-color: #cccccc;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 1px solid#001100;"><div style="border: 1px solid#002200;"><div style="border: 1px solid#003300;"><div style="border: 1px solid#004400;"><div style="border: 1px solid#005500;"><div style="border: 1px solid#006600;"><div style="border: 1px solid#007700;"><div style="border: 1px solid#008800;"><div style="border: 1px solid#009900;"><div style="border: 1px solid#00aa00;"><div style="border: 1px solid#009900;"><div style="border: 1px solid#008800;"><div style="border: 1px solid#007700;"><div style="border: 1px solid#006600;"><div style="border: 1px solid#005500;"><div style="border: 1px solid#004400;"><div style="border: 1px solid#003300;"><div style="border: 1px solid#002200;"><div style="border: 1px solid#001100;">
    <div align="center"><span style="color: red;">Tulis Text Disini</span></div>
    </div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
Sepertinya segitu dulu Sob, kalau ada yang mau menambahkan silakan tulis di komentar.
Silakan dicoba dan semoga berhasil...
More about → Macam Macam Div Style

Cara Pasang Burung Tweet Di Blogger

Diposting oleh Unknown on Jumat, 03 Februari 2012

Cara pasang burung tweet di blogger cukup mudah, gak repot, tinggal kopi kode di bawah dan langsung jadi.
  • Klik Design > Page Element > Add Gadget > Html/Javascript
  • Copy paste kode di bawah ini ke kolom Html/javascript
Berikut kode burung tweet :


<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXrLxlZR2Gb2EihcSdntfRbhWKWr9CYRsZTgnM5Maj5oQiAZ4GfljSiCI_455NlkSvn0EuUAKgOsoJkFnorLvjverBIdGPqpgr8TIJx9neUjnAmw5iEIC-CQzYFJilHVfa2uW1mSub60/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/Akun Twitter sobat";
var tweetThisText = "Twitter - UserID http://sagoeba.blogspot.com/";
tripleflapInit();
</script>
<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXrLxlZR2Gb2EihcSdntfRbhWKWr9CYRsZTgnM5Maj5oQiAZ4GfljSiCI_455NlkSvn0EuUAKgOsoJkFnorLvjverBIdGPqpgr8TIJx9neUjnAmw5iEIC-CQzYFJilHVfa2uW1mSub60/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/Akun Twitter sobat";
var tweetThisText = "Twitter - UserID http://sagoeba.blogspot.com/";
tripleflapInit();
</script>

Keuntungan pasang burung tweet di blogger selain kelihatan menarik, sobat semua nanti bakal banyak yang mengikuti akun tweeternya.
Seperti sobat ketahui  tweeter salah satu pesaing face Book terutama di Indonesia, jadi kalo sobat pasang burung tweet di blogger sobat bukannya rugi tapi malah untung untuk memperkenalkan akun sobat. Begitulah kira - kira menurut saya, maaf bila salah..hehe
More about → Cara Pasang Burung Tweet Di Blogger

Tips Menampilkan Thread Comment pada Custom Template

Diposting oleh Unknown on Rabu, 01 Februari 2012

Menampilkan Thread Comment pada Custom Template | Tutorial Blog

Thread Comment merupakan fitur baru dari blogger yang telah resmi diluncurkan pada 12 januari yang lalu, fitur ini otomatis berlaku pada blog yang menggunakan tampilan dynamic views, jadi untuk tampilan klasik dan custom template fitur ini tidak otomatis di tampilkan.

Pada postingan kali ini saya akan membuat tutorial tentang cara Menampilkan Thread Comments pada Custom Template, trik ini terbukti berhasil pada template saya ini, walaupun pada template saya sebelumnya trik ini malah mambuat halaman posting saya hilang, jadi sebaiknya backup dulu template Anda sebelum di edit.
Berikut cara Menampilkan Thread Comment pada Custom Template :
  • Login ke Blogger, Klik Design/Rancangan > Edit HTML.
    Menampilkan Thread Comment pada Custom Template
  • Beri tanda centang pada Expand Template Widget.
    Menampilkan Thread Comment pada Custom Template
    Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
  • Cari kode <b:include data='post' name='comments'/>, pada template saya kode tersebut ada 4 dan saya ganti semua dengan kode berikut :
              <b:if cond='data:post.showThreadedComments'>
                <b:include data='post' name='threaded_comments'/>
              <b:else/>
                <b:include data='post' name='comments'/>
              </b:if>
  • Terakhir klik Save / Simpan Template.
    Menampilkan Thread Comment pada Custom Template
Silakan dicoba Sob, semoga Anda berhasil Menampilkan Thread Comment pada Custom Template.
More about → Tips Menampilkan Thread Comment pada Custom Template