Showing posts with label widget. Show all posts
Showing posts with label widget. Show all posts
Thursday, March 16, 2017
Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger
Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger
Ini Adalah Totorial Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger Dengan Mudah Dan Gampang . Jika Sobat Penasaran Seperti Apa Bisa Lihat Gambar nyaDi Bawah ini .
Sedikit Penjelasan Untuk Apa Tombol Share Itu Sebenar nya, Tombol Share Sanga Lah Penting Utuk Para Pupbliser Blooger , Kenapa Penting nya tombol share itu Karena Dengan Tombol Share itu kita bisa Share posting kita di banyak sosial media terutama Facebook Dan Tweeter Dengan Men Share kan Posting kita di sosial media kita Akan Banyak Mendapat Trafick Pengunjung Dari Sana , Itulah Sebab nya tombol share sosial itu penting . Ok Langsung Saja Cara nya gimana Sobat Bisa Lihat Di Bawah .
Langkah-Langkah Membuat Tombol Share Melayang Di Blooger
1-Loging Blooger
2-Pilih Tata Letak
3-Tambah Gadget
4-Pilih HTML/Javascript
5-Judul Kosong kan Pada Box KontenMasukan Kode Script Di Bawah ini Dan Langkah Terakhir Save Dan Lihat Hasil nya.
Sedikit Penjelasan Untuk Apa Tombol Share Itu Sebenar nya, Tombol Share Sanga Lah Penting Utuk Para Pupbliser Blooger , Kenapa Penting nya tombol share itu Karena Dengan Tombol Share itu kita bisa Share posting kita di banyak sosial media terutama Facebook Dan Tweeter Dengan Men Share kan Posting kita di sosial media kita Akan Banyak Mendapat Trafick Pengunjung Dari Sana , Itulah Sebab nya tombol share sosial itu penting . Ok Langsung Saja Cara nya gimana Sobat Bisa Lihat Di Bawah .
Langkah-Langkah Membuat Tombol Share Melayang Di Blooger
1-Loging Blooger
2-Pilih Tata Letak
3-Tambah Gadget
4-Pilih HTML/Javascript
5-Judul Kosong kan Pada Box KontenMasukan Kode Script Di Bawah ini Dan Langkah Terakhir Save Dan Lihat Hasil nya.
<style>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
Trimakasih Sudah Di Blog Saya Rantau021 ini , Semuga Apa yang Saya Bagikan Di blog Sederhan Dan Gratis ini Bisa Bermanfaat Bagi Kita Dan Banyak Orang , Mohon Maaf Jika Ada Kesalahan Yang Di Sengaja Ataupun Tidak Semuga Berhasil Salam Rantau021 Download Gratis .
Englis Version
It is Totorial How to Make Social Widget Share Float On Left Blogger With Easy And Easy .
Slightly Explanation For What Button Share It Right as his , Button Share Sanga Lah Important Utuk The Pupbliser Blogger , Why Important him a share button that Due to the Share Button that we can Share our post on many social media , especially Facebook and Tweeter With Men Share the post we in social media we ll Many trafick visitor Got From There , it is because of its important social share buttons . Ok its Direct Only way how Buddy Can See Below .
Steps to Make Button Share Float On Blogger
1 - loging Blogger
2 - Select Layout
3 - Add a Gadget
4 - Select HTML / Javascript
5 - Title Empty the In Box KontenMasukan Script Under this Code and Last Step Save and View Results her .
<style>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
Thank you Already this Blog I Rantau021 , Semuga What I Share In blog sederhan And Free This Be Useful for Us And Many People , Sorry If There Mistakes In Intentionally Or Not Semuga Successfully Salam Rantau021 Free Download .
HTML Blooger
- Cara Membuat Menu Navigasi di Blog seperti Evo Magz - New!
- Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger - New!
- Totorial Mengganti Link Newer Post dan Older Post Menjadi Judul Posting Degan Mudah Dan Jelas - New!
Available link for download
Friday, March 10, 2017
Cara Memasang Widget Online Visitor
Cara Memasang Widget Online Visitor
Memasang widget online visitor adalah salah satu cara ampuh untuk mengetahui sejauh mana situs kita dikunjungi orang lain. Dan dibawah ini, saya akan memberi tutorial mengenai Cara Memasang Widget Online Visitor, baik itu di blog wordpress maupun di blogpot. Saya bagi menjadi 2 karena blogspot dan wordpress berbeda dalam script HTML yang bisa digunakan.
1. Cara Memasang Widget Online Visitor di Blog Wordpress
pertama, Copy kode ini ke widget blog kamu. Namun, jangan langsung di save, karena belum selesai diedit.
<a href="http://whos.amung.us/stats/ido4jz1bs8hr/"><img src="http://whos.amung.us/widget/ido4jz1bs8hr.png" width="81? height="29? border="0? title="Click to see how many people are online" /></a>
Kedua, Kode bercetak miring harus kamu ganti agar widgetnya bisa bekerja. Caranya buku situs whos.amung.us dan kamu akan menemukan kode javascript disana seperti ini
<script type="text/javascript" src="http://widgets.amung.us/tab.js"></script><script type="text/javascript">WAU_tab(‘8pjzu36px9gv‘, ‘left-middle’;)</script>
Tahap Terakhir (finishing) : masukkan kode yang bercetak tebal (kamu harus mendapatkannya langsung di situs whos.amung.us) ke dalam kode yang bercetak miring. Setelah itu, kode HTML awal tadi akan bekerja untuk blog kamu.
2. Memasang Gadget Online Visitor di Blogspot
Memasang gadget amung di blogspot tidaklah sulit karena blogspot mendukung javascript. Jadi, yang kamu butuhkan hanyalah pergi ke situs amung dan mengkopi langsung javascriptnya ke gadget blog kamu. Langsung Muncul Deh.
Jangan Lupa tinggalkan Komentar ya.. ^_^
Available link for download
Monday, February 27, 2017
Cara Membuat Widget Galon Sembunyi Diatas Header
Cara Membuat Widget Galon Sembunyi Diatas Header
Salam Sobat....
Memang Asik kalo Tampilan Blog kita Bagus, Indah, unik dan menarik pasti banyak yang suka iya khan...... nah kali ini GFT berbagi Cara Membuat Widget Galon Sembunyi Diatas Header disamping untuk memperindah juga Widget agar blog sobat tidak terlalu ribet karena terlalu banyak link yang tampil di halaman blog.
Okey kita langsung saja, silahkan sobat ikuti runtutan cara pemasangannya yang pastinya sobat sudah pada bisa akan tetapi tidak ada salahnya saya sertakan cara-caranya disini :
[ ]
Silahkan Ikuti Langkah-langkah berikut :
1. Silahkan login akun Blog Anda
2. Pilih menu Tata Letak
3. Setelah itu pilih Tambahkan Gadget
4. Kemudian pilih Gaget HTML/JavaScript
5. Dan Copy dan kode di bawah ini :
6. Setelah sobat pastekan code tersebut selanjutnya Save/Simpan
7. Selesai
8. Silahkan Lihat Hasilnya dan berhasil
Keterangan:
Silahkan Sobat ganti link-link berikut dengan link sobat:
~ http://tutorial-service-lengkap.blogspot.com/feeds/posts/default
~ http://www.facebook.com/pages/Teknisi-Komputer-Handal/469924526397595?ref=hl
~ https://twitter.com/Mustain01
~ https://www.google.com/bookmarks/
~ https://www.Yahoo.com/bookmarks/
https://www.Youtube.com/
Gimana pasti okey khan hehe...
demikina Sobat semoga Pistingan berbagi Cara Membuat Widget Galon Sembunyi Diatas Header ini ada manfaat untuk sobat sekalian...
Ingin Belajar Bisnis Online.....
Artikel Terkait
:)) 
;)) 
;;) 
:D 
;) 
:p 
:(( 
:) 
:( 
:X 
=(( 
:-o 
:-/ 
:-* 
:| 
8-} 
:)] 
~x( 
:-t 
b-( 
:-L 
x( 
=))Available link for download
Monday, January 16, 2017
Cara memasang Widget IP Address Visitor di Blog
Cara memasang Widget IP Address Visitor di Blog
Apa IP Address visitor?
Ini pertanyaan yang muncul dari sahabat blogger bang sholeh, oleh karena itu bang sholeh sengaja memberikan sedikit apa yang saya tau tentang IP Address blog. Oke langsung saja, IP Address Blog adalah gadget yang digunakan untuk memberikan informasi kepada pengunjung blog kita tentang IP Adress mana ia mengakses internet, dengan kata lain apabila kita memasang widget ini diblog kita, kemudian saat mereka berkunjung, mereka akan tau alamat IP dari mana mengakses internet.
Langsung ke pokok pembahasan tentang bagaimana cara memasang widget IP Address visitor diblog kita, yaitu:
1. Masuk ke Dasbor blog anda
2. Pilih Tata letak
4. Kemudian Add widget dimana akan anda letakan widget IP Address
5. Selanjutnya Copy code dibawah ini dalam kotak HTML/Javascript
<a href="http://www.123myip.co.uk/cometo/?en"><img
src="http://www.123myip.co.uk/ip-address/?size=125x125" border="0"
width="125" height="125" alt="IP" /></a>
NOTE : Untuk "width="125" height="125" Ganti sesuai ukuran yang anda inginkan.
6. Kemudian simpan
7. jadi dach,mudah bukan
Semoga bermanfaat ya ?
Babai...
Available link for download
Sunday, January 1, 2017
Cara membuat widget slide out CSS
Cara membuat widget slide out CSS
Teknik untuk membuat widget slide out ini hanya menggunakan CSS tanpa javascript. Kode CSS dan HTMLnya sederhana
Ketika posisi mouse diatas gambar maka akan muncul slide widget.
HTML
<div id="slideout">
<img src="url gambar" />
<div id="slideout_inner">
[masukkan kode widget disini]
</div>
</div>CSS
#slideout {
position: fixed;
top: 40px;
left: 0;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
}
#slideout_inner {
position: fixed;
top: 40px;
left: -250px;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
}
#slideout:hover {
left: 250px;
}
#slideout:hover #slideout_inner {
left: 0;Untuk memodifikasi background abda bisa mengedit #slideout_inner. Untuk posisi edit top: 40px menjadi yang anda inginkan.
Nah sekarang bisa dicoba.
Available link for download
Friday, December 23, 2016
Cara Memasang Widget Twitter di Blog
Cara Memasang Widget Twitter di Blog
Ingin menampilkan status twitter di blog, caranya mudah sekalie.. lansung aja bisa sobat praktekan seperti di bawah Ok...:
1. Masuk ke sini https://twitter.com/about/resources/widgets
Setelah itu klik My Website
2. Pilih Profile Widget
3. Isi nama akun twitter teman2
4. Setelah itu pilih Finish & Grab Code atau pilih Test settings untuk melihat hasil yang akan di buat.
5. Setelah muncul code widget Twitter
Copy semua code widget twitter kedalam blog anda, caranya masuk ke menu Design > Add a Gadget
paste code tersebut ke dalam Add a Gadge lalu save dan lihat hasilnya. :)
Oke, guys semoga informasi mengenai Cara Memasang Widget Twitter di Blog ini bisa bermanfaat ^_^ Terima kasih sudah berkunjung di Gratis Full Taini Blo
sumber :http://ajib-elang.blogspot.com/2011/12/cara-memasang-widget-twitter-di-blog.html
Artikel Terkait
Available link for download
Saturday, November 26, 2016
Cara Memasang Widget Translate Pada Blog
Cara Memasang Widget Translate Pada Blog
Assalamualaikum wr wb
oke,kali ini bang sholeh sedikit berbagi informasi tentang bagaimana cara menambah script translate keren di blog. baca artikel ini ya ??
Pernahkah anda melihat statistik blog anda dan melihat bahwa ternyata blog anda di kunjungi oleh orang-orang yang berasal dari negara lain ?. Itu terjadi akibat kata kunci yang diketik pada search engine seperti Google dan Yahoo mungkin sesuai dengan isi posting yang telah anda buat. Tetapi mungkin visitor tersebut tidak akan berlama-lama di blog anda, karena tidak sesuainya bahasa yang digunakan. Jika anda tidak ingin kehilangan visitor dari tersebut, coba gunakan widget yang dapat menterjemahkan bahasa pada blog anda menjadi bahasa yang mereka gunakan. Untuk itu saya akan memberikan tutorial bagaimana cara memasang widget translate bahasa yang dapat anda praktekkan langsung di blog anda masing-masing.
Ada banyak jenis widget translate yang dapat di gunakan, namun kali ini saya akan menjelaskan tentang bagaimana cara memasang Widget Google Translate Standar dan Widget Google Translate Dengan Flag pada blog. Untuk cara memasang widget tersebut, silahkan mengikuti langkah-langkahnya dibawah ini.
VERSI STANDART :
Widget Google Translate Standar
1. Login ke Blogger
2. Masuk ke Tata Letak » Add Gadget » Traslate.
3. Klik Simpan/save.
Hasilnya akan seperti gambar di bawah ini :
Widget Google Translate Dengan Flag :
1. Login ke Blogger.
2. Masuk ke Tata Letak » Add Gadget » HTML/Javascript.
3. Masukkan kode di bawah ini pada kolom HTML/Javascript.
Klik show untuk melihat
4. kemudian klik simpan
5. mudah bukan
6. selamat bereksperimen ya ?
SEMOGA BERMANFAAT !
SEMOGA BERMANFAAT !
Available link for download
Subscribe to:
Posts (Atom)