Cara Membuat Garis Tepi Pada Latar Posting dan Sidebar

selamat datang sobat dalam hal ini sebenarnya membuat garis tepi pada latar postingan dan sidebar sangatlah mudah dari template lanjutan. akan tetapi jika template blog di ganti dengan template lainnya kadang garis tepi pada postingan dan sidebar tidak ada makanya saya beri 1 cara tentang;<br /> <ul><ul> <li><b>Cara Membuat Garis Tepi Pada Latar <span style="color: blue;">Posting</span></b></li> </ul> </ul> <ul> <li><span style="font-size: small;"><span>Login ke Blogger pilih menu <span style="color: red;">TATA LETAK</span>, lalu <span style="color: red;">EDIT HTML</span>.</span></span></li> <li><span style="font-size: small;"><span>Cari kode </span><span style="color: red;">]]></b:skin></span><span> </span></span></li> <li><span style="font-size: small;"><span> Lalu copy kode dibawah ini tepat diatas kode  </span><span style="color: red;">]]></b:skin></span></span></li> </ul> <span style="font-size: small;"><b>.</b><span>post {-moz-border-radius: <span style="color: blue;">10px </span>; -webkit-</span><span>border-radius: <span style="color: blue;">10px </span>; </span><span>border-radius: <span style="color: blue;">10px </span>; </span> <span>padding:10px; border: <span style="color: blue;">1px</span> solid #ff0000; }</span></span><br /> <ul><ul> <li><span style="font-size: small;"><span> </span></span><b>Pada Latar <span style="color: blue;">Sidebar </span></b></li> </ul> </ul> <b><span style="color: blue;"></span></b><ul> <li><span style="color: blue;"><span style="color: black;"><span style="font-size: small;">Selanjutnya sobat cari kode <span style="color: blue;"><b>.sidebar .widget { </b></span>menggunakan CTRL +F (kode tersebut ada terusannya)</span></span></span><b><span style="color: blue;"> </span></b></li> <li> letakkan kode di bawah ini persis setelah kode <b>.sidebar .widget { </b>tadi.</li> </ul> <span style="color: red; font-family: inherit;"><span style="line-height: 18px;">border: 1px solid #eee;</span></span> <br /> <span style="font-size: xx-small;"> </span><br />sehingga menjadi <span style="color: red; font-family: inherit;"><span style="line-height: 18px;">.sidebar .widget {</span></span><span style="font-family: inherit;"><span style="line-height: 18px;"><span style="color: red;">border-left: </span><span style="color: blue;"><b>2</b></span><span style="color: red;">px solid </span><span style="color: blue;">#eee</span><span style="color: red;">;</span></span></span><br /> <br /> <span style="font-family: inherit;"><span style="line-height: 18px;"><span style="color: red;"><span style="color: black;">simpan dan lihat hasilnya,,,,</span> </span></span></span><span style="color: red; font-family: inherit;"><span style="line-height: 18px;"></span></span>

Cara Membuat Garis Tepi Pada Latar Posting dan Sidebar

kang maryono 1 March 31, 2014

selamat datang sobat dalam hal ini sebenarnya membuat garis tepi pada latar postingan dan sidebar sangatlah mudah dari template lanjutan. akan tetapi jika template blog di ganti dengan template lainnya kadang garis tepi pada postingan dan sidebar tid… baca selengkapnya

baca selengkapnya

Membuat Efek Tulisan Bayangan Pada Judul Blog

<div style="text-align: justify;"> </div> <div style="text-align: justify;"> <ul> <li> <span style="font-size: small;"><b>Cara membuat </b></span><span style="font-size: x-small;"><span style="font-size: small;">tulisan bayangan pada <span class="IL_AD" id="IL_AD1">judul blog</span></span>.</span> Sebenarnya tidak hanya dijudul blog yang bisa diberi tulisan bayangan, tapi semua tulisan yang ada di blog juga bisa kita beri tulisan bayangan. Tapi yang harus kita ketahui terlebih dahulu adalah kode html pada bagian-bagian blog, setelah ketemu dengan kodenya baru bisa kita beri tulisan bayangan.</li> </ul> </div> <div style="text-align: justify;"> </div> <div style="text-align: justify;"> Ikuti langkah-langkah dibawah ini.</div> <h2> <span style="font-size: x-small;">Text Bayangan di Judul Blog</span></h2> <ul> <li><span class="IL_AD" id="IL_AD9">Login</span> ke blog, dan ke pengaturan Template</li> <li><span class="IL_AD" id="IL_AD2">Klik</span> edit HTML, dan cari kode <span style="color: blue;">.Header h1 {</span> lengkapnya seperti dibawah ini.</li> </ul> <blockquote class="tr_bq"> <blockquote class="tr_bq"> <span style="color: blue;">.Header h1 {</span><br />   font: $(header.font);<br />   color: $(header.text.color);<br />   text-shadow: 0 0 $(title.shadow.spread) #000000;<br /> } </blockquote> </blockquote> <ul> <li>Setelah ketemu dengan kode diatas maka tambahkan kode <span style="color: red;">text-shadow: 2px 2px 5px #800000;</span> Jadi kode lengkapnya seperti dibawah ini.</li> </ul> <blockquote class="tr_bq"> <blockquote class="tr_bq"> <span style="color: blue;">.Header h1 {</span><br />   font: $(header.font);<br />   color: $(header.text.color);<br />   text-shadow: 0 0 $(title.shadow.spread) #000000;<br /> <span style="color: red;">text-shadow: 2px 2px 5px <span style="color: lime;">#800000</span>;</span><br /> }</blockquote> </blockquote> <ul> <li>klik simpan dan lihat hasilnya jika pengen merubah warna garis tepi silahkan ganti <span style="color: red;"><span style="color: lime;">#800000</span></span> dengan kode warna yang sobat inginkan</li> </ul> nah mudah bukan sobat cara buat efek bayangan pada judul blog

Membuat Efek Tulisan Bayangan Pada Judul Blog

kang maryono 0 March 31, 2014

Cara membuat tulisan bayangan pada judul blog. Sebenarnya tidak hanya dijudul blog yang bisa diberi tulisan bayangan, tapi semua tulisan yang ada di blog juga bisa kita beri tulisan bayangan. Tapi yang harus kita ketahui terlebih dahulu adalah ko… baca selengkapnya

baca selengkapnya

cara membuat populer post dengan widget

<b>Membuat Artikel Terpopuler dengan Widget HTML/JavaScript</b>. Caranya mudah, kamu tinggal menambahkan most popular post pada <span class="d7h64zu" id="d7h64zu_6">sidebar</span> <span class="d7h64zu" id="d7h64zu_3">blog</span> kamu. Dengan adanya widget ini, selain kamu bisa melihat artikel-artikel yang banyak direspon pembaca, juga dapat menarik pembaca lain untuk lebih mengetahuinya lebih lanjut.<br /> Siapa tahu karena banyaknya komentar pada artikel tersebut akan membuat orang tertarik untuk turut membacanya. Nah, jika kamu tertarik untuk membuatnya, ikuti saja langkah-langkah berikut:<br /> <br /> <br /> <ul> <li> Dari halaman <b>dasbor</b>, pilih <b>Tata Letak - Elemen Halaman</b>.</li> <li> Klik <b>Tambah Gadget</b> dan pilih <b>HTML/JavaScript</b>.</li> <li> Masukkan (copy-paste) <i>script</i> berikut <i>(gunakan <span class="d7h64zu" id="d7h64zu_5">Control</span> C)</i>:</li> </ul>   <span style="background-color: #cfe2f3;"><script language="javascript"><br />titlebold=<span style="color: red;">false</span>;<br />numposts=<span style="color: red;">9999</span>;<br />maxshowresult=<span style="color: red;">10</span>;<br />explanation="<span style="color: red;">respon</span>";<br />home_page="<span style="color: red;">dagujang</span>.blogspot.com";<br /></script><br /><script style="text/javascript" src="http://textuploader.com/13ju/raw"></script> </span><br /> <ul> <li><b>Keterangan:</b><br /><span style="color: blue;">titlebold</span> = Judul artikel. Jika ingin judul artikel ditampilkan dengan cetak tebal, ganti <span style="color: red;">false</span>-nya dengan <i>true</i>.<br /><span style="color: blue;">numpost</span> = Banyaknya artikel yang dijadikan referensi.<br /><span style="color: blue;">maxshowresult</span> = Maksimum artikel yang ditampilkan. Kamu bisa mengubahnya menjadi kurang atau lebih dari 10.<br /><span style="color: blue;">explanation</span> = Keterangan. Kamu dapat mengubah <span style="color: red;">respon</span> menjadi comments, komentar, komen, komeng, atau bisa juga kamu kosongkan. <br /><span style="color: blue;">home_page</span> = Alamat situs. Ganti <span style="color: red;">dagujang</span> dengan nama blog kamu. Tapi awas, jangan pake http:// !</li> <li> Setelah selesai, simpan hasilnya </li> </ul>

cara membuat populer post dengan widget

kang maryono 1 March 25, 2014

Membuat Artikel Terpopuler dengan Widget HTML/JavaScript. Caranya mudah, kamu tinggal menambahkan most popular post pada sidebar blog kamu. Dengan adanya widget ini, selain kamu bisa melihat artikel-artikel yang banyak direspon pembaca, juga dapat … baca selengkapnya

baca selengkapnya

membuat judul blog bergerak di tab

Membuat tulisan berjalan sudah pernah kita pelajari bersama, yaitu dengan menambahkan sedikit menambahkan kode html, Sekarang kita juga akan belajar untuk membuat blog kita lebih menarik lagi dengan hal yang sama, tetapi yang berjalan kali ini adalah judul blog kita.<br /> <br /> Maaf sobat bukan judul langsung bergerak tapi judul yang ada di tab atas, ini sedikit tips untuk sobat dengan cara membuat judul blog di tab bergerak, yaitu kita dapat membuat efek judul blog kita lebih menarik.<br /> <br /> <b>Cara Membuat Judul Blog Berjalan <br /> </b><br /> 1. Pilih <b>tata letak</b> kemudian <b>edit html</b><br /> 2. Jangan lupa beri tanda centang pada <b>Expand Template Widget</b><br /> 3. Cari kode berikut <b><title><data:blog.pageTitle/></title></b><br /> 4. Jika sudah ketemu, ganti kode tersebut dengan kode berikut ini<br /> <br /> <div class="alert"> <script language='JavaScript'><br /> var txt="<data:blog.pageTitle/>";<br /> var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;<br /> txt=txt.substring(1,txt.length)+txt.charAt(0);<br /> segarkan=setTimeout("bergerak()",kecepatan);}bergerak();<br /> </script></div> <br /> 5. Lihat apakah berhasil dengan (PRATINJAU) jika berhasil <b>SIMPAN</b><br /> mudah bukan sobat cara membuat judul blog berjalan di nasbar

membuat judul blog bergerak di tab

kang maryono 1 March 20, 2014

Membuat tulisan berjalan sudah pernah kita pelajari bersama, yaitu dengan menambahkan sedikit menambahkan kode html, Sekarang kita juga akan belajar untuk membuat blog kita lebih menarik lagi dengan hal yang sama, tetapi yang berjalan kali ini adal… baca selengkapnya

baca selengkapnya

cara mengganti penampilan kotak komentar

Sebuah kotak komentar juga bisa mempengaruhi pengunjung blog jika<br /> kolom kotak komentar kita menarik tentunya juga pengunjung lebih suka untuk berkunjuk ke blog kita maka dari itu cara mempercantik kotak komentar kita perlukan,<br /> ini salah satu cara merubah kotak komentar pada blog caranya;<br /> masuk ke blog sobat<br /> <div> >> Template >> Edit HTML.</div> <div> </div> <div> Cari kode <span style="color: red;">]]></b:skin></span></div> <div> </div> <div> Copy kode yang ada di bawah, kemudian letakkan <b>di atas</b> kode <span style="color: red;">]]></b:skin></span></div> <br /> <div style="margin-bottom: 2px;"> <span style="color: #6666cc;"> </span> <br /> <div style="margin-top: 5px; text-align: left;"> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="font-size: 10px; margin-top: 5px; width: 60px;" type="button" value="BUKA" /> </div> <div style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> <div style="height: 200px; overflow: auto; width: ancho;"> <br /> /* Comments<br /> ----------------------------------------------- */<br /> #comments h4 {<br /> font-weight:bold;<br /> color:#000;<br /> background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUCCMaabX6OQ-SLy4BX_ejzkdpNgH1mlb07eMj5kzQwb567rjwtb15k3vxX511NdcHMyveTcuMKZL2VtLKX5KLroCKqfuP3ekvemrglGz1njt_IHO2XNowwok3wiWnXPmaeD75mYJgE9eW/) repeat-x;<br /> height: 35px;<br /> line-height: 35px;<br /> width: 100%;<br /> margin:-5px 0 -7px -10px;<br /> text-align:center;<br /> border-top:1px solid #ddd;<br /> display:block;<br /> padding-bottom:6px ;<br /> line-height:30px;<br /> }<br /> h4#comment-post-message {<br /> display:none;<br /> }<br /> .comments .comments-content {<br /> font-size:12px;<br /> text-align:left;<br /> }<br /> #comments-block {<br /> margin:1em 0 1.5em;<br /> line-height:1.6em<br /> }<br /> #comments-block .comment-author {<br /> margin:.5em 0<br /> }<br /> #comments-block .comment-body {<br /> margin:.25em 0 0<br /> }<br /> #comments-block .comment-footer {<br /> margin:-.25em 0 2em;<br /> line-height:1.4em;<br /> letter-spacing:.1em<br /> }<br /> #comments-block .comment-body p {<br /> margin:0 0 .75em<br /> }<br /> .deleted-comment {<br /> font-style:italic;<br /> color:gray<br /> }<br /> .comments {<br /> font:normal 11px/14px "Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif!important<br /> }<br /> .comments .comments-content .comment,.comments .comments-content .comment:first-child,.comments .comments-content .comment:last-child {<br /> padding:0;<br /> margin:0;<br /> position:relative<br /> }<br /> .comments .avatar-image-container {<br /> width:45px;<br /> height:45px;<br /> max-width:45px;<br /> max-height:45px;<br /> padding:2px;<br /> border-radius:2px;<br /> margin-right:5px;<br /> margin-top:8px;<br /> margin-left:8px;<br /> position:relative;<br /> background-color:white;<br /> z-index: 2;<br /> }<br /> .comments .avatar-image-container img {<br /> max-width:100%;<br /> height:100%<br /> }<br /> .comments .inline-thread .avatar-image-container {<br /> width:38px;<br /> height:38px;<br /> position:relative;<br /> margin:0<br /> }<br /> .comments .comment-block {<br /> margin-left:0;<br /> padding:0 8px;<br /> min-height:90px;<br /> border:1px solid #4173af;<br /> border-radius:2px<br /> }<br /> .comments .inline-thread .comment-block {<br /> margin-left:45px;<br /> padding:0;<br /> border:0;<br /> min-height:initial<br /> }<br /> .comments .comments-content .comment:hover .comment-block {<br /> border:1px solid 4173af;<br /> -moz-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);<br /> -webkit-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);<br /> box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21)<br /> }<br /> .comments .comments-content .comment:hover .inline-thread .comment-block {<br /> border:0;<br /> -moz-box-shadow:none;<br /> -webkit-box-shadow:none;<br /> box-shadow:none<br /> }<br /> .comments .comments-content .comment-replies {<br /> margin-left:20px;<br /> margin-top:5px<br /> }<br /> .comments .comments-content .comment-header,.comments .comments-content .comment-content {<br /> margin:0 0 8px;<br /> padding-left:58px;<br /> text-align:left;<br /> line-height:1.6em;<br /> }<br /> .comments .comments-content .comment-header {<br /> margin-top:8px;<br /> height:14px<br /> }<br /> .comments .comments-content .inline-thread .comment-header,.comments .comments-content .inline-thread .comment-content {<br /> padding-left:8px;<br /> margin-top:0;<br /> text-align:left;<br /> line-height:1.6em;<br /> }<br /> .comment-actions {<br /> position:absolute;<br /> top:64px;<br /> left:10px;<br /> z-index:2<br /> }<br /> .comments .comment .comment-actions a {<br /> background:#0671A1;<br /> border-radius:4px;<br /> position:relative;<br /> display:block;<br /> padding:2px 7px;<br /> color:white;<br /> top:-1px;<br /> font-family:Arial,Sans-serif;<br /> font-weight:bold;<br /> box-shadow:0 1px 1px rgba(0,0,0,0.4);<br /> text-shadow:0 1px 0 rgba(0,0,0,0.3);<br /> -webkit-transition:none;<br /> -moz-transition:none;<br /> -o-transition:none;<br /> -ms-transition:none;<br /> transition:none<br /> }<br /> .comments .comment .comment-actions a:hover {<br /> text-decoration:none;<br /> background-color:#0057ae;<br /> }<br /> .comments .comment .comment-actions a:active {<br /> top:0;<br /> background-color:#0057ae;<br /> }<br /> .comments .comments-content .inline-thread li.comment,.comments .comments-content .inline-thread li.comment:first-child,.comments .comments-content .inline-thread li.comment:last-child {<br /> padding:5px;<br /> border:1px solid #4173af;<br /> margin-bottom:5px;<br /> }<br /> .comments .comments-content .inline-thread {<br /> padding:0<br /> }<br /> .comments .comments-content .comment-thread.inline-thread ol {<br /> padding-top:8px<br /> }<br /> .comments .comments-content .comment-thread.inline-thread ol > div:first-child {<br /> border-left:1px solid #4173af;<br /> padding:10px<br /> }<br /> .comments .comments-content .inline-thread li.comment::before {<br /> content:"";<br /> position:absolute;<br /> width:11px;<br /> height:1px;<br /> background-color:#4173af;<br /> display:block;<br /> left:-12px;<br /> top:12px<br /> }<br /> .comments .comments-content .inline-thread li.comment:last-child {<br /> margin-bottom:0<br /> }<br /> .comments .comments-content .inline-thread li.comment:last-child::after {<br /> content:"";<br /> height:100%;<br /> width:5px;<br /> display:block;<br /> background-color:#FCFCFC;<br /> position:absolute;<br /> top:13px;<br /> left:-13px<br /> }<br /> .comments .thread-toggle.thread-expanded {<br /> position:relative<br /> }<br /> .comments .thread-toggle.thread-expanded::after {<br /> content:"";<br /> display:block;<br /> width:1px;<br /> height:32px;<br /> position:absolute;<br /> background:#4173af;<br /> top:-8px;<br /> left:0<br /> }<br /> .comments .comment .comment-actions .item-control a {<br /> display:none;<br /> background-color:#FCFCFC;<br /> background-position:2px 50%;<br /> background-repeat:no-repeat;<br /> background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGpS-ksR9Vx4kzwHV-gDL8HyBd7d9WTf8yl4nvatxRglPG_SpTSo5VVlK0ata7EPW0sXOymVhLRQqdIjVE_y9ln5D8S926u0Y-1JVt_p8OAVBCcvTYNmZWdW3KBirRR1OKN13xpxzUXQE/s14/Trash.png);<br /> border:1px solid #4173af;<br /> position:absolute;<br /> left:-10px;<br /> text-indent:-9999px;<br /> padding:0;<br /> width:19px;<br /> height:20px;<br /> top:-42px;<br /> border-radius:2px<br /> }<br /> .comments .comments-content .comment:hover .comment-actions .item-control a {<br /> display:block<br /> }<br /> .comments .comments-content .comment:hover .inline-thread .comment-actions .item-control a {<br /> display:none<br /> }<br /> .comments .comments-content .inline-thread li.comment:hover .comment-actions .item-control a {<br /> display:block<br /> }<br /> .comments .inline-thread .comment .comment-actions .item-control a {<br /> left:-61px;top:-35px<br /> }<br /> #comments h4#comment-post-message {<br /> border-bottom:0;<br /> background-color:transparent;<br /> font-size:130%<br /> }<br /> .comment-form {<br /> max-width:100%<br /> }<br /> .comments .comments-content .icon.blog-author {<br /> display: block;<br /> width: 0;<br /> height: 0;<br /> border: 6px solid transparent;<br /> border-color:transparent #0671A1 #0671A1 transparent;<br /> position: absolute;<br /> right: 0;bottom: 4px;<br /> }<br /> .comments .comments-content .inline-thread .icon.blog-author {<br /> bottom:-9px;<br /> right:-5px;<br /> }<br /> .comments .comments-content .user,.comments .comments-content .datetime {<br /> display:inline-block;<br /> float:left<br /> }<br /> .comments .avatar-image-container img[src="http://img1.blogblog.com/img/anon36.png"] {<br /> content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiphJRKHiHRpz2Fzg4Hdt4_rzyN9TLIy0DPTuzt_PtnAgXPye9F4Aq2_wSWoiqBeBcfiJnd-z9m4ni602Rl3EoD2eP-yWq473UuU39j8U4MXvwQksaB7yWrYB9LGSpa1vfe7eY3bn3-LPNH/s70/user-anonymous-icon.png);<br /> }<br /> <br /></div> </div> </div> </div> <br /> klik simpan dan lihat hasilnya..<br /> nah mudah bukan sobat cara mengganti penampilan kotak komentar di blogspot<br /> jangan lupa berkunjung lagi di artikel yang lainnya<br /> terimakasih..<br /> <br /> <br />

cara mengganti penampilan kotak komentar

kang maryono 0 March 20, 2014

Sebuah kotak komentar juga bisa mempengaruhi pengunjung blog jika kolom kotak komentar kita menarik tentunya juga pengunjung lebih suka untuk berkunjuk ke blog kita maka dari itu cara mempercantik kotak komentar kita perlukan, ini salah satu cara mer… baca selengkapnya

baca selengkapnya

buat slide show dengan gadget

<br /> wah kali ini saya mau mengeposkan bagaimana membuat slide show sendiri dan mudah dari berbagai foto dulunya kita harus daftar ke web picasa tau yang lainnya, ini hanya cukup dari blog kita sendiri<br /> begini caranya <br /> <ul> <li>pertama kita siapkan foto yang mau di pasang</li> <li>masuk ke blog  ke laman kosong kemudia upload foto kalian satu persatu tau langsung sekaligus</li> <li>kemudian kita ke tata letak klik <span style="color: blue;">tambahkan gadget</span></li> <li>cari tulisan HTML/Java script klik tanda panahnya<table style="-webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; border-bottom-style: none; border-collapse: collapse; border-color: initial; border-image: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; color: #202020; font-family: arial, sans-serif; font-size: 14px; line-height: 20px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody> <tr><td class="gadgetThumbnail" style="border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; height: 60px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px; vertical-align: text-top; width: 120px;"><a href="http://www.blogger.com/rearrange?blogID=8156928316991217580&sectionId=sidebar-left-1&action=editWidget&widgetType=HTML&referrer=directory" style="color: #1155cc; text-decoration: none;"><img alt="HTML/JavaScript" height="60" src="http://img2.blogblog.com/img/widgets/icon_html.gif" style="border-bottom-color: rgb(51, 102, 204); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-image: initial; border-left-color: rgb(51, 102, 204); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(51, 102, 204); border-right-style: solid; border-right-width: 1px; border-style: initial; border-top-color: rgb(51, 102, 204); border-top-style: solid; border-top-width: 1px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 10px;" width="120" /></a></td><td style="border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px;"><a class="title" href="http://www.blogger.com/rearrange?blogID=8156928316991217580&sectionId=sidebar-left-1&action=editWidget&widgetType=HTML&referrer=directory" style="color: #1155cc; float: left; font-size: 17px; font-weight: bold; text-decoration: none;">HTML/JavaScript</a><a href="http://www.blogger.com/rearrange?blogID=8156928316991217580&sectionId=sidebar-left-1&action=editWidget&widgetType=HTML&referrer=directory" style="color: #1155cc; text-decoration: none;"><img alt="Tambahkan" class="addButton" src="http://www.blogger.com/img/plus.png" style="border-bottom-width: 0px; border-color: initial; border-image: initial; border-left-width: 0px; border-right-width: 0px; border-style: initial; border-top-width: 0px; float: right; line-height: 2.2em;" /></a><br /> <span class="description">Tambahkan fungsional pihak ketiga atau kode lainnya ke blog Anda.</span><br /> Oleh <a class="author" href="http://www.blogger.com/choose-gadget?blogID=8156928316991217580&sectionId=sidebar-left-1&q=Blogger" style="color: #1155cc; text-decoration: none;" title="Gadget lain yang dibuat oleh Blogger">Blogger</a> </td></tr> </tbody></table> </li> <li>kemudian  copy paste kode html di bawah ini</li> </ul> <br /> <div style="background-color: #9fc5e8; height: 250px; overflow: auto; width: ancho;"> <br /> <script src='http://yourjavascript.com/53816065231/Database5.js' type='text/javascript'></script><script type="text/javascript" src="http://yourjavascript.com/65160840132/cycle.js"></script><br /> <script type="text/javascript"><br /> $(document).ready(function() {<br /> $('#content-slider').cycle({<br /> fx: 'fade'<br /> });<br /> });<br /> </script><br /> <style type="text/css"><br /> #content-slider {<br />    position: relative;<br />    width: 100%;<br />    height: 200px;<br />    overflow: hidden;<br />    margin:0 auto;<br /> }<br /> #content-slider img {<br />    display: block;<br />    width: 100%;<br />    height: 200px;<br /> }<br /> </style><br /> <div id="content-slider"><br /> <img src="<span style="color: red;">#</span>" /><br /> <img src="<span style="color: red;">#</span>" /> <br /> <img src="<span style="color: red;">#</span>" /> <br /> <img src="<span style="color: red;">#</span>" /> <br /> </div></div> <br /> <ul> <li>kembali lagi pada laman yang di upload foto tadi klik kanan 1 per 1 di foto  dan copy image URL </li> <li>pastekan pada tanda  <span style="color: red;">#</span> atau ganti dengan URL foto kalian tadi</li> <li>setelah itu simpan dan lihat hasilnya</li> </ul> nah mudah bukan cara pasang gadgetnya semoga kalian berhasil juga selamat mencoba<br /> <br /> <div> sekian dulunya sampai jumpa di pos lainnya</div>

buat slide show dengan gadget

kang maryono 0 March 20, 2014

wah kali ini saya mau mengeposkan bagaimana membuat slide show sendiri dan mudah dari berbagai foto dulunya kita harus daftar ke web picasa tau yang lainnya, ini hanya cukup dari blog kita sendiri begini caranya pertama kita siapkan foto yang mau d… baca selengkapnya

baca selengkapnya

cara menyatukan garis atau bangun 2 atau lebih menjadi satu bagian dalam word

Salam kenal sobat, izinkan saya berbagi ilmu yang sedikit ini,, cara menggabungkan bangun atau garis 2 atau lebih menjadi satu bagian. Ilmu ini berguna bagi ahli matematika untuk membuat bangun yang diperlukan dari penggabungan. Walaupun ini sangat mudah bagi sobat yang sudah bisa caranya tapi yang belum bisa, juga masih kebingungan karena sepertihalnya saya dulu juga bingung,, dan setelah saya mencobanya ternyata sangat mudah sobat.<br /> <br /> Cara menggabungkan beberapa bangun caranya;<br /> <br /> <ul> <li>Buat bangun yang sobat inginkan 2 atau lebih </li> <li>Misalkan persegi panjang dan segitiga</li> <li>Tata bangun tersebut menurut yang diinginkan</li> </ul> <ul> <li>contonya seperti ini;<img alt="" class="" id="yui_3_5_1_1_1395287819281_1596" src="http://ts4.mm.bing.net/th?id=HN.608015443311069335&pid=15.1" style="height: 126px; margin-left: 0px; margin-top: 0px; width: 136px;" /></li> <li>klik pada bangun pertama kemudian dengan menekan tombol ctrl juga klik bangun kedua (jangan sampai tandanya hilang)</li> <li>setelah itu klik kanan - grouping – group</li> <li>nah kedua bangun akan menyatu walaupun digeser kemana akan tetap satu</li> </ul> bagaimana sobat  mudah bukan, cara membuat beberapa bangun menjadi satu bangian<br /> semoga sukses slalu

cara menyatukan garis atau bangun 2 atau lebih menjadi satu bagian dalam word

kang maryono 0 March 20, 2014

Salam kenal sobat, izinkan saya berbagi ilmu yang sedikit ini,, cara menggabungkan bangun atau garis 2 atau lebih menjadi satu bagian. Ilmu ini berguna bagi ahli matematika untuk membuat bangun yang diperlukan dari penggabungan. Walaupun ini sanga… baca selengkapnya

baca selengkapnya

cara download mp3, mp4, maupun audio atau video tanpa menggunakan sofware

sobat beberapa kali saya sering kebingungan saya suka sekali download lagu mp3, slalu ribet sekali karena idm tak bisa digunakan karena idm saya rusak jika mau download slalu ribet bingung cari sofware dan mesti harus menginstal<br /> untungnya ada download online dengan ini tidak usah bingung;<br /> entah sobat mau download lagu audio bentuk apapun dari mp3 dan video bentuk apa saja bisa<br /> caranya buka url ini; <a href="http://en.savefrom.net/">http://en.savefrom.net/</a><br /> <img class="irc_mut" height="203" id="irc_mi" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyFNNun5kRxbspvn3Z_NE76jJeV-peWaFIQqMUJ4pV2CtIcdKtdJNaoQZmR9pqTHze-A4wERBw8j3Zpkyoeu_OcitbEgYg0L4-CxPmQchOa2tLBAe_-LrYbKTfRHFQcvHvzYWDdiH5CV4/s320/1.3.jpg" style="margin-top: 4px;" width="320" /> <br /> kurang lebih seperti diatas<br /> setelah masuk disitu ada kotak seperti kotak pencarian tinggal isikan dengan url audio atau video dan klik download atau langsung enter<br /> nah akan secara otomatis ada menu filenya di sebelah kanan tinggal sobat pilih mp3, mp4, avi, mpeg, atau yang lainnya  yang sobat inginkan setelah diklik akan otomatis mendownload sendiri tinggal sobat tunggu sampai proses selesai<br /> <br /> nah mudahkan cara download audio atau video secara online

cara download mp3, mp4, maupun audio atau video tanpa menggunakan sofware

kang maryono 0 March 19, 2014

sobat beberapa kali saya sering kebingungan saya suka sekali download lagu mp3, slalu ribet sekali karena idm tak bisa digunakan karena idm saya rusak jika mau download slalu ribet bingung cari sofware dan mesti harus menginstal untungnya ada downloa… baca selengkapnya

baca selengkapnya

Dapat Pengawal Malaikat

Entah mengapa pagi hari ini ku bangun merasakan yang aneh pada diriku,<br /> saat melihat suasana di pagi terasa begitu menyenangkan, tak seperti hari hari sebelumnya<br /> kang hari-hariku di penuhi rasa gelisah dan takut, slalu terkucilkan dan di asingkan oleh banyak orang. hari hariku yang penuh sepi dan sunyi yang di temani hanya doa dari orang tua dan rasa kuat terhadap doa orang tua;<br /> <i>" ya allah kenapa pagi ini saya gak gelisah seperti kemarin kemarin yang di bayangi rasa takut dan tindasan itu,,, aneh sekali,,,"</i><br /> <br /> ku berjalan langsung ke sekolah dan bertemu dengan teman teman juga gak seperti biasanya, yang dulu usil dan sekarang malah menyapa,<br /> sepanjang hari semua orang yang menghina dan mengejekku semua berubah menjadi baik<br /> sepulang sekolah ku bertanya pada orang tuaku;<br /> "<i>bu,,, apa ada yang aneh dengan diriku ini,,?"</i><br /> <div style="text-align: right;"> jawab ibu ;   "<i>tidak ada yang aneh duk,,, mangnya ada apa,,,?"</i></div> <i>"semua temen-temen,q berubah,,, mangnya ada apa, ya denganku,,!"</i><br /> <div style="text-align: right;"> jawab ibu ; <i> </i>"<i>yang sabar saja,, menghadapi orang lain,,, yang menjahatimu doakan saja biar cepat sadar,,!"</i></div> <i>"bukan begitu bu,,, temen-temen,q malah tidak menghina dan menjahatiku lagi malah diam saja bertemu dengan,q"</i><br /> <div style="text-align: right;"> jawab ibu ; <i> "itu tandanya udah sadar teman-temanmu itu...!"</i></div> <div style="text-align: left;"> <i>"kok cepat banget kemarin masih jahat sama saya ini malah berubah"</i></div> <div style="text-align: left;"> jawab ibu ;<i> " ya karena allah telah mendengar doamu itu"</i></div> <div style="text-align: left;"> <i>"kalau begitu qw bersukur banget atas diberikannya kesadaran pada teman-temanku itu"</i></div> <div style="text-align: left;"> <br /></div> <div style="text-align: left;"> malamnya sebelum saya tidur ku ucapkan sukur alkhamdulillah atas hadiah yang diberikannya padaku ini dan akupun tertidur dan bermimpi;</div> <div style="text-align: left;"> <br /></div> <div style="text-align: left;"> <b>"<i>aku berikan apa yang kamu minta dan yang kamu inginkan, dan aku tambah lebih banyak lagi atas kesabaranmu dan doamu sekian lama, sesungguhnya cobaan itu saya berikan untuk menguji seberapa besarkah kemampuanmu dan seberapa besarkah ke sabaranmu"</i></b></div> <div style="text-align: left;"> <br /></div> <div style="text-align: left;"> setelah mendapatkan mimpi itu akupun terbangun aku bercerita pada ibuku atas mimpi itu</div> <div style="text-align: left;"> setelah itu ternya mimpi itu benar benar terjadi malah hari ini saya mendapatkan berkah mendapatkan juara kelas, pulang kerumah dengan bangga, bukan saya yang mendapatkan berkah itu tapi ibuku juga mendapatkannya pekerjaan yang lebih baik dari pada sebelumnya.</div> <cerpen>

Dapat Pengawal Malaikat

kang maryono 0 March 13, 2014

Entah mengapa pagi hari ini ku bangun merasakan yang aneh pada diriku, saat melihat suasana di pagi terasa begitu menyenangkan, tak seperti hari hari sebelumnya kang hari-hariku di penuhi rasa gelisah dan takut, slalu terkucilkan dan di asingkan oleh… baca selengkapnya

baca selengkapnya

cara buat notifikasi komentar pada blog

cara buat notifikasi komentar agar semua komentar berkumpul dan menjadi pemberitahuan seperti pemberitahuan google plus<br /> caranya mudah sobat membuat notifikasi komentar<br /> simak baik baik ya agar lebih mudah penepatan kodenya;<br /> <ul> <li>letakkan kode ini <b>di atas</b><span style="color: red;"> kode <b></head></b></span></li> </ul> <br /> <div style="border: 1px solid #999999; height: ancho; overflow: auto; padding: 0px; width: 100%px;"> <pre><code class="xml"><span class="tag"><<span class="title">script</span> <span class="attribute">src</span>=<span class="value">'https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'</span> <span class="attribute">type</span>=<span class="value">'text/javascript'</span>/></span></code></pre> </div> <ul> <li>tambahkan kode ini <b>di atas</b> <span style="color: red;"><code>]]></b:skin></code> atau <code></style></code></span></li> </ul> <div style="border: 1px solid #999999; height: 200px; overflow: auto; padding: 10px; width: 100%px;"> <pre class="flexcroll"><code class="css"><span class="comment">/* Notifikasi Komentar ----------------------------------------------- */</span> <span class="id">#cm-total</span> <span class="rules">{ <span class="rule"><span class="attribute">position</span>:<span class="value">fixed;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">14</span>px;</span></span> <span class="rule"><span class="attribute">right</span>:<span class="value"><span class="number">0</span>;</span></span> <span class="rule"><span class="attribute">width</span>:<span class="value"><span class="number">188</span>px;</span></span> <span class="rule"><span class="attribute">text-align</span>:<span class="value">left;</span></span> <span class="rule"><span class="attribute">z-index</span>:<span class="value"><span class="number">9999</span>;</span></span> <span class="rule"><span class="attribute">cursor</span>:<span class="value">pointer;</span></span> <span class="rule">}</span></span> <span class="class">.total-counter</span> <span class="rules">{ <span class="rule"><span class="attribute">background-color</span>:<span class="value"><span class="hexcolor">#d11919</span>;</span></span> <span class="rule"><span class="attribute">color</span>:<span class="value">white;</span></span> <span class="rule"><span class="attribute">padding</span>:<span class="value"><span class="number">1</span>px <span class="number">4</span>px;</span></span> <span class="rule"><span class="attribute">font-family</span>:<span class="value">Arial,Sans-serif;</span></span> <span class="rule"><span class="attribute">font-size</span>:<span class="value"><span class="number">11</span>px;</span></span> <span class="rule"><span class="attribute">border-radius</span>:<span class="value"><span class="number">5</span>px;</span></span> <span class="rule"><span class="attribute">font-weight</span>:<span class="value">bold;</span></span> <span class="rule">}</span></span> <span class="id">#notif</span> <span class="rules">{ <span class="rule"><span class="attribute">position</span>:<span class="value">fixed;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">20</span>px;</span></span> <span class="rule"><span class="attribute">right</span>:<span class="value"><span class="number">180</span>px;</span></span> <span class="rule"><span class="attribute">z-index</span>:<span class="value"><span class="number">9999</span>;</span></span> <span class="rule"><span class="attribute">height</span>:<span class="value"><span class="number">22</span>px;</span></span> <span class="rule"><span class="attribute">width</span>:<span class="value"><span class="number">19</span>px;</span></span> <span class="rule"><span class="attribute">opacity</span>:<span class="value">.<span class="number">4</span>;</span></span> <span class="rule"><span class="attribute">cursor</span>:<span class="value">pointer;</span></span> <span class="rule">}</span></span> <span class="id">#notif</span><span class="pseudo">:hover</span> <span class="rules">{ <span class="rule"><span class="attribute">opacity</span>:<span class="value"><span class="number">1</span>;</span></span> <span class="rule">}</span></span> <span class="class">.close-notif</span> <span class="rules">{ <span class="rule"><span class="attribute">position</span>:<span class="value">fixed;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">92</span>px;</span></span> <span class="rule"><span class="attribute">right</span>:<span class="value"><span class="number">20</span>px;</span></span> <span class="rule"><span class="attribute">z-index</span>:<span class="value"><span class="number">9999</span>;</span></span> <span class="rule"><span class="attribute">cursor</span>:<span class="value">pointer;</span></span> <span class="rule"><span class="attribute">display</span>:<span class="value">none;</span></span> <span class="rule">}</span></span> <span class="id">#cm-container</span> <span class="rules">{ <span class="rule"><span class="attribute">width</span>:<span class="value"><span class="number">355</span>px;</span></span> <span class="rule"><span class="attribute">position</span>:<span class="value">fixed;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">67</span>px;</span></span> <span class="rule"><span class="attribute">right</span>:<span class="value"><span class="number">0</span>;</span></span> <span class="rule"><span class="attribute">z-index</span>:<span class="value"><span class="number">9999</span>;</span></span> <span class="rule"><span class="attribute">background-color</span>:<span class="value"><span class="hexcolor">#e5e5e5</span>;</span></span> <span class="rule"><span class="attribute">padding</span>:<span class="value"><span class="number">60</span>px <span class="number">20</span>px <span class="number">10</span>px <span class="number">20</span>px;</span></span> <span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#666</span>;</span></span> <span class="rule"><span class="attribute">box-shadow</span>:<span class="value"><span class="number">0</span> <span class="number">4</span>px <span class="number">15</span>px -<span class="number">4</span>px <span class="function">rgba(<span class="number">0</span>,<span class="number">0</span>,<span class="number">0</span>,.<span class="number">4</span>)</span> <span class="important">!important</span>;</span></span> <span class="rule"><span class="attribute">text-align</span>:<span class="value">left;</span></span> <span class="rule"><span class="attribute">border</span>:<span class="value"><span class="number">1</span>px solid <span class="function">rgba(<span class="number">0</span>,<span class="number">0</span>,<span class="number">0</span>,.<span class="number">2</span>)</span>;</span></span> <span class="rule"><span class="attribute">background-clip</span>:<span class="value">padding-box;</span></span> <span class="rule"><span class="attribute">display</span>:<span class="value">none;</span></span> <span class="rule">}</span></span> <span class="id">#cm-container</span><span class="pseudo">:before</span> <span class="rules">{ <span class="rule"><span class="attribute">content</span>:<span class="value"><span class="function">url(<span class="string">'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisMINuWM1z9CbpStP1jTN2AkYVfukbDcuPJwjdAY9KFgX32zoZVvwhx582yofi3oQPP_AEjO51qoHSOHpUtLZ2HBuyQTEF3xZZeT8iP49A_waEW1m9pnL-B_L_izaxV_2nsin6JJScRLQ/s1600/arrow-notif.png'</span>)</span>;</span></span> <span class="rule"><span class="attribute">position</span>:<span class="value">absolute;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value">-<span class="number">14</span>px;</span></span> <span class="rule"><span class="attribute">left</span>:<span class="value"><span class="number">196</span>px;</span></span> <span class="rule">}</span></span> <span class="id">#cm-container</span><span class="pseudo">:after</span> <span class="rules">{ <span class="rule"><span class="attribute">content</span>:<span class="value"><span class="string">"Komentar Terbaru"</span>;</span></span> <span class="rule"><span class="attribute">position</span>:<span class="value">absolute;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">22</span>px;</span></span> <span class="rule"><span class="attribute">left</span>:<span class="value"><span class="number">150</span>px;</span></span> <span class="rule"><span class="attribute">text-align</span>:<span class="value">center;</span></span> <span class="rule"><span class="attribute">font</span>:<span class="value">normal <span class="number">14</span>px Arial;</span></span> <span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#333</span>;</span></span> <span class="rule">}</span></span> <span class="class">.cm-outer</span> <span class="rules">{ <span class="rule"><span class="attribute">margin</span>:<span class="value"><span class="number">0</span> auto;</span></span> <span class="rule"><span class="attribute">padding</span>:<span class="value"><span class="number">0</span>;</span></span> <span class="rule"><span class="attribute">font-size</span>:<span class="value"><span class="number">11</span>px;</span></span> <span class="rule"><span class="attribute">text-align</span>:<span class="value">left;</span></span> <span class="rule"><span class="attribute">font</span>:<span class="value">normal <span class="number">12</span>px Arial;</span></span> <span class="rule">}</span></span> <span class="class">.cm-outer</span> <span class="tag">ul</span><span class="rules">{ <span class="rule"><span class="attribute">margin-bottom</span>:<span class="value"><span class="number">5</span>px;</span></span> <span class="rule">}</span></span> <span class="class">.cm-outer</span> <span class="tag">li</span> <span class="rules">{ <span class="rule"><span class="attribute">padding</span>:<span class="value"><span class="number">9</span>px <span class="number">10</span>px <span class="number">14</span>px;</span></span> <span class="rule"><span class="attribute">list-style</span>:<span class="value">none;</span></span> <span class="rule"><span class="attribute">clear</span>:<span class="value">both;</span></span> <span class="rule"><span class="attribute">position</span>:<span class="value">relative;</span></span> <span class="rule"><span class="attribute">border-radius</span>:<span class="value"> <span class="number">3</span>px;</span></span> <span class="rule"><span class="attribute">box-shadow</span>:<span class="value"> <span class="number">0</span> <span class="number">1</span>px <span class="number">2</span>px <span class="function">rgba(<span class="number">0</span>,<span class="number">0</span>,<span class="number">0</span>,.<span class="number">2</span>)</span>;</span></span> <span class="rule"><span class="attribute">background-color</span>:<span class="value"> white;</span></span> <span class="rule"><span class="attribute">margin-bottom</span>:<span class="value"><span class="number">10</span>px;</span></span> <span class="rule">}</span></span> <span class="class">.cm-text</span> <span class="rules">{<span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#797979</span>;</span></span><span class="rule">}</span></span> <span class="class">.cm-outer</span> <span class="rules">{<span class="rule"><span class="attribute">margin</span>:<span class="value"><span class="number">0</span> <span class="number">0</span> <span class="number">5</span>px}</span></span></span> <span class="class">.cm-header</span> <span class="rules">{<span class="rule"><span class="attribute">margin</span>:<span class="value"> <span class="number">4</span>px <span class="number">0</span> <span class="number">8</span>px <span class="number">90</span>px;</span></span><span class="rule"><span class="attribute">font-size</span>:<span class="value"><span class="number">11</span>px;</span></span><span class="rule"><span class="attribute">font-weight</span>:<span class="value">normal <span class="important">!important</span>;</span></span><span class="rule">}</span></span> <span class="class">.cm-header</span> <span class="tag">a</span> <span class="rules">{<span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#262626</span>;</span></span><span class="rule"><span class="attribute">text-decoration</span>:<span class="value">none;</span></span><span class="rule"><span class="attribute">font-size</span>:<span class="value"><span class="number">14</span>px;</span></span><span class="rule"><span class="attribute">font-weight</span>:<span class="value">bold}</span></span></span> <span class="class">.cm-header</span> <span class="tag">a</span><span class="pseudo">:hover</span> <span class="rules">{<span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#74a2c3</span>;</span></span><span class="rule"><span class="attribute">text-decoration</span>:<span class="value">none;</span></span><span class="rule">}</span></span> <span class="class">.cm-outer</span> <span class="class">.cm-content</span> <span class="rules">{<span class="rule"><span class="attribute">overflow</span>:<span class="value">hidden}</span></span></span> <span class="class">.cm-content</span> <span class="rules">{<span class="rule"><span class="attribute">margin-left</span>:<span class="value"><span class="number">90</span>px}</span></span></span> <span class="class">.cm-outer</span> <span class="tag">img</span> <span class="rules">{ <span class="rule"><span class="attribute">display</span>:<span class="value">block;</span></span> <span class="rule"><span class="attribute">float</span>:<span class="value">left;</span></span> <span class="rule"><span class="attribute">background</span>:<span class="value"><span class="hexcolor">#ececec</span> <span class="function">url(<span class="string">'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeX-TYqwlXYk4f5aUVS9N1_pDHIq9vUxgkoTHTEEYnCMm5IQsQopz4JSRwveOSPZKTGz2U1Po8M9VhgR03DQrgu6obyl2IVqhGcgKXa780oHDalOCJc2yJ4VLiYaqjuaCJOVY8ZDJscYs/s1600/anon80.png'</span>)</span> no-repeat <span class="number">50</span>% <span class="number">50</span>%;</span></span> <span class="rule"><span class="attribute">overflow</span>:<span class="value">hidden;</span></span> <span class="rule"><span class="attribute">border-radius</span>:<span class="value"><span class="number">3</span>px <span class="number">0</span> <span class="number">0</span> <span class="number">3</span>px;</span></span> <span class="rule"><span class="attribute">position</span>:<span class="value">absolute;</span></span> <span class="rule"><span class="attribute">top</span>:<span class="value"><span class="number">0</span>;</span></span> <span class="rule"><span class="attribute">left</span>:<span class="value"><span class="number">0</span>;</span></span> <span class="rule">}</span></span> <span class="class">.cm-footer</span> <span class="rules">{<span class="rule"><span class="attribute">margin-top</span>:<span class="value"><span class="number">7</span>px;</span></span><span class="rule">}</span></span> <span class="class">.cm-footer</span> <span class="tag">a</span> <span class="rules">{<span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#5886a7</span>;</span></span><span class="rule"><span class="attribute">text-decoration</span>:<span class="value">none;</span></span><span class="rule">}</span></span> <span class="class">.cm-footer</span> <span class="tag">a</span><span class="pseudo">:hover</span> <span class="rules">{<span class="rule"><span class="attribute">color</span>:<span class="value"><span class="hexcolor">#74a2c3</span>;</span></span><span class="rule"><span class="attribute">text-decoration</span>:<span class="value">none;</span></span><span class="rule">}</span></span> <span class="tag">div</span><span class="class">.cm-header</span> <span class="tag">img</span><span class="attr_selector">[src=&#39;http://img1.blogblog.com/img/openid16-rounded.gif&#39;]</span> <span class="rules">{ <span class="rule"><span class="attribute">content</span>:<span class="value"> <span class="function">url(http://<span class="number">2</span>.bp.blogspot.com/-<span class="number">8</span>NurYzHIoWQ/Ujc_oLurXII/AAAAAAAAFek/XhAm-oLwg7Q/s80-c/gravatar.png)</span>;</span></span> <span class="rule">}</span></span></code></pre> </div> <br /> <ul> <li>dan juga kode ini <b>di atas</b> <span style="color: red;"><code></body></code></span></li> </ul> <div style="border: 1px solid #999999; height: 200px; overflow: auto; padding: 10px; width: 100%px;"> <pre><code class="xml"><span class="tag"><<span class="title">div</span> <span class="attribute">id</span>=<span class="value">'cm-container'</span>/></span> <span class="tag"><<span class="title">div</span> <span class="attribute">id</span>=<span class="value">'notif'</span> <span class="attribute">title</span>=<span class="value">'Notifikasi'</span>></span><span class="tag"><<span class="title">img</span> <span class="attribute">alt</span>=<span class="value">'notifikasi'</span> <span class="attribute">src</span>=<span class="value">'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijwiDyjYEOUHUp-iucBB5NFFuEznbNRuFuEyIYyLa0-E4eijQR-Cwo3dt0dHfp7MGwiLciVgl9qD985bz-uLSCnJ_pMOtRp55OsCTvPZwxTkNXTshsNxuRj1jV6KRXw2s-2WHrN7dX564/s1600/lonceng.png'</span>/></span><span class="tag"></<span class="title">div</span>></span> <span class="tag"><<span class="title">div</span> <span class="attribute">id</span>=<span class="value">'cm-total'</span>/></span> <span class="tag"><<span class="title">div</span> <span class="attribute">class</span>=<span class="value">'close-notif'</span>></span><span class="tag"><<span class="title">img</span> <span class="attribute">alt</span>=<span class="value">'close'</span> <span class="attribute">src</span>=<span class="value">'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_0clSqcjqO0ZERf4tDKQqSbE-lXgkVK82pKvyNfJaxrAeWHF6zs7z3nb7Fw-VvZbU9CR1eZq_B5WmDEYOPIypKxKg3k5S7p3N0C5XdNh5kpWtkTa40cb3-IxdaOob4v0fCLB1aH6dOk4/s1600/delete4.png'</span> <span class="attribute">title</span>=<span class="value">'close'</span>/></span><span class="tag"></<span class="title">div</span>></span> <span class="tag"><<span class="title">script</span>></span><span class="javascript"> <span class="comment">//<![CDATA[</span> <span class="keyword">var</span> originalTitle = document.title; <span class="keyword">var</span> cm_config = { home_page: <span class="string">"<mark>http://dagujang.blogspot.com</mark>"</span>, max_result: <span class="number">6</span>, t_w: <span class="number">80</span>, t_h: <span class="number">80</span>, summary: <span class="number">40</span>, new_tab_link: <span class="literal">true</span>, ct_id: <span class="string">"cm-container"</span>, new_cm: <span class="string">" Komentar Baru!"</span>, interval: <span class="number">30000</span>, alert: <span class="literal">true</span>, alert: <span class="keyword">function</span>(total) { document.getElementById(<span class="string">"cm-total"</span>).innerHTML = <span class="string">'<strong class=\'total-counter\'>'</span>+total+<span class="string">'</strong>'</span>; document.title = <span class="string">'('</span> + total + <span class="string">') '</span> + originalTitle; } }; $(<span class="string">'#notif'</span>).click(<span class="keyword">function</span>(){$(<span class="string">'#cm-container, .close-notif'</span>).toggle();});$(<span class="string">'.close-notif'</span>).click(<span class="keyword">function</span>(){$(<span class="string">'#cm-container, .close-notif'</span>).hide();});document.getElementById(<span class="string">'notif'</span>).onclick = <span class="keyword">function</span>(){document.title = originalTitle;$(<span class="string">'#cm-total'</span>).hide();};document.getElementById(<span class="string">'show-total'</span>).onclick = <span class="keyword">function</span>(){document.title = originalTitle;$(<span class="string">'#cm-total'</span>).hide();$(<span class="string">'#cm-container'</span>).show();}; <span class="comment">//]]></span> </span><span class="tag"></<span class="title">script</span>></span> <span class="tag"><<span class="title">script</span> <span class="attribute">src</span>=<span class="value">'https://googledrive.com/host/0B3pi8P5BWqm1OHB4Zks1aWR0Nnc/notif-komen.js'</span> <span class="attribute">type</span>=<span class="value">'text/javascript'</span>/></span><span class="javascript"></span></code></pre> </div> <ul> </ul> <ul> <li> <code class="xml"><span class="javascript"><span class="string"><mark>dagujang.blogspot.com</mark></span></span></code> ganti tulisan yang di blog warna kuning dengan nama blog sobat sendiri</li> <li>simpan dan lihat hasilnya </li> </ul>

cara buat notifikasi komentar pada blog

kang maryono 0 March 11, 2014

cara buat notifikasi komentar agar semua komentar berkumpul dan menjadi pemberitahuan seperti pemberitahuan google plus caranya mudah sobat membuat notifikasi komentar simak baik baik ya agar lebih mudah penepatan kodenya; letakkan kode ini di atas k… baca selengkapnya

baca selengkapnya

puisi; Surgaku

Surgaku<br /> Dunia bagaikan mimpi<br /> Terbentang lautan susu<br /> Kilauan mutiara di setiap reanting pohon<br /> <blockquote class="tr_bq"> Surgaku<br /> Udara yang begitu bersih<br /> Suaana yang menyenangkan<br /> Seperti tempat para bidadari</blockquote> Surgaku<br /> Bagaikan tempat berlindung<br /> Bagaikan tempat kebutuhan<br /> Mau ini tinggal ambil<br /> Mau itu tinggal pilih<br /> <blockquote class="tr_bq"> Surgaku<br /> Tempat untuk memanjakan diri<br /> Yang diberikan oleh sang pencipta<br /> Hadiah terbesar darinya<br /> Hadiah teristimewa yang dijanjikannya<br /> Untuk kita semua </blockquote>

puisi; Surgaku

kang maryono 0 March 11, 2014

Surgaku Dunia bagaikan mimpi Terbentang lautan susu Kilauan mutiara di setiap reanting pohon Surgaku Udara yang begitu bersih Suaana yang menyenangkan Seperti tempat para bidadari Surgaku Bagaikan tempat berlindung Bagaikan tempat kebutuhan Mau ini t… baca selengkapnya

baca selengkapnya

Kumpulan Pantun Nasehat

Ada pedang di pohon palam<br /> Dibuat perang sama bang somat<br /> Jangan bergadang sampai tengah malam<br /> Kalau kamu pengen sehat<br /> <br /> <blockquote class="tr_bq"> Jalan jalan naik kuda<br /> Kudanya warna merah<br /> Kalau pengen awet muda<br /> Jangan marah marah</blockquote> Siudin sedang berlayar<br /> berlayar memakai perahu<br /> kalau kamu pengen pintar<br /> rajinlah belajar selalu

Kumpulan Pantun Nasehat

kang maryono 0 March 11, 2014

Ada pedang di pohon palam Dibuat perang sama bang somat Jangan bergadang sampai tengah malam Kalau kamu pengen sehat Jalan jalan naik kuda Kudanya warna merah Kalau pengen awet muda Jangan marah marah Siudin sedang berlayar berlayar memakai perahu ka… baca selengkapnya

baca selengkapnya

puisi; Gadis Berkerudung Merah

Kau gadis berkerudung<br /> Kau duduk bersandar<br /> Kau hiasi dirimu<br /> Dengan kerudung merah<br /> <blockquote class="tr_bq"> Senyummu begitu menawan hati<br /> Bagaikan bulan di waktu purnama<br /> Tawamu begitu riang<br /> Bagaikan diwaktu pagi yang cerah</blockquote> Kau gadis berkerudung merah<br /> Kau ukir namamu di dalam hatiku<br /> Kau pajang wajahmu di angan-anganku<br /> Bagaikan bintang dalam mimpiku<br /> <blockquote class="tr_bq"> Kau pancarkan panah asmara<br /> Membuat para kumbang terpesona<br /> Kau curi pandangan orang lain<br /> Hanya nampak dirimu</blockquote> Kau gadis berkerudung merah<br /> Kau terbang sana kesini<br /> Bagaikan bidadari dari langit<br /> Untuk menguji kami

puisi; Gadis Berkerudung Merah

kang maryono 0 March 11, 2014

Kau gadis berkerudung Kau duduk bersandar Kau hiasi dirimu Dengan kerudung merah Senyummu begitu menawan hati Bagaikan bulan di waktu purnama Tawamu begitu riang Bagaikan diwaktu pagi yang cerah Kau gadis berkerudung merah Kau ukir namamu di dalam ha… baca selengkapnya

baca selengkapnya

cara buat tombol loncat bergambar pada postingan

sobat kembali lagi lagi kali ini saya akan memberikan bagaimana cara membuat tombol loncat<br /> ke atas dan ke komentar yanga bergambar<br /> caranya begini;<br /> masuk ke blog sobat<br /> tambahkan gadget<br /> copy paste kode di bawah ini;<br /> <br /> <a href="#header" style="bottom: <span style="color: red;">50</span>px; display: scroll; position: fixed; lift: 5px;" title="kembali keatas"><img src=<span style="color: blue;">"<span style="color: blue;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAK7_eJHJcIEkmAeIcsFaXg2sz7UD_8o529s7Mjkcd-aEG9PkbgpVFl5G-X6-VcEAApo_JAUJv-wkLtw6pbubGTtQKGjR-7BwJw3HYc79YdFE4NM7F9tivYN-jec2Ba5uHb3qf5CySSxg/s1600/panah+atas.jpg">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAK7_eJHJcIEkmAeIcsFaXg2sz7UD_8o529s7Mjkcd-aEG9PkbgpVFl5G-X6-VcEAApo_JAUJv-wkLtw6pbubGTtQKGjR-7BwJw3HYc79YdFE4NM7F9tivYN-jec2Ba5uHb3qf5CySSxg/s1600/panah+atas.jpg</a></span></span>" /></a><br /> <br /> <a href="#comments" style="bottom: <span style="color: red;">5</span>px; display: scroll; position: fixed; lift: 5px;" title="langsung ke komentar"><img src="<span style="color: blue;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFRHX0klYdv2ewvtz18SGYZPE4vyGQ92mU6oCT2f5YyUkcDjdjMX1xx6kX_MPFlL1Q91m5jXB9Tr0og96HByw2KuYRqZYiOCoVV31PRCUNzFXoXO2mStsopWnHpM_mQFtZ_0wCWo67GMg/s1600/panah+bawah.jpg">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFRHX0klYdv2ewvtz18SGYZPE4vyGQ92mU6oCT2f5YyUkcDjdjMX1xx6kX_MPFlL1Q91m5jXB9Tr0og96HByw2KuYRqZYiOCoVV31PRCUNzFXoXO2mStsopWnHpM_mQFtZ_0wCWo67GMg/s1600/panah+bawah.jpg</a></span>" /></a><span style="color: #0000ee;"> </span><br /> <br /> simpan dan lihat hasilnya,,,,<br /> keterangan pada warna <span style="color: blue;">biru</span> bisa diganti dengan gambar yang sobat inginkan<br /> dan warna<span style="color: red;"> merah</span> merupakan ketinggiannya bisa anda sobat ganti menurut selera

cara buat tombol loncat bergambar pada postingan

kang maryono 0 March 10, 2014

sobat kembali lagi lagi kali ini saya akan memberikan bagaimana cara membuat tombol loncat ke atas dan ke komentar yanga bergambar caranya begini; masuk ke blog sobat tambahkan gadget copy paste kode di bawah ini; 50px; display: scroll; position: fix… baca selengkapnya

baca selengkapnya

Membuat Menu Melayang Diatas mengikuti Scrol

<a href="http://dagujang.blogspot.com/2014/06/membuat-menu-melayang-diatas-mengikuti.html">Membuat Menu Melayang Di Atas Blog </a>- Halo sobat kembali saya berbagi artikel,<br /> Oke sobat, kali ini saya akan berbagi <b>Tutorial Blog</b> lagi setelah beberapa hari lalu. Singkat waktu, langsung saja yuk sob caranya jika sobat belum tau bentuknya sobat bisa masuk ke <b><a href="http://ujicoba-kangmaryono.blogspot.com/" target="_blank">DEMO</a>. </b>Sekarang sudah tau kan?? yuk sekarang menuju proses pembuatannya:<br /> <br /> <ul> <li>Login Blogger</li> <li>Masuk ke dashboard</li> <li>Menuju menu template -> Edit Html</li> <li>Kemudian Masukkan kode dibawah ini tepat diatas <code> ]]></b:skin></code></li> </ul> <br /> <div> <blockquote class="tr_bq"> <div style="margin-bottom: 2px;"> <span style="color: #6666cc;"> </span> <br /> <div style="margin-top: 5px; text-align: left;"> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="font-size: 10px; margin-top: 5px; width: 60px;" type="button" value="BUKA" /> </div> <div style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> /* Top Menu www.g-bloog.com<br /> ----------------------------------------------- */<br />   #top-menuwrapper{background: white;height:60px;width:100%;position:fixed;top:0;left:0;z-index:999;overflow:hidden;border-bottom:3px solid #05BEFF}<br />   #top-menuwrap, #top-menuwrap2{width:90%;margin:0 auto}<br /> #top-menu{width:100%}<br /> #top-menu ul{list-style: none;width:100%;}<br /> #top-menu ul li{float:right}<br /> #top-menu ul li a{line-height:20px;padding:5px 0;margin-left:25px;color:#999;font-size:14px;text-transform:uppercase;display:block;text-decoration:none;}<br /> #top-menu ul li a:hover{color:#c94e5c;}<br /> .logo{float:left;font-family:'Montserrat', Oswald;font-size:160%;text-transform:uppercase;font-weight:300;}<br /> #top-menu ul li a.current{color:#c94e5c}<br /> .logo a{color:#fff;text-decoration:none;margin-top:-5px}<br /> .logo a:hover{color:#fff;text-decoration:none}<br /> .logo img{margin-top:0px;}</div> </div> </div> </blockquote> </div> <div> </div> <div> <ul> <li>Kemudian masukkan kode dibawah ini tepat dibawah tag <code><body></code></li> </ul> <div> <div> <blockquote class="tr_bq"> <div id='top-menuwrapper'><br /> <div id='top-menuwrap'><br /> <div id='top-menu'><br /> <ul><br /> <li><a href='<span style="background-color: #6aa84f;">http://unduhan-mp3.blogspot.com/</span>'>Lagu Gratis</a></li><br /> <li><a href='<span style="background-color: #6aa84f;">http://dagujang.blogspot.com/p/tv-online-indonesia.html/</span>'>TV Online</a></li><br /> <li><a href='<span style="background-color: #6aa84f;">http://www.youtube.com/</span>'>You Tube</a></li><br />   </ul><br /> <div class='logo'><br /> <a href='/'><img alt='Go! Blog' src='<span style="background-color: yellow;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAUx_t2YmZXE7kh230oyEiHRM4Ub6DPNnIxe-Yicf7b6L_No1M_xljYyu_i9YlH8vpOnUJdFfxM6CkgoKoXbyk-Y7ue3COKdm1XEq-_1x4gVX1QpQ1nVFglotSWpjg4EPhJunSogVobJo/s36/13.gif</span>'/></a><br /> </div><br /> </div><br /> </div><br /> </div></blockquote> </div> </div> </div> <div> </div> <h4> Keterangan</h4> <div> Pasti sobat sudah tau apa yang harus diubah, mungkin saya perlu jelaskan lagi ya bagi yang belum tau. Untuk tulisan yang saya stabilo <span style="background-color: #6aa84f;">hijau</span> sobat bisa ganti dengan link yang sobat inginkan. Untuk tulisan yang saya stabilo <span style="background-color: yellow;">kuning</span> sobat bisa ganti dengan alamat gambar logo blog sobat sendiri. Ingat logo blog sobat harus berukuran  <b>170 x 34 pixel </b>agar terlihat pas dan rapi.</div> <div> <ul> <li>Sekarang simpan. Jika tampilan blog sobat tidak rapi, mungkin ada yang harus sobat otak atik lagi. Mau tau caranya?? yaudah deh saya kasih bonus :D</li> </ul> <div> biasanya menu navigasi melayang ini akan menutupi header blog sobat. bener gak?? kalo bener simak terus nih caranya.</div> </div> <div> <ul> <li>Sobat cari css di blog sobat biasanya penulisannya seperti ini:</li> </ul> <blockquote class="tr_bq"> #header {............<br /> }</blockquote> </div> <div> <ul> <li>Kemudian sobat tabahkan <code>margin-top:60px;</code> maka akan seperti ini.</li> </ul> </div> <div> <blockquote class="tr_bq"> #header {<span style="color: red;">margin-top:60px</span>;............<br /> }</blockquote> </div> <div> </div> <div> untuk "........." maksudnya adalah kode- kode lain yang berada didalamnya. </div> <div>  Sekian artikel yang saya berikan mohon maaf jika artikel yang saya buat ini kurang jelas. Untuk agar lebih terlihat menarik sobat dapat mengotak atik sendiri. Jika ada hal yang ingin ditanyakan tentang artikel ini silahkan komentar dibawah ini ^_^.</div>

Membuat Menu Melayang Diatas mengikuti Scrol

kang maryono 0 March 04, 2014

Membuat Menu Melayang Di Atas Blog - Halo sobat kembali saya berbagi artikel, Oke sobat, kali ini saya akan berbagi Tutorial Blog lagi setelah beberapa hari lalu. Singkat waktu, langsung saja yuk sob caranya jika sobat belum tau bentuknya sobat bi… baca selengkapnya

baca selengkapnya

cara merubah penampilan komentar blog agar lebih menarik

Sebuah kotak komentar juga bisa mempengaruhi pengunjung blog jika<br /> kolom kotak komentar kita menarik tentunya juga pengunjung lebih suka untuk berkunjuk ke blog kita maka dari itu cara mempercantik kotak komentar kita perlukan,<br /> ini salah satu cara merubah kotak komentar pada blog caranya;<br /> masuk ke blog sobat<br /> <div> >> Template >> Edit HTML.</div> <div> </div> <div> Cari kode <span style="color: red;">]]></b:skin></span></div> <div> </div> <div> Copy kode yang ada di bawah, kemudian letakkan <b>di atas</b> kode <span style="color: red;">]]></b:skin></span></div> <br /> <div style="margin-bottom: 2px;"> <span style="color: #6666cc;"> </span> <br /> <div style="margin-top: 5px; text-align: left;"> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="font-size: 10px; margin-top: 5px; width: 60px;" type="button" value="BUKA" /> </div> <div style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> <div style="height: 200px; overflow: auto; width: ancho;"> <br /> /* Comments<br /> ----------------------------------------------- */<br /> #comments h4 {<br /> font-weight:bold;<br /> color:#000;<br /> background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUCCMaabX6OQ-SLy4BX_ejzkdpNgH1mlb07eMj5kzQwb567rjwtb15k3vxX511NdcHMyveTcuMKZL2VtLKX5KLroCKqfuP3ekvemrglGz1njt_IHO2XNowwok3wiWnXPmaeD75mYJgE9eW/) repeat-x;<br /> height: 35px;<br /> line-height: 35px;<br /> width: 100%;<br /> margin:-5px 0 -7px -10px;<br /> text-align:center;<br /> border-top:1px solid #ddd;<br /> display:block;<br /> padding-bottom:6px ;<br /> line-height:30px;<br /> }<br /> h4#comment-post-message {<br /> display:none;<br /> }<br /> .comments .comments-content {<br /> font-size:12px;<br /> text-align:left;<br /> }<br /> #comments-block {<br /> margin:1em 0 1.5em;<br /> line-height:1.6em<br /> }<br /> #comments-block .comment-author {<br /> margin:.5em 0<br /> }<br /> #comments-block .comment-body {<br /> margin:.25em 0 0<br /> }<br /> #comments-block .comment-footer {<br /> margin:-.25em 0 2em;<br /> line-height:1.4em;<br /> letter-spacing:.1em<br /> }<br /> #comments-block .comment-body p {<br /> margin:0 0 .75em<br /> }<br /> .deleted-comment {<br /> font-style:italic;<br /> color:gray<br /> }<br /> .comments {<br /> font:normal 11px/14px "Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif!important<br /> }<br /> .comments .comments-content .comment,.comments .comments-content .comment:first-child,.comments .comments-content .comment:last-child {<br /> padding:0;<br /> margin:0;<br /> position:relative<br /> }<br /> .comments .avatar-image-container {<br /> width:45px;<br /> height:45px;<br /> max-width:45px;<br /> max-height:45px;<br /> padding:2px;<br /> border-radius:2px;<br /> margin-right:5px;<br /> margin-top:8px;<br /> margin-left:8px;<br /> position:relative;<br /> background-color:white;<br /> z-index: 2;<br /> }<br /> .comments .avatar-image-container img {<br /> max-width:100%;<br /> height:100%<br /> }<br /> .comments .inline-thread .avatar-image-container {<br /> width:38px;<br /> height:38px;<br /> position:relative;<br /> margin:0<br /> }<br /> .comments .comment-block {<br /> margin-left:0;<br /> padding:0 8px;<br /> min-height:90px;<br /> border:1px solid #4173af;<br /> border-radius:2px<br /> }<br /> .comments .inline-thread .comment-block {<br /> margin-left:45px;<br /> padding:0;<br /> border:0;<br /> min-height:initial<br /> }<br /> .comments .comments-content .comment:hover .comment-block {<br /> border:1px solid 4173af;<br /> -moz-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);<br /> -webkit-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);<br /> box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21)<br /> }<br /> .comments .comments-content .comment:hover .inline-thread .comment-block {<br /> border:0;<br /> -moz-box-shadow:none;<br /> -webkit-box-shadow:none;<br /> box-shadow:none<br /> }<br /> .comments .comments-content .comment-replies {<br /> margin-left:20px;<br /> margin-top:5px<br /> }<br /> .comments .comments-content .comment-header,.comments .comments-content .comment-content {<br /> margin:0 0 8px;<br /> padding-left:58px;<br /> text-align:left;<br /> line-height:1.6em;<br /> }<br /> .comments .comments-content .comment-header {<br /> margin-top:8px;<br /> height:14px<br /> }<br /> .comments .comments-content .inline-thread .comment-header,.comments .comments-content .inline-thread .comment-content {<br /> padding-left:8px;<br /> margin-top:0;<br /> text-align:left;<br /> line-height:1.6em;<br /> }<br /> .comment-actions {<br /> position:absolute;<br /> top:64px;<br /> left:10px;<br /> z-index:2<br /> }<br /> .comments .comment .comment-actions a {<br /> background:#0671A1;<br /> border-radius:4px;<br /> position:relative;<br /> display:block;<br /> padding:2px 7px;<br /> color:white;<br /> top:-1px;<br /> font-family:Arial,Sans-serif;<br /> font-weight:bold;<br /> box-shadow:0 1px 1px rgba(0,0,0,0.4);<br /> text-shadow:0 1px 0 rgba(0,0,0,0.3);<br /> -webkit-transition:none;<br /> -moz-transition:none;<br /> -o-transition:none;<br /> -ms-transition:none;<br /> transition:none<br /> }<br /> .comments .comment .comment-actions a:hover {<br /> text-decoration:none;<br /> background-color:#0057ae;<br /> }<br /> .comments .comment .comment-actions a:active {<br /> top:0;<br /> background-color:#0057ae;<br /> }<br /> .comments .comments-content .inline-thread li.comment,.comments .comments-content .inline-thread li.comment:first-child,.comments .comments-content .inline-thread li.comment:last-child {<br /> padding:5px;<br /> border:1px solid #4173af;<br /> margin-bottom:5px;<br /> }<br /> .comments .comments-content .inline-thread {<br /> padding:0<br /> }<br /> .comments .comments-content .comment-thread.inline-thread ol {<br /> padding-top:8px<br /> }<br /> .comments .comments-content .comment-thread.inline-thread ol > div:first-child {<br /> border-left:1px solid #4173af;<br /> padding:10px<br /> }<br /> .comments .comments-content .inline-thread li.comment::before {<br /> content:"";<br /> position:absolute;<br /> width:11px;<br /> height:1px;<br /> background-color:#4173af;<br /> display:block;<br /> left:-12px;<br /> top:12px<br /> }<br /> .comments .comments-content .inline-thread li.comment:last-child {<br /> margin-bottom:0<br /> }<br /> .comments .comments-content .inline-thread li.comment:last-child::after {<br /> content:"";<br /> height:100%;<br /> width:5px;<br /> display:block;<br /> background-color:#FCFCFC;<br /> position:absolute;<br /> top:13px;<br /> left:-13px<br /> }<br /> .comments .thread-toggle.thread-expanded {<br /> position:relative<br /> }<br /> .comments .thread-toggle.thread-expanded::after {<br /> content:"";<br /> display:block;<br /> width:1px;<br /> height:32px;<br /> position:absolute;<br /> background:#4173af;<br /> top:-8px;<br /> left:0<br /> }<br /> .comments .comment .comment-actions .item-control a {<br /> display:none;<br /> background-color:#FCFCFC;<br /> background-position:2px 50%;<br /> background-repeat:no-repeat;<br /> background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGpS-ksR9Vx4kzwHV-gDL8HyBd7d9WTf8yl4nvatxRglPG_SpTSo5VVlK0ata7EPW0sXOymVhLRQqdIjVE_y9ln5D8S926u0Y-1JVt_p8OAVBCcvTYNmZWdW3KBirRR1OKN13xpxzUXQE/s14/Trash.png);<br /> border:1px solid #4173af;<br /> position:absolute;<br /> left:-10px;<br /> text-indent:-9999px;<br /> padding:0;<br /> width:19px;<br /> height:20px;<br /> top:-42px;<br /> border-radius:2px<br /> }<br /> .comments .comments-content .comment:hover .comment-actions .item-control a {<br /> display:block<br /> }<br /> .comments .comments-content .comment:hover .inline-thread .comment-actions .item-control a {<br /> display:none<br /> }<br /> .comments .comments-content .inline-thread li.comment:hover .comment-actions .item-control a {<br /> display:block<br /> }<br /> .comments .inline-thread .comment .comment-actions .item-control a {<br /> left:-61px;top:-35px<br /> }<br /> #comments h4#comment-post-message {<br /> border-bottom:0;<br /> background-color:transparent;<br /> font-size:130%<br /> }<br /> .comment-form {<br /> max-width:100%<br /> }<br /> .comments .comments-content .icon.blog-author {<br /> display: block;<br /> width: 0;<br /> height: 0;<br /> border: 6px solid transparent;<br /> border-color:transparent #0671A1 #0671A1 transparent;<br /> position: absolute;<br /> right: 0;bottom: 4px;<br /> }<br /> .comments .comments-content .inline-thread .icon.blog-author {<br /> bottom:-9px;<br /> right:-5px;<br /> }<br /> .comments .comments-content .user,.comments .comments-content .datetime {<br /> display:inline-block;<br /> float:left<br /> }<br /> .comments .avatar-image-container img[src="http://img1.blogblog.com/img/anon36.png"] {<br /> content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiphJRKHiHRpz2Fzg4Hdt4_rzyN9TLIy0DPTuzt_PtnAgXPye9F4Aq2_wSWoiqBeBcfiJnd-z9m4ni602Rl3EoD2eP-yWq473UuU39j8U4MXvwQksaB7yWrYB9LGSpa1vfe7eY3bn3-LPNH/s70/user-anonymous-icon.png);<br /> }<br /> <br /></div> </div> </div> </div> <br /> klik simpan dan lihat hasilnya..<br /> nah mudah bukan sobat cara mengganti penampilan kotak komentar di blogspot<br /> jangan lupa berkunjung lagi di artikel yang lainnya<br /> terimakasih..<br /> <br /> <br />

cara merubah penampilan komentar blog agar lebih menarik

kang maryono 2 March 04, 2014

Sebuah kotak komentar juga bisa mempengaruhi pengunjung blog jika kolom kotak komentar kita menarik tentunya juga pengunjung lebih suka untuk berkunjuk ke blog kita maka dari itu cara mempercantik kotak komentar kita perlukan, ini salah satu cara mer… baca selengkapnya

baca selengkapnya

cara buat buku tamu sembunyi di samping blog

cara menampilkan buku tamu berada di samping blog<br /> tentunya sobat blogger menambahkan buku tamu di samping blog tanpa menghalangi pembaca dan<br /> jika pembaca ingin memberi komentar atau tanggapan  atau mengisi buku tamu itu bisa tinggal klik dan akan muncul cendela dari samping, tinggal pengunjung bisa mengisinya tanpa memakan banyak tempat<br /> caranya sangat mudah kok sobat masuk ke blogger/ blog sobat<br /> ke tata letak<br /> tambah gadget<br /> tambah HTML<br /> copy paste kode berikut;<br /> <div style="margin-bottom: 2px;"> <span style="color: #6666cc;"> </span> <br /> <div style="margin-top: 5px; text-align: left;"> <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="font-size: 10px; margin-top: 5px; width: 60px;" type="button" value="BUKA" /> </div> <div style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> <br /> <style type="text/css"><br /> #gb{<br /> position:fixed;<br /> top:50px;<br /> z-index:+1000;<br /> }<br /> * html #gb{position:relative;}<br /> .gbtab{<br /> height:100px;<br /> width:30px;<br /> float:left;<br /> cursor:pointer;<br /> background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8NZdGtbEtab9VKiW8whCx1VVS_XnPM3ytlUaHb2Wq4r-yEfKkSuaXezIcRUDIsmPXimNkmQW8tZyASVbRGI5cGi2M7Hd2feJjoIyOZ1NazViPqzGXlqEjo2WlvFnA51v-7i-q4LXMxzzx/') no-repeat;<br /> }<br /> .gbcontent{<br /> float:left;<br /> border:2px solid #A5BD51;<br /> background:#F5F5F5;<br /> padding:10px;<br /> }<br /> </style><br /> <script type="text/javascript"><br /> function showHideGB(){<br /> var gb = document.getElementById("gb");<br /> var w = gb.offsetWidth;<br /> gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);<br /> gb.opened = !gb.opened;<br /> }<br /> function moveGB(x0, xf){<br /> var gb = document.getElementById("gb");<br /> var dx = Math.abs(x0-xf) > 10 ? 5 : 1;<br /> var dir = xf>x0 ? 1 : -1;<br /> var x = x0 + dx * dir;<br /> gb.style.right = x.toString() + "px";<br /> if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}<br /> }<br /> </script><br /> <div id="gb"><br /> <div class="gbtab" onclick="showHideGB()"> </div><br /> <div class="gbcontent"><br /> <br /> <span style="color: red;">isi dengan gadget ShoutMix, shout box, dll</span><br /> <br /> <br/><br /> <a href="<span style="color: blue;">http://dagujang.blogspot.com</span>">.<br /> </a><br /> <div style="text-align:right"><br /> <a href="javascript:showHideGB()"><br /> [close]<br /> </a><br /> </div><br /> </div><br /> </div><br /> <script type="text/javascript"><br /> var gb = document.getElementById("gb");<br /> gb.style.right = (30-gb.offsetWidth).toString() + "px";<br /> </script></div> </div> </div> <br /> sebelum menyimpan  ganti warna tulisan warna merah dengan gadget buku tamumum bisa dari shoutbox, shout mix, dll, yang sobat punya.<br /> <br /> kemudian warna biru ganti dengan alamat blog sobat<br /> dan simpan hasilnya bisa sobat lihat di blog sobat sendiri,,,<br /> sekian terima kasih,,,,,<br /> <br /> jangan lupa berkunjung ke blog ini lagi ya sobat<br /> dan jangan lupa tinggalkan komentar sobat....<br /> <br /> <br />

cara buat buku tamu sembunyi di samping blog

kang maryono 0 March 01, 2014

cara menampilkan buku tamu berada di samping blog tentunya sobat blogger menambahkan buku tamu di samping blog tanpa menghalangi pembaca dan jika pembaca ingin memberi komentar atau tanggapan  atau mengisi buku tamu itu bisa tinggal klik dan akan mun… baca selengkapnya

baca selengkapnya