Cara Memasang widget icon social media di sidebar blog

Bani Cyber – Hallo blogger, di artikel ini saya akan membahas dan memberikan informasi secara lengkap untuk membuat widget sosial media di sidebar blog anda. Sebelum itu, Widget Sosial media ataupun Media Sosial dalam bahasa indonesianya sangat dibutuhkan dalam perannya untuk membantu pengguna nya mencari teman ataupun followers. Disamping itu pula ada juga yang menggunakan media sosial sebagai alat atau modal untuk mencari korban kejahatan mereka. Seperti penipuan, penjualan anak bayi, dll.

Udah sampai penipuan pula ceritanya, balik lagi ke social media/media sosial. Widget ini terdapat banyak jenis social media seperti Facebook, twitter, instagram, rss, usercloud, youtube, pinterest, linkedin dan lainnya. Facebook adalah media sosial yang mendapat peringkat nomor 1 karena media sosial ini yang paling sering digunakan untuk mencari kenalan, teman, sahabat ataupun pasangan. Pasti anda juga punya akun Facebook, kalau belum punya silahkan daftar disini.

Baca Lengkap : Cara membuat dan memasang author box di bawah artikel blog – part 2

Baca Lengkap : Cara memasang anti klik kanan di blog

Baca Lengkap : Cara membuat text area beserta “copy all” di blog

Widget ini sebenarnya adalah widget yang telah terpasang di template yang saya pakai ini, saya melepasnya supaya blog saya tampil lebih elegan di ponsel atau smartphone. Tapi tenang saja widget medsos ini tidak memberatkan blog anda, dijamin jika anda menggunakan widget ini blog anda tetap fast seperti biasanya. Apakah widget ini seo? Mungkin. Karena saya belum yakin, tapi jangan khawatir widget ini tidak akan menggeser peringkat blog anda di google.

Baca Dulu : Cara agar blog berada di peringkat nomor 1 halaman pertama google.

Penggunaan widget medsos adalah salah satu syarat seo loh, supaya google mengetahui kita berada di media sosial lain. Dan ini akan berdampak baik pada nilai seo blog kita, maka dari itu saya sarankan kepada anda untuk memasang widget ini di blog anda dengan cara nya yang akan dibahas dibawah nanti. Ada 3 dari 10 blogger yang tidak menggunakan widget ini, tapi ya ada juga yang menjadi no.1 di mesin pencari google karena artikel berkualitas dan juga template nya yang seo serta responsive ketika di akses dimanapun, misal smartphone dan ipad.

Baca Juga : 10 Free Template Berkualitas Premium, Fast, Seo Responsive Dan Mobile Friendly

Setelah membahas tentang widget media sosial diatas, sekarang kita masuk ke cara memasang widget social media di sidebar blog , langsung saja baca tutorial nya sebagai berikut:

1.Buka blogger.com dan login.

2.Buka Template, Lalu Edit HTML

3.Find (CTRL+F) kode berikut : <div class='sidebar-inner'>

4.Letakkan Kode Script berikut dibawah kode tadi

<div class='gvusion-socials-icons mom-socials-widget'>

    <ul>

        <li class='facebook'><a href=’#' rel='nofollow' target='_blank' title='Follow us on Facebook'><i class='fa fa-facebook'/></a></li>

        <li class='twitter'><a href='#' rel='nofollow' target='_blank' title='Follow us on Twitter'><i class='fa fa-twitter'/></a></li>

        <li class='googleplus'><a href='#' rel='nofollow' target='_blank' title='Follow us on Google+'><i class='fa fa-google-plus'/></a></li>

        <li class='rss'><a href='#' rel='nofollow' target='_blank' title='Follow us on RSS'><i class='fa fa-rss '/></a></li>

        <li class='youtube'><a href='#' rel='nofollow' target='_blank' title='Follow us on Youtube'><i class='fa fa-youtube '/></a></li>

        <li class='dribbble'><a href='#' rel='nofollow' target='_blank' title='Follow us on Dribble'><i class='fa fa-dribbble '/></a></li>

        <li class='deviantart'><a href='#' rel='nofollow' target='_blank' title='Follow us on DeviantArt'><i class='fa fa-deviantart'/></a></li>

        <li class='pinterest'><a href='#' rel='nofollow' target='_blank' title='Follow us on Pinterest'><i class='fa fa-pinterest '/></a></li>

        <li class='instgram'><a href='#' rel='nofollow' target='_blank' title='Follow us on Instagram'><i class='fa fa-instagram '/></a></li>

        <li class='tumblr'><a href='#' rel='nofollow' target='_blank' title='Follow us on Tumblr'><i class='fa fa-tumblr '/></a></li>

        <li class='linkedin'><a href='#' rel='nofollow' target='_blank' title='Follow us on LinkedIn'><i class='fa fa-linkedin '/></a></li>

        <li class='soundcloud'><a href='#' rel='nofollow' target='_blank' title='Follow us on Soundcloud'><i class='fa fa-soundcloud '/></a></li>

    </ul>

5.Sekarang Find (CTRL+F) lagi kode berikut : </style> atau ]]></b:skin>

6.Masukkan Kode css berikut diatasnya.

/* CSS Social Network */

.gvusion-socials-icons{margin:0 0 20px 0}

.gvusion-socials-icons ul{margin:0;padding:0;list-style:none;margin-bottom:-5px;margin-right:-5px;overflow:hidden}

.gvusion-socials-icons ul li:before{display:none}

.gvusion-socials-icons ul li{margin:0;padding:0;list-style:none;float:left;width:45px;height:45px;line-height:45px;text-align:center;background:#00baff;font-size:21px;margin-right:5px;margin-bottom:5px;opacity:.9;border-radius:3px;}

.gvusion-socials-icons ul li:hover{opacity:1;}

.secondary-sidebar .gvusion-socials-icons ul li{width:36px;height:36px}

.secondary-sidebar .gvusion-socials-icons ul li a{line-height:45px}

.secondary-sidebar .gvusion-socials-icons ul li a i{font-size:20px}

.gvusion-socials-icons ul li a{line-height:45px;display:block;color:#fff}

.gvusion-socials-icons ul li a:hover{color:#fff}

.gvusion-socials-icons ul li.home{background:#83868a}

.gvusion-socials-icons ul li.facebook{background:#516ca4}

.gvusion-socials-icons ul li.googleplus{background:#f20000}

.gvusion-socials-icons ul li.rss{background:#f29400}

.gvusion-socials-icons ul li.youtube{background:#f20000}

.gvusion-socials-icons ul li.dribbble{background:#dc71a6}

.gvusion-socials-icons ul li.deviantart{background:#4c5e51}

.gvusion-socials-icons ul li.pinterest{background:#f20000}

.gvusion-socials-icons ul li.instgram{background:#406f94}

.gvusion-socials-icons ul li.tumblr{background:#395875}

.gvusion-socials-icons ul li.linkedin{background:#1985bc}

.gvusion-socials-icons ul li.soundcloud{background:#f60}

7.Preview template, jika berhasil langsung Save Template.

Settings Script Code :

!Kode Pagar (#) bisa anda ganti dengan dengan url akun medsos anda.

Maka hasilnya menjadi sebagai berikut:

Bagaimana keren gak? Gak bisa bilang “Tidak”. Ya iyalah, widget ini di design oleh sang pendesign handal yaitu Arlina Design ( http://arlinadesign.com ). Saya? saya cuma share saja ke anda supaya blog anda juga terlihat keren dan ganteng. Jangan lupa tinggalkan komentar sebelum pergi dari artikel Cara Memasang widget social media full di sidebar blog. Wassalamualaikum blogger J.

Widget Animasi Kartun Bergerak Spesial Tahun Baru Di Blog

Tags : kumpulan widget naruto untuk blog, widget animasi bergerak di blog, widget animasi spesial kartun super hero untuk blog , kumpulan widget animasi spiderman spesial kartun di blog.

Bani Cyber.com - pasti kalau punya widget animasi bergerak keren kan, memang menyenangkan jika blog penuh dengan widget animasi kartun yang kita sukai seperti spongebob, naruto shippuden, hulk dll. pada malam jum'at kali ini saya akan bagikan animasi kartin bergerak di blog dijamin keren 100%.

saya telah mengumpulkan widget animasi kartun bergerak di blog untuk saya bagikan kembali untuk para pengguna blogger yang suka kartun animasi. animasi yang saya bagikan bukan hanya kartun di tv tapi juga kartun buatan sendiri yang lucu dan gokil. silahkan download kumpulan widget animasi bergerak keren di blog blogger anda.

bahan dan alat :

• javascript/html
• html template </body>

cara pasang animasi bergerak spesial kartun di blog:

• login to blog
• go to tata letak
• select html/javascript
• enter code in the content
• mantap gak bahasa inggris gue

Silahkan gunakan CTRL + C Untuk Copy Script Kode
 
Hai Friends

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://cara-banicyber.blogspot.com/2015/12/download-kumpulan-widget-animasi.html" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/243/th/24365.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://catatan-lingga.blogspot.com/2014/05/20-widget-animasi-yang-lucu-dan-keren.html" target="_blank">My Widget</a></center></small></div>

Naruto VS Sasuke V1

 <div style="position: fixed; bottom: 0px; left: 20px;width:110px;height:80px;"><a href="http://cara-banicyber.blogspot.com/2015/12/download-kumpulan-widget-animasi.html"target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfcM8J3jAFyhyphenhyphenArHJy11BYBafCkFy6p8YcNNIFuMSOnOGJxGBLSj7o3x38H5MWMI9vA1gm4pd-0GqxamuG2L_9va9Lof-I2nRsI_qjS5lMHWS6qZsn4PBWl2vxIHLsJ3JOJ9of7fcQcTg/s1600/NarutoVSSasuke.gif"alt="gambar"title="klik here to get more"/></a></div>

Deidara

<div style="position: fixed; bottom: 0px; left:20px;"><a href="http://cara-banicyber.blogspot.com/2015/12/download-kumpulan-widget-animasi.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvoiczne8V2tpd_9w2dGwhWBCCxPFYX7NaAT_i6pxzWLjFVgIiwZxNLGOfgmUCnYWVUkO3m0baaIczgG3WMZbr0HYhSO2-ows46XJ49OCloZc1WFtz3xVqqxpOwVLIoF19Xfe5Mzyf0IBT/s1600/n3.gif" alt="Deidara" title="Klik Disini Untuk Lebih Lengkap"/></a></div>

Gara VS Deidara

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://permathic.blogspot.com/" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/GaaraDeidara.gif " title="lihat lebih banyak animasi naruto bergerak." /></a><small><center><a href="http://permathic.blogspot.com/2012/04/cara-memasang-widget-animasi-naruto.html" target="_blank" title="Cara Memasang Widget Animasi Naruto">Animasi Naruto</a></center></small></div>

Kakashi

<div style="position: fixed; bottom: 0px; left:20px;"><a href="http://cara-banicyber.blogspot.com/2015/12/download-kumpulan-widget-animasi.html" target="_blank"><img src="http://www.fe-online.co.uk/gallery/albums/userpics/10457/FINAL_KAKASHI.gif" alt="Kakashi" title="Klik Disini Untuk Lebih Lengkap"/></a></div>

 untuk cara memasang widget animasi dibawah anda harus mengikuti cara berikut :

• login ke blog
• buka template
• klik edit html
• cari kode </body> dengan CTRL+F
• letakkan kode dibawah diatas kode </body>
• selesai

Spiderman

<div align="left">
<embed AllowScriptAccess = "sameDomain" height = "400" loop = "true" menu = "false" pluginspage = "http://www.adobe.com/go/getflashplayer" kualitas = "best"swliveconnect = "true" type = "application / x-shockwave-flash" width = "250" wmode = "transparent"> </ embed> </ div>

Super Hero

<script>
var noPic = 6;
var speedPic = 20;
var doclink ="http://cara-banicyber.blogspot.com";
var doctitle ="Follow me";
var floatr = new Array();
floatr[0] = "http://dl.dropboxusercontent.com/u/74044634/Image/Superman-144.png";
floatr[1] = "http://dl.dropboxusercontent.com/u/74044634/Image/Batgirl.png";
floatr[2] = "http://dl.dropboxusercontent.com/u/74044634/Image/wonderwoman-144.png";
floatr[3] = "http://dl.dropboxusercontent.com/u/74044634/Image/ironman-144.png";
floatr[4] = "http://dl.dropboxusercontent.com/u/74044634/Image/supergirl-144.png";
floatr[5] = "http://dl.dropboxusercontent.com/u/74044634/Image/batman-144.png";
</script>
<script src='http://dl.dropboxusercontent.com/u/74044634/Javascript/ImageFlowUp.js'></script>

Hanya sedikit widget itu lah yang bisa saya bagikan, jika penasaran anda bisa mencoba di blog anda, jika menurut anda bagus silahkan komentar, agar saya bisa terus update dan tambah sedikit widget lagi.terimakasih telah membaca artikel Widget Animasi Kartun Bergerak Spesial Tahun Baru Di Blog

Tips Mematikan/Disable Fungsi Klik Kanan Di Blog - Anti Copas ~

tags : cara agar blog tidak bisa di copy paste di blog, cara mematikan fungsi klik kanan di blog ,cara disable fungi klik kanan secara permanen di blog , cara mencegah si tukang copas , cara paling mujarap menaklukkan tukang copas , cara anti copy paste , cara anti copy paste di blog, cara disabli klik kanan selamanya di blog.

BaniCyber.com - copas adalah kegiatan yang sering dilakukan blogger pemula, untuk mengatasi nya kita perlu cara mengatasi anti copas dengan mematikan funsi klik kanan di blog. Dan juga banyak orang sekarang menggunakan DMCA.com untuk melindungi teks artikelnya. baca cara mendaftar dan menggunakan DMCA disini.

kali ini admin cyber akan memberitahu tahu cara mematikan fungsi klik kanan/ disable pada blog. ada beberapa macam jenis mematikan fungsi klik kanan. yaitu :
1.mematikan fungsi klik kanan untuk memperingatkan, biasanya digunakan agar si tukang copas mencantumkan sumber atau penulis artikel.
2.mematikan fungsi klik kanan/disable pada blog secara permanen, yang cara ini cara paling ampuh mengatasi si tukang copy paste.

pada artikel kali ini saya akan membahas cara mematikan fungsi klik kanan/disable secara permanen dan juga untuk memperingatkan dengan syarat menyiapkan beberapa bahan dan alat, berikut contoh nya :

• javascript

setelah menyiapkan beberapa  bahan dan alat lanjut ke tkp, silahkan monggo...

cara yang pertama dengan menggunakan javascript.

1. Buka Tata Letak > Tambahkan Gadget > HTML/Javascipt
2. Masukkan HTML dibawah ini di konten

 <script> var message="maaf, untuk sementar tidak bisa klik kanan!";
///////////////////////////////////
function clickIE4(){if (event.button==2){alert(message);return false;}} function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}} if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;} else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;} document.oncontextmenu=new Function("alert(message);return false")</script>  <br>

cara yang kedua dengan menggunakan javascript

1. Buka Tata Letak > Tambahkan Gadget > HTML/Javascipt
2. Masukkan HTML dibawah ini di konten

<script language='JavaScript1.2'>
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>

saya akan menjelaskan ,cara yang pertama orang lain masih bisa klik kanan dengan menekan tombol centang, dan saya bilang sekali lagi cara yang pertama hanya untuk memperingatkan untuk mencantumkan sumber. dan cara yang kedua adalah cara yang paling ampuh dan paling tepat karena biasanya orang mencamtukan html di postingan untuk di copas...

• Jangan Lupa : Cara Membuat Kotak Copy All beserta Kotak Text Area  Di Postingan Blog

Sekali lagi, anda telah tepat datang kesini untuk keperluan Disable Klik Kanan Di Blog - Anti Copas ,terima kasih.

Tips Membuat Kotak "Copy All" Beserta Text Area Di Blog - Lengkap Disini

tags : cara membuat kotak copy all dengan text area di blog , cara membuat kotak copy all terbaru 2015 , membuat kotak copy all bagi pemula , membuat kotak copy all beserta text area dengan html 

Cyber.com - bagi anda yang kurang tahu dalam membuat kotak copy all beserta dengan text area nya di blog, silahkan lihat cara pembuatan nya. pembuatan nya menggunakan kode html dan menggunakan nya bisa manual dan juga bisa otomatis dengan memasukkan nya ke template anda.

gak usah lama lama lagi langsung aja ke tkp


cara membuat kotak copy all dan juga beserta dengan text area secara manual :
yang manual biasanya memasukkan kode html untuk di share.untuk membuat nya anda harus

1.masuk ke blog, buat artikel mu dulu.
2.copy kode dibawah ini, dan paste di artikel anda

 <div>
<form name="copy">
<div align="center">
<span><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Copy all" type="button"> </span></div>
<p align="center">
<textarea style="width: 200px; height: 100px;" name="txt" rows="5" wrap="VIRTUAL" cols="20">Masukan Teks Tulisan Atau Kode Html/Javascript Disini <br>

3.gunakan dengan mode html sebelum memasukkan kode.

kalau secara otomatis anda harus meletakkan di html tertentu, seperti
<div id=''post-footer''>

biasanya digunakan untuk meletakkan url postingan nya sendiri sebagai sumber

berakhirlah artikel saya pada kali ini yang berjudul Cara Membuat Kotak Copy all Di Blog Beserta Text Area, selamat berakhir pekan dan selamat tahun baru dan selamat mencoba dan semoga berhasil :) :2thumbup

Cara Memasang Kotak Admin - Author Box Di Blogger

Hai sobat blogger ketemu lagi kita dipostingan baru saya , maksud saya postingan baru dicopas. nah pada pertemuan kali ini saya akan membagikan artikel tentang cara membuat kotak admin atau author box di blog anda masing masing untuk membuat nya anda harus mengikuti langkah langkah atau 

cara berikut ini...:

1. Login ke account blogger atau dashboard anda , lalu Pilih template 
2. Sebaiknya klik Backup/Restore dulu untuk membackup template anda
3. Kemudian  klik  Edit HTML >> Lanjutkan/Proceed
4. Centang Expand Template Widget
5. Cari kode <div class='post-footer'> , untuk memudahkan mencarinya gunakan Ctrl +F atau kalau di Firefox klik Edit….> Find … ( di blog saya kodenya ada 2 dan saya simpan di atas kode yg pertama).
6. Copy kode HTML dibawah ini dan pastekan sebelum / diatas kode no. 5 diatas.

1. <!-- Kotak Admin -->
   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <div class='admin-tulisan'>
   <h4>Posted by : <a expr:href='data:blog.homepageUrl'>Cara Admin </a> ~ / Software Collections , Blog Tutorial , Internet Bisnis</h4>
   <div class='kontainer'>
   <img src='https://lh5.googleusercontent.com/-fm58MMf7D0g/UFBN1EVY0gI/AAAAAAAACTk/aAtjvWLajrk/s800/Saung.jpg'/>
   Artikel <a expr:href='data:post.url'><data:post.title/></a> diposting oleh<b> Cara Admin </b>pada <data:post.dateHeader/>. Terima kasih atas kunjungannya.  Kritik dan saran dapat disampaikan via kotak komentar..  Jika diperlukan Artikel ini bisa disebarluaskan melalui blog sobat, hanya mohon sebutkan sumbernya dengan tautan link aktif ke postingan ini. Terimakasih. Happy blogging
   <div style='clear:both;'/>
   </div>
   </div>
   </b:if>
   <!-- Kotak Admin selesai -->

   Catatan :
   
   • Yang warna merah silahkan ganti  dengan link gambar profil sobat. kata-katanya juga boleh diganti sesuai selera.
   • Cara admin bisa juga diganti dengan <data:post.author/>
2. Sekarang ketahap berikutnya , silahkan cari kode ]]></b:skin>
3. Sebelum / diatas kode ]]></b:skin>, silahkan Copas kode CSS dibawah ini (Jika error coba letakkan tepat dibawah kode <data:post.body/>

   /*--Mulai Kotak Admin --*/
   .admin-tulisan{
   display:block;
   width:auto;   
   background:#CFE2E0;
   border:2px solid #fff;
   box-shadow:0 1px 3px #000;-moz-box-shadow:0 1px 3px #000;-
   webkit-box-shadow:0 1px 3px #000;
   padding:0;
   margin:30px 0 10px 0;
   font:normal 12px Arial, Sans-Serif;
   color:#222;
   }
   .admin-tulisan .kontainer{padding:5px;}
   .admin-tulisan h4{
   background:#8A9C04;
   border:none;
   border-bottom:1px solid #699019;
   color:#fff;
   text-transform:normal;
   text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
   font:bold 12px Arial,Sans-Serif;
   padding:5px 10px;
   margin:0 0 0 0;
   display:block;
   }
   .admin-tulisan h4 a{color:#FEEA83;}
   .admin-tulisan img{
   width:70px;
   height:70px;
   margin:0 10px 0 0;
   float:left;
   border:1px solid #954B02;
   padding:2px;
   background:#C36702;
   box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
   }

   
   
4. Untuk jenis font, warna background dan border bisa diganti sesuai selera
5. Selesai jangan lupa Simpan template lalu ucapkan Alhamdulillah..

Sampai disini artikel tentang Cara Membuat Kotak Admin atau Author Box Dibawah Posting . Selamat mencoba. Siapa tahu dengan setelah memasangnya blog sobat akan semakin akan semakin berkualitas dan SEO Friendly hingga pagerank google semakin naik .

Sumber : www.saunglink.com