Jumat, 23 Maret 2012

Cara Pasang Tombol Share AddThis di Blog

 KUCOPAS - Kali ini saya akan posting tentang Cara pasang Tombol Share di Blog, Khusus nya Cara Buat Tombol Share AddThis di Blog atau Cara pasang Tombol Share Addthis di Blog, karena pada posting sebelum nya saya sudah posting artikel tentang Cara buat dan pasang Tombol Sharing is Sexy di Blog, klik saja jika sobat ingin pasang Tombol Sharing is Sexy di Blog sobat.

Oke sobat, dari pada banyak kata mending kita Langsung menuju ke inti Cara Buat dan Pasang Tombol Share AddThis di Blog.
Silahkan sobat mengikuti langkah-langkah nya sebagai berikut di bawah ini :

1. Yang harus sobat lakukan adalah >> "Masuk/login" ke blog sobat.
2. Silahkan sobat buka tab baru lalu masuk ke >> situs www.addthis.com
3. Dan sobat akan di bawa ke halaman seperti gambar di bawah ini :

4. Silahkan pilih ukuran Tombol Share AddThis yang sobat inginkan, Lalu klik >> "Get AddThis" seperti pada gambar di atas.
5. Kemudian sobat >> "Register" ada pilihat untuk register yaitu melalui akun facebook, akun twitter, akun Google dan Oped id, silahkan sobat pilih yang paling gampang menurut sobat, saran saya sobat pakai akun google saja karena tadi sudah login di blog sobat.
Lihat gambar berikut :


6. Karena sobat akan pasang tombol share AddThis di Blog, maka silahkan sobat pilih >> "Blogger" atau yang lain nya di sebelah kiri, lalu di tandai.
Lihat gambar di bawah ini :

7. Kemudian silahkan sobat klik >> "Install Blogger Widget" seperti gambar di atas.
8. Lalu sobat akan di bawa ke halaman seperti gambar di bawah ini :

9. Silahkan sobat pilih Blog yang akan sobat pasangi Tombol Share AddThis, seperti contoh gambar diatas adalah Blog "KUCOPAS".
10. Kemudian sobat klik >> "Menambah Widget" (otomatis menambah widget di blog sobat) atau klik >> "Edit Konten" (Manual menambah widget di blog sobat).
11. Selesai dan lihat hasilnya, semoga hasilnya menjadi Tombol Share seperti yang sobat inginkan.

NB :
- Jika sobat ingin Pasang Tombol Share AddThis di Bawah Postingan Blog,

1. Silahkan sobat langsung >> "Masuk/Login" Ke Blog sobat.
2. Kemudian sobat pilih >> "Rancangan".
3. Langkah selanjut nya sobat pilih >> "EDIT HTML".
4. Lalu jangan lupa sobat >> "Centang Expand Widget Template".

5. Silahkan sobat cari Kode <data:post.body/> , gunakan CTRL+F untuk mempercepat pencarian.
6. setelah ketemu kemudian sobat letakan Kode script dari "Edit Konten" di atas, lalu sobat taruh tepat di Bawah Kode <data:post.body/> , maka hasil nya Tombol Share AddThis akan terlihat di bawah postingan blog sobat.

Selamat buat sobat yang sudah bisa Pasang Tombol Share AddThis di Blog, Semoga Arikel posting ini sangat bermanfaat untuk sobat KUCOPAS semua.


Selasa, 20 Maret 2012

Cara Buat Link Warna-warni atau Link Rainbow (link pelangi) di Blog

 KUCOPAS - Selamat datang sobat, kali ini saya akan posting artikel tentang Cara Buat Link Warna-warni atau Link Rainbow (link pelangi) pada Blog.


Sekedar pengertian saja untuk sobat KUCOPAS semua, bahwa Rainbow link atau link pelangi atau Link warna warni merupakan suatu link dimana jika mouse pointer kita di arahkan ke link tersebut maka link nya akan berkedip warna-warni seperti warna pelangi.

Jika sobat masih belum mengerti dan bingung. Silahkan sobat coba arahkan kursor mouse sobat ke salah satu link di blog KUCOPAS ini untuk melihat hasilnya.
Gimana, jadi warna-warni kan?
Nah untuk membuat dan memasang link warna-warni ini di blog sobat, caranya sangat mudah, karena sobat hanya cukup memasukkan kode javascript-nya pada blog sobat, maka efeknya akan langsung berfungsi dan terlihat jadi warna-warni link nya.
Biar lebih mudah dan gampang, Silahkan sobat ikuti langkah-langkah nya sebagai berikut ini :

1. Silahkan sobat >> "Masuk/Login" ke blog sobat.
2. Kemudian sobat pilih pada menu >> "Edit HTML"
3. Jangan lupa sobat centang >> "Expand Template Widget"
4. Lalu sobat cari kode <body> , Gunakan CTRL+F untuk mempermudah pencarian.
5. Jika sudah ketemu, silahkan sobat letakkan kode script dibawah ini diatas kode <body> 

<script src='http://hbhost.googlecode.com/files/rainbow-link.js'/>

6. Sebelum sobat klik Save Template, silahkan klik "preview/Pratinjau" terlebih dahulu, demi untuk menghindari kesalahan saat Edit Html.
7. Jika hasil nya sudah berfungsi jadi Link Warna-warni, artinya sobat sudah berhasil.
8. Silahkan sobat klik "Simpan Template".
9. Selesai.  dan silahkan sobat lihat hasilnya.

Semoga posting Cara Buat Link Warna-warni atau pelangi (Rainbow Link) di blog, Sangat bermanfaat untuk sobat KUCOPAS semua.



Cara Membuat dan Memasang Tombol Sharing is Sexy Di Blog

 KUCOPAS - Selamat untuk sobat kucopas, karena sobat masuk pada pilihan yang tepat untuk mencari posting artikel tentang Cara Pasang Tombol Share Di Bawah Posting Blog atau Cara Buat Tombol Sharing is Sexy di Blog.

 Pada artikel sebelumnya saya sudah posting tentang Cara Buat Animasi Berjalan di Bagian Bawah Blog, dan kali ini saya posting lagi tentang Cara Pasang Tombol Share Keren Di Bawah Posting Blog, khusus nya Cara buat dan pasang Tombol Sharing is Sexy di Blog.

Fungsi nya sangat banyak sekali jika Sobat  pasang Tombol Sharing is Sexy di Blog, karena akan sangat dapat memudahkan Sobat atau pengunjung blog untuk Mengirim Artikel ke Berbagai Social Bookmark seperti Facebook,Twitter,Digg dan lain sebagai nya.

Oke sobat kita langsung saja menuju Cara Buat Tombol Sharing is Sexy di Blog, silahkan sobat ikuti langkah-langkah nya di bawah ini :

1. Silahkan sobat langsung >> "Masuk/Login" Ke Blog sobat.
2. Kemudian sobat pilih >> "Rancangan".
3. Langkah selanjut nya sobat pilih >> "EDIT HTML".
4. Lalu jangan lupa sobat >> "Centang Expand Widget Template".
5. Kemudian sobat cari Kode >> ]]></b:skin> , gunakan CTRL+F untuk mempercepat pencarian.
6. Setelah Ketemu silahkan sobat Letakan Kode script yang berwarna BIRU di Bawah ini tepat di Bawah Kode ]]></b:skin>

<style type='text/css'>
div.sexy-bookmarks { height:54px; background:url(http://img709.imageshack.us/img709/57/sharing.png) no-repeat left bottom;position:relative; width:540px }
div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url(http://img709.imageshack.us/img709/57/sharing.png) no-repeat right bottom; position:absolute; right:-17px }
div.sexy-bookmarks ul.socials { margin:0 !important;padding:0 !important; position:absolute; bottom:0;left:10px }
div.sexy-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important }
div.sexy-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important;f ont-size:0 !important; color:transparent !important}
.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover { background:url(http://img406.imageshack.us/img406/9198/sexyy.png) no-repeat !important }
.sexy-furl { background-position:-300px top !important }
.sexy-furl:hover { background-position:-300px bottom !important }
.sexy-digg { background-position:-500px top !important }
.sexy-digg:hover { background-position:-500px bottom !important }
.sexy-reddit { background-position:-100px top !important }
.sexy-reddit:hover { background-position:-100px bottom !important }
.sexy-stumble { background-position:-50px top !important }
.sexy-stumble:hover { background-position:-50px bottom !important }
.sexy-delicious { background-position:left top !important }
.sexy-delicious:hover { background-position:left bottom !important }
.sexy-yahoo { background-position:-650px top !important }
.sexy-yahoo:hover { background-position:-650px bottom !important }
.sexy-blinklist { background-position:-600px top !important }
.sexy-blinklist:hover { background-position:-600px bottom !important }
.sexy-technorati { background-position:-700px top !important }
.sexy-technorati:hover { background-position:-700px bottom !important }
.sexy-myspace { background-position:-200px top !important }
.sexy-myspace:hover { background-position:-200px bottom !important }
.sexy-twitter { background-position:-350px top !important }
.sexy-twitter:hover { background-position:-350px bottom !important }
.sexy-facebook { background-position:-450px top !important }
.sexy-facebook:hover { background-position:-450px bottom !important }
.sexy-mixx { background-position:-250px top !important }
.sexy-mixx:hover { background-position:-250px bottom !important }
.sexy-script-style { background-position:-400px top !important }
.sexy-script-style:hover { background-position:-400px bottom !important }
.sexy-designfloat { background-position:-550px top !important }
.sexy-designfloat:hover { background-position:-550px bottom !important }
.sexy-syndicate { background-position:-150px top !important }
.sexy-syndicate:hover { background-position:-150px bottom !important }
.sexy-email { background-position:-753px top !important }
.sexy-email:hover { background-position:-753px bottom !important }
</style>

7. Selanjutnya silahkan sobat cari Kode <data:post.body/> , gunakan CTRL+F untuk mempercepat pencarian.
8. setelah ketemu kemudian sobat letakan Kode script berwarna BIRU di bawah ini Tepat di Bawah Kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'><div class='sexy-bookmarks'>
<ul class='socials'>
<li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
<li class='sexy-syndicate'><a href='http://feeds.feedburner.com/blogspot/ZqAec' title='Subscribe to RSS'/></li>
<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
</ul>
<span class='sexy-rightside'/></div></b:if>

8. Sebelum sobat simpan/save silahkan klik >> "Preview/Pratinjau", demi untuk menghindari kesalahan saat Edit HTML.
9. Jika menurut sobat hasil nya sudah cocok seperti yang sobat inginkan, silahkan sobat klik >> "Save/Simpan".
10. Selesai dan lihat hasil nya.

KETERANGAN :
- Jika Sobat Menemukan dua kode <data:post.body/> atau lebih, saran saya sobat pilih saja kode <data:post.body/> yang ke dua.
- Silahkan sobat atur dan edit agar sesuai dengan template blog sobat, karena penerapan dan pemasangan kode script mungkin bisa berbeda untuk setiap template blog.
- Menurut pengalaman saya dalam memasang Tombol Sharing is Sexy di Blog sangat mudah, karena saya hanya ikuti tutorial di atas dan berhasil, contoh nya bisa sobat lihat di blog KUCOPAS ini. lihat contoh di bawah posting ini.

Semoga artikel posting tentang Cara Pasang Tombol Sharing is Sexy di Blog sangat bermanfaat untuk sobat KUCOPAS semua.
HapPy BLog9inG...


Cara Membuat Animasi Berjalan di Bagian Bawah Blog

 Cara Membuat Animasi Berjalan di Bagian Bawah Blog - Hai sobat... Selamat berkunjung ke blog yang katrok dan Ndeso ini ya... hehehehehe...
Kali ini saya akan share artikel tentang Cara Buat Animasi Berjalan di Blog atau Cara Buat Animasi Berjalan di Bagian Bawah Blog.
pada posting sebelum nya saya sudah share artikel tentang Cara Buat Foto dan Gambar Bergerak di Blog atau Cara buat foto atau gambar berjalan di blog, silahkan sobat klik DISINI jika ingin membuat nya.

 Pernahkah sobat pada suatu saat mengunjungi Blog milik orang lain dan sobat melihat ke bawah ada sebuah animasi atau gambar yang bergerak ke kiri lalu ke kanan ataupun sebailknya?
Dari pada hanya heran dan bingung, sobat bisa melihat contoh nya berada di bawah Blog KUCOPAS ini.
Sangat bagus dan menarik bukan?
heehehehe...

Jika sobat tertarik dan ingin membuat nya, saya punya tips dan trik nya untuk membuat animasi berjalan seperti itu.
Silahkan sobat ikuti langkah-langkah nya untuk membuat Foto dan Gambar Bergerak di Blog atau Cara buat foto atau gambar berjalan di blog sebagai berikut ini :

1. Silahkan sobat >> "masuk/login" ke Blog sobat.

2. Kemudian sobat cari dan klik >> "Rancangan".

3. Setelah itu sobat klik >> "Elemen Laman".

4. Lalu sobat klik >> "Tambah Gadget".

5. Setelah itu sobat cari >> "HTML/Javascript".

6. Lalu silahkan sobat masuk kan "Kode Script" di bawah ini :

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="9"><script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADabrbleach.txt" name="DADrun"></script></marquee></div>

Atau kode script yang di bawah ini :

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com" target="_blank"><img border="0" src="http://i1217.photobucket.com/albums/dd384/TauFixers/MyIcon.png?t=1303003796" style="cursor: pointer;" /></a></marquee></div>

Atau sobat masukkan semua Kode Script warna Biru di bawah ini:

Zombie Animasi Berjalan Loncat-Loncat


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i1093.photobucket.com/albums/i440/putraeka1/th_avatar2088630_11.gif?t=1295005006" style="cursor: pointer;" /></a></marquee></div>


KETERANGAN :
- Silahkan sobat pilih salah satu saja Kode Script di atas.
- Untuk yang berwarna BIRU, sobat bisa ganti dengan URL gambar sobat sendiri.
- Apabila sobat tidak mempunyai URL sobat sendiri, saya akan kasih variasi Animasi yang lain nya di bawah ini :

Animasi Babi Pink Bergoyang

<script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADabpig.txt" name="DADrun"></script>

Animasi Sasuke Berjalan

<script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADablsasuke.txt" name="DADrun"></script>

Animasi Kakashi berjalan

<script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADablkakashi.txt" name="DADrun"></script>

Animasi Naruto berjalan

<script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADablnaruto.txt" name="DADrun"></script>

Bleach Animasi Berlari

<script type="text/javascript" language="javascript" src="http://dickelodeon.googlecode.com/files/DADabrbleach.txt" name="DADrun"></script>


 Selamat mencoba sobat, semoga berhasil dan jangan takut untuk gagal karena kegagalan bukanlah akhir dari segalanya.
 Semoga artikel yang saya share ini, yaitu tentang Cara Buat Animasi Berjalan di Blog atau Cara Buat Animasi Berjalan di Bagian Bawah Blog, bisa sangat bermanfaat untuk sobat KUCOPAS semua. Amin...


Senin, 19 Maret 2012

Cara Membuat Foto dan Gambar Bergerak Slide di Blog

 KUCOPAS - Salam hangat buat sobat-sobat blog KUCOPAS semua, Kemarin saya sudah share artikel tentang Cara Buat Teks Berjalan dan Berkedip di Blog, dan Kali ini saya akan share Tips dan trik lagi tentang Cara Buat Gallery Foto Bergerak di Blog atau Cara buat foto atau gambar berjalan di blog, bahasa gaul nya ya Script Marquee Bikin Image Lebih Dinamis.

Oke sobat, untuk membuat Foto dan Gambar Bergerak di Blog silahkan ikuti cara-cara nya sebagai berikut :

1. Silahkan "Login" dulu ke blog sobat.
2. Setelah itu sobat pilih >> menu “Tata Letak”.
3. Kemudian >> "tambah Gadget".
4. Pilih menu >> “HTML/JavaScript”.
5. Isi kotak judul dengan judul gallery sobat, contoh "My Foto Gallery".
6. Kemudian pada kotak “Konten”, silahkan sobat copy dan Paste kode Script yang berwarna BIRU di bawah ini :

<marquee direction="up" onmouseover="this.stop()" scrollamount="3" onmouseout="this.start()"><img src=”alamat_gambar_sobat.jpgwidth=”120” height=”70”></marquee>

KETERANGAN :
- Ganti alamat URL gambar “src” yang berwarna HIJAU pada kode script <img src=”alamat_gambar_sobat.jpg” width=”120” height=”70”> dengan alamat URL gambar sobat.
kalau belum ada, silahkan upload dulu ke FhotoBucket, Picasa, dan lain sebagainya, terus sobat ambil URL nya dan pastekan pada tulisan yang berwarna HIJAU.

- Kode script "width" dan "height" adalah untuk mengatur ukuran lebar dan tinggi gambar sesuai dengan selera sobat.

- Kode "up" adalah Arah foto/gambar bergerak/berjalan.
silahkan sobat ganti dengan "down" atau lain sebagai nya.

- Contoh diatas, hanya untuk satu gambar/image/foto.
Kalau sobat ingin lebih dari satu foto/gambar, silahkan sobat tambah kode script image tersebut sebanyak gambar/image/foto yang sobat inginkan.
Lihat contoh dibawah ini :

<marquee direction="up" onmouseover="this.stop()" scrollamount="3" onmouseout="this.start()">
<img src=”alamat_gambar_1_sobat.jpgwidth=”120” height=”70”>
<img src=”alamat_gambar_2_sobat.jpgwidth=”120” height=”70”>
<img src=”alamat_gambar_3_sobat.jpgwidth=”120” height=”70”> 
<!-- dan seterusnya..., SupPort By KUCOPAS -->  
</marquee>

- Setelah itu silahkan sobat klik tombol “Simpan/save” untuk menyimpan gadget yang baru sobat buat.

- Selesai dan lihat hasil nya.

Semoga artikel Cara Buat Gallery Foto Bergerak di Blog atau Cara buat foto berjalan di blog, sangat bermanfaat untuk sobat KUCOPAS semua.
HapPy Blog9inG...


Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More