Fenomena perkembangan dan kemajuan kurun digital sekarang ini banyak bermunculan Sosial media di internet. Sosial media yang ada banyak jenis, fungsi dan ragamnya. Dari yang mulai hanya sekedar membuatkan foto, daerah diskusi, hanya upload foto, forum-forum, hingga dengan yang hanya khusus sosial media mencari jodoh.
Namun tahukah kita manfaat sosial media bagi peningkatan trafik di blog atau website kita, dan fungsi gosip yang sangat berkhasiat bagi perkembangan dan kemajuan web atau blog di mata Search Engine guna untuk perayapan, search engine sangat menyukai link yang inbond dan outbound yang berasal dari sosial media, tentunya meningkatkan serp rank bagi web atau blog kita.
Nah disini aku akan bahas bagaimana Cara Memasang Widget Sosial Media Responsive di Blog jikalau ada pengunjung yang tertarik dengan artikel kita mereka mampu membuatkan atau sharing di sosial media.
Pertama sobat
- login ke blog kemudian
- Pilih template lalu Edit Html.
- Sobat search atau mampu menggunakan control F dan input cari arahan ]]></b:skin> atau </style>
- Setelah ketemu sahabat copy Script dibawah ini sempurna di atas kode ]]></b:skin> atau </style>
* # Responsive Images/Videos
=========================== */
img.scale-image, .scale-image img { max-width: 100%; height: auto; }
.video-scale { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.video-scale iframe, .video-scale object, .video-scale embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Responsive Tables (Thanks http://css-tricks.com/responsive-data-tables/)
=============================================*/
table { width: 100%; border-collapse: collapse; }
tr:nth-of-type(odd) { background: #f5f5f5; }
th { background: #999; color: #fff; font-weight: 700; }
td, th { padding: 3px; border: 1px solid #ccc; text-align: left; }
td { font-weight: normal; }
.idc-social {width: 100%; float: left; margin: 0; padding: 1em 0; }
.idc-social ul { margin: 0; padding: 0; }
.idc-social ul li { list-style:none; list-style-type: none; padding: 0; text-transform: none; margin:0; float: left; display: inline-block; width: 20%; }
.idc-social ul li a { font-size:80%; color: #fff; display:block; }
.idc-social ul li a:hover { color: #f0f0f0; background-color: #999; text-decoration: none; }
.idc-social ul li .rss { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/RSS-1.png") no-repeat scroll 10px center #F87E12; background-size: 15px; padding: 10px 50px; }
.idc-social ul li .twitter { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Twitter.png") no-repeat scroll 10px center #4CACEE; background-size: 20px; padding: 10px 50px;}
.idc-social ul li .facebook { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Facebook-1.png") no-repeat scroll 10px center #3B5998; background-size: 20px; padding: 10px 50px; }
.idc-social ul li .google { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/google.png") no-repeat scroll 10px center #D44937; background-size: 20px; padding: 10px 50px; }
.idc-social ul li .linkedin { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; background-size: 20px; padding: 10px 50px; }
-->
5. Pilih Simpan / save untuk memastikan bahwa script tersebut benar diletakkan dan tidak error
Untuk meletakkan posisi Sosial media di blog sahabat bis di taruh di atas artikel atau di manapun yang menurut sahabat pantas dilihatnya, atau jikalau ingin menggunakan widget bawaan mampu masuk ke Klik "Layout" > "Add a Gadget" > pilih "HTML/JavaScript" untuk Judul kosongkan saja. Kemudian Copas arahan script berikut
<div class="idc-social">
<ul>
<li><a class="rss" href="http://www.dibalikseo.com/feeds/posts/default?alt=rss">Subscribe our Feed</a></li>
<li><a class="twitter" href="https://twitter.com/dibalikrenungan">Follow me on Twitter</a></li>
<li><a class="facebook" href="https://www.facebook.com/dbalikcom">Find me on Facebook</a></li>
<li><a class="google" href="https://plus.google.com/u/0/111632413681186402712">Join me on Google+</a></li>
<li><a class="linkedin" href="http://in.linkedin.com/in/ade-godel-3ab772130">Connect with LinkedIn</a></li>
</ul>
</div>
Ganti Kode yang berwarna Merah dengan link yang Sobat punya sesuaikan, setelah itu pilih Save.
Jika sudah final sahabat mampu atur penempatannya dimana saja, banyak para pakar SEO yang menyarankan memasang Script Sosial media tersebut, selain untuk mempermudah pengunjung shared artikel kita, juga dapat membantu blog sebagai backlink, tentunya sahabat pasti sudah mengetahui manfaat backlink bagi peningkatan Blog kita, selamat mencoba jikalau ada sahabat yang ingin menambahkan boleh, siapa tau ada yang lebih mengagumkan untuk tampilan Script Media sosial tersebut.
Comments