Tampilkan postingan dengan label Widget. Tampilkan semua postingan
Tampilkan postingan dengan label Widget. Tampilkan semua postingan

Cara Terbaru Memasang Widget Alexa Rank Di Blog

08.14 0
Cara Terbaru Memasang Widget Alexa Rank Di Blog - Setelah updatenya website alexa, kini alexa memiliki tampilan baru yang tentunya semaki keren dan elegan. Namun ada beberapa kabar buruk untuk blogger setelah bergantinya tampilan alexa tersebut.

Dulu, kita dapat mendafarkan blog di Alexa secara gratis. Sekarang itu hanyalah tinggal kenangan, kini medaftarkan blog di alexa sudah berbayar.


Oleh karena itu, blog yang belum didaftarkan di alexa tidak bisa mendapatkan fitur Widget Alexa Rank, dan karena itu juga orang yang belum mendaftarkan blognya di alexa tidak bisa memasang idget alexa rank pada blognya.

Untung saja saya dulu sempat mendaftarkan blog Masterbama ini ke alexa. Pada aktu itu saya juga sempat menyimpan script-script widget alexa rank. Dan untungnya lagi, script-script yang saya simpan masih lengkap dan belum ada yang hilang. Jadi saya masih bisa membagikannya kepada kalian.

Cara Memasang Widget Alexa Rank Pada Blog

1. Pada dashboard blogger, klik Tata Letak.
2. Klik Tambahkan Gadget.
3. Pilih HTML/JavaScript.
4. Masukkan salah satu script/kode Widget alexa rank yang ada di bawah ini. Sesuaikan dengan blog anda.


<a href="http://www.alexa.com/siteinfo/http://rian-blog.com"><script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/s/a?url=http://rian-blog.com"></script></a>

<a href="http://www.alexa.com/siteinfo/http://rian-blog.com" rel="nofollow" target="_blank" title="Alexa"><script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/s/b?url=http://rian-blog.com" title="Alexa"></script></a>


<a href="http://www.alexa.com/siteinfo/http://rian-blog.com" rel="nofollow" target="_blank" title="Alexa"><script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/s/c?url=http://rian-blog.com" title="Alexa"></script></a>

5. Ganti  http://rian-blog.com dengan URL blog anda.
6. Klik Simpan.

Sekarang coba lihat blog anda dan widget alexa rank sudah terlihat. Bila ada kebingungan atau kesusahan cara memasangnya. Anda bisa bertanya pada komentar. Semoga sukses!


Cara membuat fanspage Google Plus

09.25 0
Rian Blog tentang cara membuat fanspage Google Plus - cara membuat halaman fanspage di Google plus. Tuturial kali ini Rian Blog akan membagikan mengenai bagaimana cara membuat laman fanspage Google plus dan bagaimana cara memasangnya di blog Blogger. Jadi sobat bukan hanya facebook saja yang memiliki halaman fansepage tapi juga di Google plus ada halaman fansepagenya juga. contohnya adalah widget Google plus yang saya pasang diblog ini.

1. Masuk ke sini; https://plus.google.com/pages/create dan Pilih kategori halaman yang akan dibuat.

Cara membuat fanspage Google Plus

2. Masukan judul halaman dan Alamat blog Anda. Jangan lupa centang kalau anda setuju, lalu klik tombol Buat.
3. Selanjutnya masukan slogan untuk halaman yang dibuat.
4. Unggah juga foto profil untuk halaman lalu klik tombol continue.

membuat fanspage Google Plus

5. Selamat Halaman Fanspage Google Plus anda telah selesai.

Setelah anda selesai membuat halaman fanspage dan bagaimana cara memasukannya kedalam template Blog blogspot anda? silahkan baca; Cara Menambahkan dam memasang Fanspage Google plus ke Blog Blogspot.

Cara membuat widget fanspage google plus

10.23 0
Seocips tentang Cara memasang Fanspage Google Plus ke Blog - cara membuat widget fanspage google plus dan cara memasangnya di Blog blogspot. Widget google plus standar selalu menampilkan teman-teman yang menambahkan anda ke lingkaranya. Berbeda dengan widget Fansepage Google plus yang satu ini.


Jadi Laman atau halaman sendiri adalah salah satu fitur Google plus yang mirip dengan sebuah fans page facebook. Halaman ini biasanya di gunakan untuk mempromosikan sesuatu kepada para pengguna google plus. Semakin banyak vote halaman, maka semakin terkenal pula halaman google plus tersebut. Anda juga bisa membagikan artikel terbaru atau lama anda di halaman google plus ini.

1. Sebelumnya anda harus memiliki fansepage Google Plus. Silahkan baca; cara membuat fanspage Google Plus.
2. Login dengan akun blog saudara
3. Masuk ke menu TATA LETAK
4. Tambah Gadget, lalu pilih HTML/Javascript
5. Masukan kode di bawa ini:

<script type="text/javascript" src="http://apis.google.com/is/plusone.js"></script>
<g:plus href="http://plus.google.com/10844146642498859063"></g:plus>

6. Ganti kode yang berwarna merah dengan ID akun google plus atau ID halaman google plus milik anda.
Klik Simpan.
7. Selesai kini widget fanspage Google Plus telah terpasang di template Blog anda.

Bagaimana sobat mudah bukan? semoga tutorial ini bermanfaat untuk anda.

Membuat Cursor Bertabur Bintang

01.29 0

Crusor Bertabur Bintang
Membuat cursor bertabur bintang 

Banyak cara yang dibuat oleh setiap blogger untuk membuat tampilan blognya terkesan cantik, unik dan macam-macam deh. Diantaranya dengan modifikasi template yang sudah ada, memasang ragam widget dan ragam aksesoris blog termasuk mengganti tampilan cursor. pernah lihat suatu blog dengan cursor bertabur bintang? Pingin mencobanya? Mudah kok, ikuti langkah-langkah berikut:
Membuat cursor bertabur bintang

1. Login ke blogger.
2.Masuk ke Layout-->Page Element
3.Tambahkan gadget HTML/JavaScript
4.Pilih kode taburan bintang dibawah ini.



Bintang Hijau
<script src="http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.hijau.js" type="text/javascript"></script> 
Bintang Ungu 

<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.ungu.js' type="text/javascript"></script>
Bintang Merah 
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.merah.js' type="text/javascript"></script>
Bintang Biru
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.biru.js' type="text/javascript"></script>
Bintang Putih 
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.putih.js' type="text/javascript"></script>
 
5.Kopi salah satu kode diatas dan simpan. 

6. Jangan lupa save dan save lagi.
Kodenya bisa dicampur-campur, menurut selera sobat. Semoga bermanfaat!
Belum sempat blogwalking, sibuk desain template? 

Membuat Social Profile Widget Keren

01.12 0

Membuat Social Profile Widget Keren


social profil widget kerenAlhamdulillah setelah sebelumnya saya posting tutorial membuat modifikasi pada widget profil blogger, kali ini saya ingin mengetengahkan cara membuat widget profil sosial networking menarik dengan colored style.
FITUR :
  • Meliputi 7 jejaring social yang paling sering digunakan
  • Efek hover dan desain yang elegan,
  • Sangat rapi dan bersih
Tidak ada JavaScript, No Jquery, murni dengan CSS
CARA MENAMBAHKAN WIDGET INI KE BLOG
Untuk menginstal widget ini ke blog sangat mudah, baik blog anda dengan flatfrom blogger, wordpress atau layanan blogging lainnya dimana style CSS dan HTML diterima pada widget atau template. Anda hanya perlu menambahkan kode gadget/widget pada bagian HTML/JavaScript.
Step by step for blogger
  • Pada dasbor >> Masuk menu Tata Letak >> Tambah Gadget >> Pilih HTML/JavaScript
Copy dan paste kode berikut pada kolom konten:
<div class='metro-social'>
<li><a class="fb" href=http://www.facebook.com/amatullah.syukur rel="nofollow"></a></li>
<li><a class="tw" href=http://twitter.com/amatullahsyukur></a></li>
<li><a class="gp" href="https://plus.google.com/116382152511220195182"></a></li>
<li><a class="pi" href=http://pinterest.com/amatullahsyukur rel="nofollow"></a></li>
<li><a class="in" href=https://www.linkedin.com/in/amatullahsyukur rel="nofollow"></a></li>
<li><a class="yt" href=http://www.youtube.com/amatullahsyukur></a></li>
<li><a class="fd" href=http://feeds.feedburner.com/amatullahsyukur rel="nofollow"></a></li>
</div>
<style>
.metro-social{width:285px}
.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}
.metro-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}
.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}
.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:68px;height:70px}
.metro-social .gp{width:69px;height:70px;background:url(//goo.gl/oT0kF) no-repeat center center #da4a38}
.metro-social .pi{background:url(//goo.gl/7olxx) no-repeat center center #d73532;width:68px;height:69px}
.metro-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px}
.metro-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px}
.metro-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px}
.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}
.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}
.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}
.metro-social li:hover .pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532}
.metro-social li:hover .in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd}
.metro-social li:hover .yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41}
.metro-social li:hover .fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c}
</style>

Kustomisasi: Ganti link profil saya dengan link profil milik anda.

  • Simpan dan lihat hasilnya diblog anda.

Demikian tutorial kali ini, cara membuat social profile widget pada blog. Semoga bermanfaat.