Google Update Pagerank Lho! Cek Pagerankmu!

15 Komentar


Google Update Pagerank Lho! Cek Pagerankmu!. Udah lama banget gak ngepost, sampek sampek dashboard bloggerku udah mulai berasawang dan berkarat. Wkwkwk, Oke agan2 sekalian..entah aku yang ketinggalan informasi ato emang itu Informasi masih baru. Gini, stttt denger2 google update Pagerank . Udah tau kan..?

Nah, di Update Pagerank Google ini Mas yusa kecipratan dapet tambahan 1 pagerank, dan jadinya pagerank Blog ini duaaaaaa #Alaayutingting. Hehe, bagaimana pagerank blogmu, bertambah ato masih tetep.


Sekian., terimakasih...
[Read More...]


Website Notepad Online

14 Komentar


Website Notepad Online. Ini bukan kontes SEO sob, saya cuma mau bagi-bagi tips. Notepad adalah salah satu software bawaan windows yang memang simpel. Saya yakin pengguna windows sudah pada tau dan sering menggunakan software ini. Nah karena sobat sobat terkadang membuat atau mengedit kode HTML menggunakan notepad, berita gembira..sekarang ada notepad online yang ber-alamat word-pad.com.

Disitu sobat bisa menulis nulis sesuatu, Kode Css, HTML, Dll. Hahaha...memang tampilanya agak mirip dengan Note-pad yang ada di di windows sobat. Jadi dengan adanya Notepad online ini, sobat sobat tidak perlu lagi ribet nyari2 text editor. Sekian semoga bermanfaat ~.


[Read More...]


Membuat Tombol Like Facebook Dibawah Judul Post

23 Komentar


Cara Membuat Tombol Like Facebook Dibawah Judul Post. Ayo para blogger indonesia bersemangatlah... :) Jumpa lagi dengan saya Mas yusa. Akhirnya kali ini saya mempunyai kesempatan untuk Post sebuah Tutorial lagi. Emm..tutorial kali ini perlu obrak abrik template, karena peletakan Tombol like nya dibawah judul post.

But, tenang aja sob. Sebelum edit HTML/CSS sebaiknya Back Up dulu templatenya. Supaya kalo ada kerusakan bisa di perbaiki dengan cara upload Templatenya lagi. Oke beginilah caranya..


  • Login ke Blogger dengan akunmu.
  • Lalu Masuk ke Template.
  • Klik edit HTML.
  • Cari Kode ini : <data:post.body/>.
  • Setelah ketemu silahkan taruh kode yang ada dibawah ini (sesuai selera), lalu taruh dan letakan di atas kode <data:post.body/>.


<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>


<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>


 <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>

  • Taruh kode facebook yang anda pilih tepat diatas kode <data:post.body/> 
  • Lalu simpan template Sobat....
Sekian dan terimakasih, semoga bermanfaat bagi sobat... :D komenya ya bang... :)
[Read More...]


Cara Membuat Tabel Di Blog Dengan Cepat

40 Komentar


Cara Membuat Tabel Di Blog Dengan Cepat. Tabel, para Blogger ataupun non Blogger pasti tau dengan kosakata ini. :D haha, yap...kotak kotak yang berguna untuk memper-indah dan mempe-rapikan. Tabel juga bisa digunakan untuk gambar gambar award, supaya penempatan award blog sobat lebih rapi, gunakan lah tabel. Contohnya award blog Mas yusa yang menggunakan tabel. Bisa dilihat.

Langsung saja, disini Mas yusa tidak memberi kode. Melainkan memberi Website yang berguna dan mempermudah sobat sobat membuat tabel. Berikut Webnya :


Jadi sobat langsung aja isi Text area yang disediakan. untuk menambah kotak atau kolom tambahkan Rows dan Cols nya. Dan jika sudah selesai klik Generate HTML For Table. Ambil kodenya,

NB : Jika ingin mengatur lebar tabel, sisipkan kode :
style="height: 20px; width: 550px;"
Di kode <table border="1">. Maka kode nya jadi begini <table border="1" style="height: 20px; width: 550px;"> 

Selesai... Semoga bermanfaat, jangan lupa komentarnya ditunggu,
[Read More...]


Adsensecamp Atau Klik Saya

37 Komentar


Adsensecamp Atau Klik Saya. Para blogger pasti tidak asing dengan kata Adsensecamp atau Klik Saya. Yap begitulah sebutan iklan PPC lokal alias Pay Per Click indonesia. Memang banyak lagi PPC lokal selain Adsensecamp dan Klik Saya, di antara lain Kumpul Blogger,Sitti,Blogger Bersatu,Id Blog Network dan banyak lagi. Mas yusa hanya membahas Adsensecamp Dan Klik Saya karena cuma PPC ini yang Mas yusa pakai. Diantara dua PPC ini mana yang lebih menguntungkan para publisher? Ini lah yang akan Mas yusa bahas. Tentunya sobat/Publisher tidak mau rugi dengan dunia Peruangan online.

Mas yusa akan mengambil perbandingan kedua PPC ini dari Term Of Service (TOS) masing masing.

Adsensecamp
Klik Saya
Minimal pay out : Rp 100.000 Minimum Pay out : Rp 60.000
Tidak Ditentukan Pageview Alias Free Pageview Perbulan Harus Diatas 10.000
Minimal 1 Halaman Berisi 3 Script Iklan Tidak Ada Batasan Minimal, Alias Unlimited
1 IP Adress Hanya 1 Klik dan itu Selamanya 1 IP Adress Lebih Dari 1 klik Masih Dihitung
Penghasilan Sesuai Nominal Penghasilan Dipotong 50%
Melanggar TOS Akun langsung Suspend Melanggar TOS Pemotongan Komisi Atau Banned
Begitulah Term Of Service yang tertulis di Website PPC masing masing. Jadi mana pilihanmu..?
Jangan lupa berkomentar setelah baca. :)
[Read More...]


Membuat Headline News Melayang Di Bawah Blog

31 Komentar


Cara Membuat Headline News Melayang Di Bawah Blog. Selamat pagi para pembaca setia Blog Mas Yusa ini. Akhirnya setelah lama gak ada ide buat post Tutorial blog Mas yusa punya ide untuk membuat post dengan judul Cara Membuat Headline News Melayang Di Bawah Blog. Sebenarnya bukan Headline News, tapi hanya sebuah Text berjalan yang bisa di jadikan Headline News. Sobat tinggal kasih Link aktif aja. Untuk designya saya sendiri yang design. Background nya bisa di ganti sesuai selera.

Screen Shoot n Demo :




Berikut caranya :

  • Masuk ke  akun Blogger sobat.
  • Masuk ke "Template".
  • Backup/Cadangkan Template Dulu aja biar aman.
  • Lalu Edit Html, Jangan Lupa Expand Template Widget.
  • Cari Kode : ]]></b:skin>
  • Copy Kode dibawah ini dan taruh diatas kode ]]></b:skin>
/* footer dinamis */
#footer2 {
align: center;
position: fixed;
border-top: 3px solid #ff0000;
-webkit-border-radius: 5px;
background-color: #ac0;
background-image: -webkit-gradient(linear, 0 100%, 100% 0,
color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent),
color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)),
color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent),
to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,
transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
transparent 75%, transparent);
-webkit-background-size: 13px;
-moz-background-size: 13px;
width: 100%;
height:20px;
text-align: left;
color: black;
font-family: 'Aldrich', sans-serif;
font-weight: bold;
font-size: 15px;
z-index:10000;
bottom:0;
}

  • Kemudian Cari lagi kode : </body>
  • Copy kode dibawah ini dan taruh diatas kode </body>
<div id='footer2'>
<marquee onmouseout='this.start()' onmouseover='this.stop()' scrollamount='4'>Masukan Pesan anda disini</marquee>
</div>

  • Edit text yang berwarna merah dengan tulisan anda. 
  • Lalu Simpan Template sobat.
Selesai semoga bermanfaat. Jangan lupa komen komenya.. :D
[Read More...]


Cara Membuat Widget Translate (New Style)

21 Komentar


Cara Membuat Widget Translate (New Style). Jumpa lagi dengan saya Mas yusa, akhirnya Mas yusa punya ide untuk membuat post baru. Hehehe, mohon maaf sebelumnya buat sobat sobat yang kemarin kemarin berkunjung ke blog ini dan kunjungannya belum saya balas. ^^
Kali ini saya akan bagi bagi widget. Widget ini diperlukan disaat ada pengunjung mancanegara yang tak mengerti bahasa indonesia. Okelah langsung saja ke nama widget nya : Widget Translate. Kali ini lain dari yang lain, karena widget ini menghemat tempat. Dikarenakan peletakanya yang melayang.

Untuk yang tertarik dengan widget ini silahkan saja di ambil kodenya :

<div style="text-align: center; position: fixed; top: 4px; left: 4px;"><a class="translate" href="http://www.blogger.com/rearrange?blogID=2038117773261907794&action=editWidget&sectionId=sidebar&widgetType=HTML&widgetId=HTML1#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7cen&hl=en'); return false;"><img alt="English" title="English" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJY20QGwv5UyvxxhXC16SSnC4xEHzjspy5k2538vV0JIUaaQUrR0V9ZwpeEB_Yz6XTPDSUIKJz8xy-TZ8wN8HLcg30OVc-G2yDA3axEFKXimGnp3eQ-ZUqAny7pXHtgz2sPcrP19IkU8U/" style="cursor: pointer; margin-right: 8px;" align="absbottom" border="1" height="24" width="24" /></a><br /> <a class="translate" href="http://www.blogger.com/rearrange?blogID=2038117773261907794&action=editWidget&sectionId=sidebar&widgetType=HTML&widgetId=HTML1#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7cja&hl=en'); return false;"><img alt="Japanese" title="Japanese" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp3ReZ3yG-VtlXelqgZVIeC2ll46dlCJJoyv6xFkvWFEyzm2X1ZAK-0UoP36BYSboi-O0tCyn5LkIUPKSSbVx4E0iyFUcFLQlevk3MA4yLBrdGy-E21qOyWYekUOo5uPtF6Qec2JyP75rF/" style="cursor: pointer; margin-right: 8px;" align="absbottom" border="1" height="24" width="24" /></a><br /> <a class="translate" href="http://www.blogger.com/rearrange?blogID=2038117773261907794&action=editWidget&sectionId=sidebar&widgetType=HTML&widgetId=HTML1#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7cko&hl=en'); return false;"><img alt="Korean" title="Korean" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSGPs2ZFu5kTAGUS2Jm3EL6XHe96SHxEzwW1d0yv5vl7suS0it3rPxhLj-JxjXDJEAjBrnwgETEhHypTocPwr8mfhDmk8-NRhpjDhe8b1kajuzY72AVfyUQqTacGxA06gUHcBWyAqhxvU/" style="cursor: pointer; margin-right: 8px;" align="absbottom" border="1" height="24" width="24" /></a><br /> <a class="translate" href="http://www.blogger.com/rearrange?blogID=2038117773261907794&action=editWidget&sectionId=sidebar&widgetType=HTML&widgetId=HTML1#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7car&hl=en'); return false;"><img alt="Arabic" title="Arabic" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPKtFPsYeDo1ALrYl2Q0qjuBRMp_LujlPfXF5RcnogwMRfWv8LRP8a_c7LR0dgrH42VkmYw9hYBktT-y9BF5I2XD9j8lFuUPrr4_VYqUlMJQvV_osmVfFDpMq-ruhrPCFuFDPVYO5c_bM/" style="cursor: pointer; margin-right: 8px;" align="absbottom" border="1" height="24" width="24" /></a><br /> <a class="translate" href="http://www.blogger.com/rearrange?blogID=2038117773261907794&action=editWidget&sectionId=sidebar&widgetType=HTML&widgetId=HTML1#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7czh-cn&hl=en'); return false;"><img alt="Chinese Simplified" title="Chinese Simplified" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaSywgecjEc5o0y-P35Ashd_CBMRnE4sX4dgnq_L9z3SiJqMgOMi7iXwY6ohgLTprLGDJJz_7QzEgpR-onz35szriq_nCfSLFo9ob9nd2bCcqxvww8HjpaEAxzSVVeOMnLEJQQaLnmp7c/" style="cursor: pointer; margin-right: 8px;" align="absbottom" border="1" height="24" width="24" /></a></div><style></style><br /> <style> .translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; border:0; padding-left:0px; } .translate:hover img { filter:alpha(opacity=50); -moz-opacity: 0.50; opacity: 0.50; border:0; }</style>

Mohon maaf jika piliham bahasanya sedikit. Karena jika saya beri banyak bendera, akan membuat blog sobat berat. Sekian terimakasih... :*
KOMENYA Bang....
[Read More...]


Tips Dalam Memilih Template

28 Komentar


Tips Dalam Memilih Template. Assalamualaikum..wr.wb., Kali ini Mas yusa akan share post dengan kategori Tips blogger. Hehehe, udah di nanti nanti ya... :D Wkwkw Gr, Post ini berjudul Tips Dalam Memilih Template. Dan tentunya berisi tips tips yang mungkin bisa sobat jadikan panduan memilih template untuk blog sobat. Hehe, Okelah langsung aja yuk... Berikut tips tipsnya.

  • Pilih Template Yang Ringan. Menurut beberapa blogger poin ini sangat penting, karena berpengaruh dengan SEO. 
  • Pilih template yang tidak menggunakan banyak dekorasi gambar. Poin ini hanya untuk memenuhi syarat poin pertama.
  • Pilih template yang yang lebarnya pas dengan komputer berlayar monitor tabung. Ini tidak berpengaruh SEO, tapi agar penampilan blog sobat cantik. Ukur lebar template sobat pas dg komputer yang berlayar monitor. Karena kebanyakan kasus template yang mematok lebar dg monitor LCD jika dilihat pakai monitor TABUNG akan terlihat kebesaran dan akhirnya memakai scroll.. :/
  • Pilih template yang sesuai dengan tema blog. Biar mecing....
  • Pilih template dengan 1 sidebar. Agar pembaca lebih nyaman membaca post sobat, sebaiknya gunakan template yang bersidebar 1, karena adanya 2 sidebar membuat lebar post jadi kecil.
  • Jangan memilih template dengan OPACITY 0 pada seluruh conten blog.
Contoh :     


Sekian, mungkin masih ada kekurangan dalam tipsnya... :) Sobat bisa menambahkan tipsnya lewat komentar dan nanti post ini akan saya edit.

[Read More...]


Background Css Blog Keren Anti Lemot

39 Komentar

Background Css
Background Css Blog Keren Anti Lemot. Yup, benar sekali Mas yusa kali ini akan share Tutorial blog lagi. Setelah kemaren kemaren Turorial blognya absen, akhirnya Mas yusa punya ide untuk membuat postingan. Post kali ini isinya tutorial cara membuat background css yang mengurangi berat blog. Kok bisa? Jika sobat memakai background gambar, dan sobat beralih ke background css. Perbedaanya akan terasa.

Okelah langsung saja kita bahas intinya :

Style 1
Background Css

Kodenya :
background-color: #0ae;background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));background-image: -webkit-linear-gradient(rgba(255, 255, 255, .2) 50%, transparent 50%, transparent);background-image: -moz-linear-gradient(rgba(255, 255, 255, .2) 50%, transparent 50%, transparent);-webkit-background-size: 100px;-moz-background-size: 100px;
Style 2
Background Css

Kodenya :
background-color: #f90;background-image: -webkit-gradient(linear, 0 0, 100% 0, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, .2) 50%, transparent 50%, transparent);background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, .2) 50%, transparent 50%, transparent);-webkit-background-size: 100px;-moz-background-size: 100px;
Style 3
Background Css

Kodenya :
background-color: #ac0;background-image: -webkit-gradient(linear, 0 100%, 100% 0,color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)),color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent),to(transparent));background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,transparent 75%, transparent);background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,transparent 75%, transparent);-webkit-background-size: 100px;-moz-background-size: 100px;
Style 4
Background Css

Kodenya :
background-color: #c16;background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)),color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent),to(transparent));background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,transparent 75%, transparent);background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%,transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,transparent 75%, transparent); -webkit-background-size: 100px;-moz-background-size: 100px;
Keterangan : Untuk yang berwarna merah bisa diganti. Artinya yang berwarna merah adalah besar kecilnya ukuran per garis.

Cara pemasangan di backround blog :

  • Cari kode body (Ctrl+F)
  • Contoh :
background: #EEEEEE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM0ChAeAQk_ZqwxhAbUmdUtD-ADgNRyxSSYmHKX5eQlkxMzAoUsX52wBmBGxrG42jTGfHGoT-UFOtnJrM4_p1s1dHfJCUMHZQrwO8NnUCxYxzCF69TyHMGQ4XH3dp-xajjkZV8-u9LMEE/s1600/bg.png) top center no-repeat;
color: #333333;
width: 980px;
font-size: 12px;
font-family: Tahoma, Arial, Verdana;
margin: 0 auto 0;
padding: 0;
line-height: 20px;
}

  • Ganti semua yang berwarna merah dengan kode pilihan background css di atas.
Selesai... :) Komentarnya ya...

Source code : Djogzs.blogspot.com
[Read More...]


Jenis Jenis Border CSS Beserta Kode

36 Komentar



Jenis Jenis Border Css Lengkap. Setelah kemarin Mas Yusa share cara membuat border melengkung atau rounded, kali ini Mas Yusa akan share jenis jenis bordernya. Agar tidak cuma border lurus yang menjadi dekorasi blog anda. Kalau cuma border lurus itu ma biasa kalo / udah banyak yang pakek,tapi kalo yang aneh aneh baru itu tidak biasa :D alias luar biasa. Hahahaha.

Berikut jenis jenis border yang Mas Yusa share :

  • Border Solid
  • Border Dotted

  • Border Dashed
  • Border Inset

  • Border Outset

  • Border Double
  • Border Grovee
  • Border Ridge



Sekian dan terimakasih, jangan cuma baca ya... :) Komentar juga dong.....
[Read More...]


Cara Membuat Sudut Border Melengkung Dengan CSS

46 Komentar



Cara Membuat Sudut Border Melengkung Dengan CSS. Saya ucapkan mohon maaf karena penerbitan post Mas Yusa agak telat dikarenakan sibuk uprak uprak template di blog baru Si-naruto. Hehehehe..sangking sibuknya tadi malam cuma tidur 1 jam doang (Whattt....!!!). Hahaha :D Iya, karena uprak uprak template nya 80%. Wah ini ko jadi promosi blog baru ya... hahaha

Kali ini Mas yusa akan mengeshare tutorial Cara Membuat Sudut Border Melengkung Dengan CSS. Sobat pasti sudah sering melihat border blog sobat yang sudutnya melengkung Contohnya : Blog Saya (Hahaha). Membuat sudut border blog kita melengkung membuat blog kita lebih styles alias keren. Jika sobat ingin membuatnya baca selengkapnya di bawah ini.

Cara 1 Membuat Sudut Border Melengkung :
-webkit-border-radius: 8px;-moz-border-radius: 8px;
Mangsut dari -webkit adalah kode untuk memanggil border melengkung di  Google Chrome. Sedangkan -moz kode untuk memanggil border melengkung di Mozzila. Jika ingin menentukan radius kelengkungan, silahkan sobat ganti yang berwarna merah (8xp).

Maka jika di satukan dengan kode border akan jadi seperti ini :
border: 2px solid #ff0000;
-webkit-border-radius: 8px;-moz-border-radius: 8px;
Cara 2 Membuat Sudut Border Melengkung :
Jika sobat ingin membuat sudut border ada yang melengkung atau ada yang tidak melengkung, sobat gunakan kode di bawah ini :

-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomleft; 0px;
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-top-right-radius: 0px;

Top Left : kiri atas, Bottom Right : bawah kanan, Top Right : Atas Kanan, Bottom Left : Bawah kiri. Mangsut dari 0px adalah tidak beradius, atau tidak melengkung.

Maka jika disatukan dengan kode border akan jadi seperti ini :

border: 2px solid #ff0000;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomleft; 0px;
-webkit-border-top-left-radius: 15px;
-webkit-border-bottom-right-radius: 15px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-top-right-radius: 0px;

 Sekian tutorial dari Mas yusa yang telat ini. Semoga bermanfaat bagi anda yang membutuhkan maupun belajar.
[Read More...]


Sosial Share Icon Gaya Berputar Dengan CSS3

45 Komentar

Sosial Media
Sosial Icon Berputar Dengan CSS3 Styles. Akhirnya Mas yusa punya kesempatan buat nge-post. Sebenarnya bukan kesempatan buat nge post, tapi punya ide untuk nge-post. Kalo kesempatan sih banyak. Sama aja kan, punya kesempatan nge-post tapi gak punya ide. Hahahaha,


Seperti judulnya, Mas yusa akan bagi bagi Widget lagi. Sosial Icon Berputar Dengan CSS3, Nah... widget ini adalah widget untuk memudahkan pengunjung atau anda untuk share post anda di Sosial Media. Diantaranya : Facebook, Twitter, Digg, Technorati, Reddit, dan Stumbleupon. Widget ini mempunyai efek berputar ketika di Hover atau Mouse Over atau mudahnya lagi disorot. (Hahahaha). Berikut kodenya :


<style>p#hb_socialicons img {
 /* Spinning Social Icons Widget By Masyusablog*/
    -moz-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}

p#hb_socialicons img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

/* Spinning Social Icons Widget By Masyusablog */
</style>


<center><p id="hb_socialicons">
    <a href="http://www.facebook.com/btsnts/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGdXICsJU7rfE_dOGMAiqCgHUdr9V7hjRBVYpRnygSHwFy24HoqCys3kD1u9HYE3V8avIEyQ-tPnH12W_uUJszkZCtOKkjlFIp5eWk70WIYKBLzG4nGkG4A_K0gVoXqJ5SWSODDlvB9Hs/s1600/helperblogger.com-facebook.png" /></a>
    <a href="http://www.twitter.com/helperblogger/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKor2vnIZE_KnhVbQpnofFbbKZ4zJWmB_rCVIiOoKkJlaaQO7YFoPZGM2aEiFr-dWg9Dfw7r1ZSkuci-FvRtcq6WLn7wRou4_uiTPGK6bRWbv-ds14j1NcQsUa7spKP47GeUGfpGgoZMY/s1600/helperblogger.com-twitter.png" /></a>
    <a href="https://plus.google.com/u/0/106527290580119996124">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ9Te858PXM1oaTv-RTMf9EIGNaAiSedV3xo64Zp2PSfrw7ylduOlVk07B4OPRka8NLzDxzZ2G03qu3AASujFVWmb64OF1wBICdQMwi2MfrjLwSJLB1iMq-PrbiLpLw-58pJSMvyiMNEI/s1600/helperblogger.com-google_plus.png" /></a>
    <a href="http://www.feeds.feedburner.com/hblogger/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8EvCqHJO1KJVnnU7KiTYV0BMsXz0DgxfaovTqV9aIjGnzcpUaRjh-Pf782mRjjFkkY95ZvHTJCDN5V2TpgnWNg-hAkQ_nW-Mx8H-JTmnyLQNXHhRgj2A56PKTxxncakzZ8McLMKaGjRs/s1600/helperblogger.com-rss.png" /></a>
    <a href="http://www.youtube.com/helperblogger1/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE9CcytnuXL-okZPFEF2Qo0KOaJXtHLhv0e2mwzhQ-5S-NFbQzH4qaUJwScmAKH4Ih9oe-wA0Xc_pGbb8HejwyPp5V8Lddu4UdnVIWB6du2giGJj5E2inYV3cMcTffsUY-6HuCsrURK1Y/s1600/helperblogger.com-youtube.png" /></a>
</p></center>

  • Jika anda ingin Widget diatas tampil dibawah postingan, berikut caranya :
  • Masuk ke akun blogger anda,
  • Lalu masuk ke Rancangan->Edit HTML->Centang Expand Template
  • Jangan Lupa Back up dulu bro...!!
  • Cari Kode <div class='post-footer'> (Ctrl + F)
  • Lalu letakan kode Sosial Share Icon dibawah kode <div class='post-footer'>.
  • Lalu simpan template...
Semoga berhasil bang... :) Ada pertanyaan, tanyakan VIA Komentar.
[Read More...]


Facebook Like Dan Twitter Follow Box Melayang New Style

52 Komentar


Membuat Facebook Like Dan Twitter Follow Box Melayang. Huahahaha...akhirnya experimen widget Mas Yusa berhasil alias sukses :D. Kali ini Mas Yusa akan share widget lagi (Tentunya halal bro..!), widget melayang yang Mas yusa share kali ini tidak menggunakan script Jquery (Selamet deh berat blog anda) Hahaha. Mas yusa terinpirasi widget facebook like box melayang dari sobat planktoon.blogspot.com yang enggak makai jquery. Sebenarnya widgetnya hampir sama dengan bang planktoon, tapi ada tambahan dari saya, yaitu twitter follow box yang sangat keren (di desain mirip facebook like box)


Untuk Screen Shootnya :
 

Nah, untuk yang tertarik...langsung aja simak caranya :
  • Masuk akun Blogger anda
  • Masuk Rancangan/Tata Letak
  • Klik Add widget->HTML/Java Script
  • Masukan kode di bawah ini :
<!-- Script kotak like Facebook dan Twitter Follow box Melayang -->
<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
background-color: transparancy;
width: 300px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8F1mmLp-oYHhuYd-BrIS8Y84VbAhwqqVysY0XoBvcQC_CbpiLpDxr7Wm__2VhyphenhyphenOSRXua07a3Dc6gb63H8A7kT1V1EOkljbRmVB1Hw68c7frYwsci2o9hN5U6sXCZxXljOPBlBPBJk2zl6/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/MasyusaBlogspotcom/317602688268316&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 230px; width: 300px;background:#fff;"></iframe>

<script type="text/javascript"
src="http://s.moopz.com/fanbox_init.js"></script><div
id="twitterfanbox"><script
type="text/javascript">fanbox_init("yusa_syihab");</script
type="text></div
id="twitterfanbox">

</div>
</center></td>
</tr>
</table>
</div>
<!-- akhir -->
  • Note : Untuk yang berwarna BIRU, ganti dengan url Facebook Fanpage blog anda. Dan untuk yang berwarna MERAH ganti dengan ID Twitter anda (Tidak pakek @).
  • Lalu Simpan.
Jika tidak berhasil, mari bertanya VIA KOMENTAR DIBAWAH... :D
Jangan lupa klik iklan Mas Yusa ... :)
[Read More...]


Cara Membuat Blockquote Scroll Otomatis Dengan Css

61 Komentar


Cara Membuat Blockquote Scroll Otomatis. Yup, kali ini Mas Yusa akan sharing post yang di kategorikan Tips Ngeblog. Anda para blogger pasti sudah tidak asing lagi dengan Blockquote. Karena hampir semua blogger kalau ingin membagikan kode HTML maupun CSS atau lainya pakai blockquote, ada juga yang pakek Text area, malah ada yang gak pakek apa2.....(Waduh,bisa panjang tuh post).

Membuat blockquote scroll otomatis memiliki fungsi, yaitu menghemat tempat. Wah...bermanfaat sekalikan bagi blogger. Maka dari itu, kita langsung saja ke isi post. Karena jika dibahas lebih detail post ini akan panjang seperti ular seperti ular yang sangat berbisa sangat berbisa (Ups). Perhatikan cara di bawah :
  • Masuk ke akun blogger anda.
  • Pilih menu Rancangan->Edit HTML->Expand Template Widget
  • Ingat!!!jangan lupa Backup dulu bang templatenya.
  • Kemudian cari kode berikut (Ctrl + F) :
.blockquote {Bla..bla..bla...
  • Ganti isi kode yang didalam kurung kurawa / Bla...bla...bla dengan kode dibawah ini :
 background: #F2F2F2;
  margin: 0 25px 15px;
    padding: 10px 20px 10px 15px;
        border: dotted 2px #D8D8D8;
overflow:auto;
max-height:250px;
-webkit-box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
-moz-box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
  • Maka kode blockquote anda akan jadi seperti ini :
.blockquote {
    background: #F2F2F2;
    margin: 0 25px 15px;
    padding: 10px 20px 10px 15px;
        border: dotted 2px #D8D8D8;
overflow:auto;
max-height:250px;
-webkit-box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
-moz-box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
box-shadow:
1px 1px 0 rgba(0, 0, 0, 0.100),
3px 3px 0 rgba(255, 255, 255, 1.0),
4px 4px 0 rgba(0, 0, 0, 0.125),
6px 6px 0 rgba(255, 255, 255, 1.0),
7px 7px 0 rgba(0, 0, 0, 0.150),
9px 9px 0 rgba(255, 255, 255, 1.0),
10px 10px 0 rgba(0, 0, 0, 0.175);
}
  •  Untuk yang tidak mempunyai kode :
.blockquote {bla...bla...bla
  • Maka langsung aja copy kode yang berada di bawah  "Maka kode blockquote anda akan jadi seperti ini" lalu taruh di atas ]]></b:skin>
  • Dan Simpan Template.
Dan lihat hasilnya. This is it..Cara Membuat Blockquote Scroll Otomatis ala Mas Yusa Blog.
Mari berkomentar.
[Read More...]


Cara Membuat Widget Sharing Melayang Keren

66 Komentar


Cara Membuat Widget Sharing Melayang Keren . Sepertinya judulnya kurang cocok ya.... :D hahaha...jujur, memang Mas Yusa kali ini bingung mau memberi judul apa pada post yang Mas Yusa yang diterbitkan diakhir pekan ini. Dan akhirnya para pekerja di otak Mas Yusa sepakat memberi judul Cara Membuat Widget Sharing Melayang Keren . Hahahahaha. Sharing post blog ke sosial media seperti Facebook, Twitter, Google+ memang sudah tidak asing lagi bagi para blogger.

Widget Sharing yang Mas Yusa share ini tidak lagi di bawah post .Melainkan di bokong (Eits...) alias di bawah pojok. Di dalam widget ini sudah tersedia beberapa social media diantaranya : Facebook, Twitter, Google+, Pinterest, Tumblr. Nah untuk screenshootnya ini dia :



Atau kalo masih kurang jelas, lihat DEMO

Nah bergini caranya :
  • Masuk akun blogger kamu.
  • Masuk Rancangan->Edit HTML->Expand Template Widget
  • Cari kode </body> (Ctrl+F)
  • Lalu Ambil kode dibawah ini dan taruh kode dibawah ini tepat diatas kode </body>


<!-- Start Shareaholic Sassy Bookmarks HTML (helperblogger.com)-->
<div class="shr_ss shr_publisher">

</div>
<!-- End Shareaholic Sassy Bookmarks HTML (helperblogger.com) -->
<!-- Start Shareaholic Sassy Bookmarks settings -->
<script type="text/javascript">
var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
</script>
<!-- End Shareaholic Sassy Bookmarks settings -->
<!-- Start Shareaholic Sassy Bookmarks script -->
<script type="text/javascript">
(function() {
var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js";
var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
})();
</script>

<!-- End Shareaholic Sassy Bookmarks script (helperblogger.com) -->

  • Lalu Simpan Template Kamu....... :)
Sekarang lihat blog mu... Taram.....munculah widgetnya.... :) Selamat mencoba dan semoga sukses.
Kode Source : Helperblogger
[Read More...]


Cara Membuat Threaded Comment Keren (Fitur Reply)

78 Komentar

Cara Membuat Threaded Comment Lebih Keren (Fitur Reply). Selamat pagi sobat sobat Mas yusa, mungkin post ini melanjutkan dari post bang dirman (Planktoon.blogspot.com). Pernah saya berpikir ingin punya threaded coment dengan fitur reply seperti wordpress. Karena saya kurang tau cara membuatnya....saya PM barng dirman dari facebook. Lalu dia menjawab dengan menyertakan link cara untuk membuat threaded comment. Tapi... (Ada tapinya) penampilan threaded comment yang di share bang dirman masih default alias belum di edit.

Nah maka dari itu....saya akan share Cara Membuat Threaded Comment Lebih Keren (Fitur Reply). Agar anda para admin mudah dalam menjawab para komentator blog anda. Dilain itu, kelebihan dari threaded comment ini yaitu fitur reply tanpa membuka jendela baru seperti fitur reply blog Mas Yusa yang dibawah. Jadi ketika di klik Reply. Kotak komentar akan datang menghampiri...

Screen shoot :


Langsung saja masuk ke caranya :

  • Sebelumnya backup dulu aja templatenya. (Biar aman)
  • Masuk Edit HTML blog (Rancangan->Edit HTML->Expand Template Widget)
  • Cari kode (Ctrl + F) : <b:include data='post' name='comments'/>
  • Ganti kode diatas dengan kode dbawah :
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
  • Note : jika anda sudah memakai Threaded comment langsung aja ke langkah selanjutnya. Dan jika anda menemukan dua kode <b:include data='post' name='comments'/> ganti kedua duanya...
  • Nah kita melaju ke tahap CSS nya..
  • Cari kode ]]></b:skin>
  • Lalu Copy dan paste kode CSS di bawah ini tepat diatas kode ]]></b:skin>
.comments {
  clear: both;
  margin-top: 10px;
  margin-bottom: 0px;
  line-height: 1em;
}
.comments .comments-content {
  font-size: 12px;
  margin-bottom: 16px;
font-family: Verdana;
font-weight: normal;
text-align:left;
line-height: 1.4em;
}
.comments .continue a, .comments .comment .comment-actions a {
display:inline;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding: 2px 5px;
text-decoration: none;
text-shadow:0 1px 1px rgba(0,0,0,.3);
color:#FFF;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-right: 10px;

border: 1px solid #3079ED;
background: #0066FF;
background: -webkit-gradient(linear, left top, left bottom, from(#0099FF), to(#009999));
background: -moz-linear-gradient(top, #0099FF, #009999);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#0099FF&#39;, endColorstr=&#39;#009999&#39;);

}
.comments .continue a:hover, .comments .comment .comment-actions a:hover {
  text-decoration: none;
background:#0099FF;
background: -webkit-gradient(linear, left top, left bottom, from(#009999), to(#0099FF));
background: -moz-linear-gradient(top, #009999, #0099FF);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#009999&#39;, endColorstr=&#39;#0099FF&#39;);
}

.comments .continue a:active, .comments .comment .comment-actions a:active {
position: relative;
top:1px;
background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#0099CC));
background: -moz-linear-gradient(top, #0066FF, #0099CC);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#0066FF&#39;, endColorstr=&#39;#0099CC&#39;);
}

.comments .comments-content .comment-thread ol {
  list-style-type: none;
  padding: 0;
  text-align: none;
}
.comments .comments-content .inline-thread {
  padding: 0.5em 1em 0 1em;
}
.comments .comments-content .comment-thread {
  margin: 8px 0px 0px 0px;
}
.comments .comments-content .comment-thread:empty {
  display: none;
}
.comments .comments-content .comment-replies {
  margin-top: 1em;
  margin-left: 40px;   font-size:12px;
}
.comments .comments-content .comment {
  padding-bottom:8px;
  margin-bottom: 0px
}
.comments .comments-content .comment:first-child {
  padding-top:16px;
}
.comments .comments-content .comment:last-child {
  border-bottom:0;
  padding-bottom:0;
}
.comments .comments-content .comment-body {
  position:relative;
}
.comments .comments-content .user {
  font-style:normal;
  font-weight:bold;
}

.comments .comments-content .user a {
  color: #444;
}

.comments .comments-content .user a:hover {
  text-decoration: none;
color: #555;
}

.comments .comments-content .icon.blog-author {
  width: 18px;
  height: 18px;
  display: inline-block;
  margin: 0 0 -4px 6px;
}
.comments .comments-content .datetime {
  margin-left:6px;
color: #999;
font-style: italic;
font-size: 11px;
float: right;
}

.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 12.5px;
line-height: 19px;
}
.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 12.5px;
line-height: 19px;
  text-align:none;
margin: 15px 0 15px;
}
.comments .comments-content .owner-actions {
  position:absolute;
  right:0;
  top:0;
}
.comments .comments-replybox {
  border: none;
  height: 250px;
  width: 100%;
}
.comments .comment-replybox-single {
  margin-top: 5px;
  margin-left: 48px;
}
.comments .comment-replybox-thread {
  margin-top: 5px;
}
.comments .comments-content .loadmore a {
  display: block;
  padding: 10px 16px;
  text-align: center;
}
.comments .thread-toggle {
  cursor: pointer;
  display: inline-block;
}

.comments .comments-content .loadmore {
  cursor: pointer;
  max-height: 3em;
  margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
  max-height: 0px;
  opacity: 0;
  overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
  display: none;
}
.comments .thread-toggle {
  display: inline-block;
}
.comments .thread-toggle .thread-arrow {
  display: inline-block;
  height: 6px;
  width: 7px;
  overflow: visible;
  margin: 0.3em;
  padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC&quot;) no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==&quot;) no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
  float: left;
  overflow: hidden;
}
.comments .avatar-image-container img {
  width: 36px;
}
.comments .comment-block {
  margin-left: 48px;
  position: relative;
padding: 15px 20px 15px 20px;
background: #F7F7F7;
border: 1px solid #E4E4E4;
overflow: hidden;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-image: initial;
}
  • Lalu Simpan Template.
Selesai.....Jika ada masalah silahkan ditanyakan..
[Read More...]


Membuat Template Blogger Sendiri Dengan Artisteer

74 Komentar


Membuat Template Blogger Sendiri Dengan Artisteer. Sepertinya saran dari bang Dirman belum terlaksana.Hahaha, Ternyata Mas Yusa masih membuat postingan dengan syarat postingan sebelumnya sudah terindex oleh Om google (Kan google masih muda). Yah mau gimana lagi?Dah jadi kebiasaan dan mungkin dah jadi budaya blog ini.. (Aneh)

Oke langsung saja. Mungkin dari pengunjung dan pembaca setia blog Mas Yusa sudah punya software yang akan Mas Yusa share. Hehehe, Anda sebagai blogger sudah pernah lihat isi Kode-kode dari Template kan?. Saya yakin sudah, karena blogger tidak pernah luput dari menu Edit Html yang berisi kode kode HTML yang bagi saya rumit. Pernahkah anda berpikir untuk membuat Template sendiri? Nah untuk anda yang ingin berkreasi dengan membuat Template sendiri. Nih Mas Yusa punya software yang mungkin bisa membantu anda. Dengan software yang Mas Yusa share, anda tidak perlu Terlalu utak atik kode kode HTML. Karena dari background, footer, sidebar dan header bisa di edit Tanpa mengedit HTMLnya :)

 

Tidak hanya template Blogger. Artisteer juga bisa membuat template Wordprees, Joomla dan yang satu lagi lupa namanya ^^. Untuk download,silahkan klink DOWNLOAD di bawah ini. Sory mas yusa gak sekalian share keygenya,,, :) mungkin keygenya bisa dicari di Om Google.

Get it from CNET Download.com!
[Read More...]


Meningkatkan Traffic Blog Dengan AutoSurf

59 Komentar


Meningkatkan Trafic Blog Dengan Auto Surf. Mungkin ada yang sudah pernah dengar tentang AutoSurf, bagi yang belum Mas yusa akan menjelaskan. Menurut penulisanya Auto yang berarti otomatis Surf yang berarti berselancar (Arti Mudahnya blogwalking otomatis). Tapi situs ini tidak seperti arti dari AutoSurf, melainkan situs dengan cara kerja Trafic Exchange. Tapi dengan cara otomatis, jadi setiap beberapa detik kita akan di alihkan ke blog lain dengan otomatis. Tanpa klik klik. Kita tinngal klik Start Surfing dan otomatis kita akan blogwalking ke Blog orang laen dan pastinya blog orang laen itu akan mengujungi balik blog kita,

Langsung aja Sing Up di www.surfingforvisitors.com

Langsung isi aja formulir pendaftaran yang anda. Setelah anda berhasil registrasi , langsung klik pada Home-> Member Home-> Add new site.
Site Name : Isi dengan judul blog anda
Site Url : Isi dengan alamat blog sobat.
Site language : English
dan klik add site.

Jika sudah semua...Klik Start Surfing pada menu.

Selesai...Maaf jika kurang jelas.... :) wkwkwkwkwkw

Trik-> Untuk menghemat bandwitch / kuota, sebaiknya disable aja image di browser.
[Read More...]


Tips Agar Post Ramai Komentar

72 Komentar


Tips Agar Post Ramai Komentar. Seperti biasa Mas yusa akan update post setelah post yang sebelumnya sudah di index oleh google. Ternyata google butuh 4 hari untuk ngindex blog Mas yusa ini. Tau gak tadi waktu saya buka dashboard! Ternyata ada sarang laba laba n pada berdebu semua...karena udah 4 hari nggak aku buka (Wkwkwkw)

Langsung aja kita bahas post yang berjudul "Tips Agar Post Ramai Komentar" ini. Sebenarnya mudah, tapi ada sesuatu penambahan dari Mas yusa yang mungkin bisa lebih menambah traffic komentar di blog anda. Berikut tips Tips Agar Post Ramai Komentar :
  1. Tips pertama ini adalah inti (Paling penting), karena jika tidak menjalankan tips nomor 1, mungkin tips tips berikutnya gak berjalan . Tips pertama yaitu dengan Blogwalking dan Meninggalkan pesan atau komentar yang berisi mengajak berkomentar di post blog anda. Contoh : Absen gan, absen juga ya di post ane...hehehe. ,Berkunjung gan..komentar balik ditunggu , Nice post sob...komentari post ane yah..Cukup 3 saja contoh dari Mas yusa. Atau bisa juga anda berkomentar sesuai dengan isi post, Niscaya si admin blog akan segera berkomentar juga di blog anda.
  2. Cara kedua cukup penting. Yaitu buat comment as jadi lebih SEO friendly. Caranya : Masuk setelan blog->Pilih tab komentar->Ganti siapa yang berkomentar jadi Siapapun - termasuk anonim->Simpan setelan. Kenapa demikian? ini jawaban versi Mas yusa, karena para komentator lebih suka berkomentar di blog yang menyediakan komentar dengan profil URL dan NAMA termasuk saya.
  3. Cara ketiga adalah Mengilangkan kode captcha di komentar blog. Caranya : Masuk setelan->Pilih tab komentar lagi->Ganti 'Tampilkan verifikasi kata untuk komentar?' Menjadi 'Tidak'.
  4. Cara keempat yaitu dengan Membuat post blog yang menarik dan sedikit bertentangan. Contohnya post Mas yusa yang berjudul 3000 backlink gratis dengan software. Kan pasti ada yang menentang tuh sampai sampai saya dapet 42 komentar lho (Pamer....), karena sebenarnya pakai software untuk mendapat backlink itu tidak baik untuk blog.
Berakhirlah sudah Tips Agar Post Ramai Komentar. Yang terpenting adalah nomor 1. Karena jika nomor 1 tidak di jalankan,nomor berikutnya juga tidak akan berjalan. Sekiat tipss dari Mas Yusa..
Silahkan berkomentar? :)
[Read More...]


Welcome to: Mas Yusa Blog | Twitter: Yusa_Syihab & Google+: Yusa Syihab
 
Follow Me▶

Kembali Ke Atas Copyright © 2012 | Template Platinum Theme Modified by Mas Yusa