Dewa Blogger: Hasil penelusuran untuk memasang-tombol-share-di-blog

Home / Hasil penelusuran untuk memasang-tombol-share-di-blog

Pada postingan ke dua di hari ini akan membuatkan sebuah share button pada post Memasang Tombol Share di Blog

Memasang Tombol Share di Blog - Pada postingan ke dua di hari ini akan membuatkan sebuah share button pada postingan yang digunakan blog ini. Tutorial ini Saya buat atas undangan teman blogger di sini.

Share button ini mempunyai kegunaan untuk memudahkan pengunjung yang ingin membuatkan artikel yang dirasa bermanfaat ke jaringan sosial media mereka. Seperti Facebook, Twitter, Google plus, dan Linkedin. Share button ini nantinya akan muncul di setiap postingan blog sobat.

Baca juga : Memasang Widget Share Button di Postingan

Untuk tampilan menyerupai screenshot di bawah ini atau dapat dilihat eksklusif di bawah artikel blog ini (jika belum diganti)

Berikut cara penerapannya :

1. Login ke Blogger > Template > Klik Edit HTML > Cari isyarat di bawah ini lalu pilih yang ke dua dalam markup post (bukan mobile post)

<data:post.body/>

2. Kemudian salin isyarat di bawah ini sempurna sesudah isyarat yang disebutkan tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='tombol-berbagi-arlina'> <div class='tombol-berbagi-arlina-fb'> <a class='tombol-berbagi-fb' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'/> <a class='tombol-berbagi-fb-label' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'> Share on Facebook</a> </div> <div class='tombol-berbagi-arlina-tw'> <a class='tombol-berbagi-tw' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'/> <a class='tombol-berbagi-tw-label' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'>Share on Twitter</a> </div> <div class='tombol-berbagi'> <a class='tombol-berbagi-gp' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'/> <a class='tombol-berbagi-gp-label' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Share on Google+</a> </div> <div class='tombol-berbagi'> <a class='tombol-berbagi-lin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'/> <a class='tombol-berbagi-lin-label' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'>Share on LinkedIn</a> </div> </div> </b:if>

3. Selanjutnya terapkan isyarat di bawah ini sempurna sebelum ]]></b:skin> atau </style>

/* CSS Share Button */ .tombol-berbagi-arlina{display:block;position:relative;height:43px;line-height:43px;padding:10px;border-top:1px solid #dadada;border-bottom:1px solid #dadada;margin:auto} .tombol-berbagi-arlina-fb,.tombol-berbagi{float:left;width:21%;padding:0 10px;height:inherit} .tombol-berbagi-arlina-tw,.tombol-berbagi,.tombol-berbagi-lk{float:left;width:21%;height:inherit;padding:0 10px;border-left:solid 1px #dadada} .tombol-berbagi-fb,.tombol-berbagi-tw,.tombol-berbagi-gp,.tombol-berbagi-lin,.tombol-berbagi-pi{float:left;display:block;background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfKOAWgQxES3-Ug32Gm3I72bdSeE3WzlENh0_E5Ip40dfkHeP4Y4MV__LdFeO8xM5yteylBri0SXhcgMmLce5m2X9LV0QgrLwhU2dpIngppA4GODYg39DveghXFC_kN5Q7n-nUcOtt6LoQ/s1600/share.png') no-repeat;width:42px;height:41px;margin-right:3px} .tombol-berbagi-fb-label{color:#2d609b} .tombol-berbagi-fb-label,.tombol-berbagi-tw-label,.tombol-berbagi-gp-label,.tombol-berbagi-lin-label{float:left;width:58px;height:inherit;font-size:12px;font-family:'Open Sans Bold',Arial,sans-serif;line-height:14px;margin:5px 0 0 4px} .tombol-berbagi-tw{background-position:0 -43px} .tombol-berbagi-tw-label{color:#00c3f3} .tombol-berbagi-gp{background-position:0 -86px} .tombol-berbagi-gp-label{color:#f00} .tombol-berbagi-lin{background-position:0 -129px} .tombol-berbagi-arlina a{color:#999;transition:all .3s;} .tombol-berbagi-arlina a:hover{color:#7cb0ed}  @media only screen and (max-width:640px){ .tombol-berbagi,.tombol-berbagi-arlina-fb{display:inline-block;float:none;width:48%;padding:0;height:inherit} .tombol-berbagi,.tombol-berbagi-arlina-tw,.tombol-berbagi-lk{float:left;width:48%;padding:0;border-left:0}}

4. Simpan template.

Bagi teman yang ingin mempunyai Kode Promo Hosting Terbaru, silakan kunjungi Promo Hosting

Demikian cara Memasang Tombol Share di Blog, biar bermanfaat.

Memasang Tombol Share Di Blog

Concept Phone Selasa, 22 Mei 2018

Membuat Tombol Share di Bawah Posting Blog – Tentu sudah tidak ajaib lagi dengan tombol share yang biasa terlihat di bawah posting blog, fungsi dari tombol share tersebut supaya lebih memudahkan visitor untuk membagikan artikel yang sudah kita posting ke dalam beberapa media umum menyerupai facebok, twitter, google+, lintasme dan jejaring sosial lainnya.

Membuat Tombol Share di Bawah Posting Blog Membuat Tombol Share di Bawah Posting Blog

Tanpa memasang tombol share ini gotong royong blogger juga sudah menyediakan widget tombol share, namun apa daya sebab tombol share default blogger tersebut tidak valid HTML5 jadi ada baiknya apabila kita modifikasi supaya tombol share yang terletak di bawah posting blog supaya sanggup lolos dari validator W3C dan sanggup valid HTML5.

Untuk menciptakan tombol share ini hanya memakai CSS saja tanpa memakai gambar, sehingga tampilan dari tombol share ini lebih sederhana dan minimalis dengan di sertai warna-warna yang menarik. Untuk memasang tombol share di bawah posting blog juga cukup mudah, hanya dengan menambahkan sedikit isyarat saja yang terdapat dibawah ke dalam Edit HTML template blog maka karenanya menyerupai yang tertera pada gambar di atas. Untuk itu berikut tutorial untuk Membuat Tombol Share di Bawah Posting Blog supaya valid HTML5 dan full color.

1. Login ke akun blogger.
2. Masuk ke Template kemudian pilih Edit HTML.
3. Copy isyarat berikut ini kemudian taruh di atas isyarat ]]></b:skin>

.widgetshare{font:bold 12px/20px Tahoma !important;background:#333;border:1px solid #444;padding:5px 4px;color:#fff !important;margin-top:10px}.widgetshare a{font:bold 12px/20px Tahoma !important;text-decoration:none !important;padding:5px 4px;color:#fff !important;border:1px solid #222;transition:all 1s ease}.widgetshare a:hover{box-shadow:0 0 5px #0f0;border:1px solid #e9fbe9}.fcbok{background:#3B5999}.twitt{background:#01BBF6}.gplus{background:#D54135}.digg{background:#5b88af}.lkdin{background:#005a87}.tchno{background:#008000}.ltsme{background:#fb8938}

4. Selanjutnya copy isyarat berikut ini, kemudian taruh di bawah isyarat <data:post.body/> atau sanggup juga <div class='post-footer'>

<div class='widgetshare'> Share artikel ke:  <a class='fcbok' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank'>Facebook</a>  <a class='twitt' expr:href='&quot;http://twittter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Twitter</a>  <a class='gplus' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Google+</a> <a class='lkdin' expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Linkedin</a> <a class='tchno' expr:href='&quot;http://technorati.com/faves?sub=addfavbtn&amp;add=&quot; + data:post.url' rel='nofollow' target='_blank'>Technorati</a> <a class='digg' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Digg</a> <script> //<![CDATA[ var uri = window.location.href; var ttle = document.title; document.write("<a href='http://www.lintas.me/?c=bookmarklet&url="+uri+"&title="Membuat Tombol Share di Bawah Posting Blog"' rel='nofollow' class='ltsme'>Lintasme</a>"); //]]> </script> </div>

5. Langkah terakhir tinggal Simpan template kemudian lihat hasilnya.

Demikian tutorial untuk Membuat Tombol Share di Bawah Posting Blog. Perlu diperhatikan dalam langkah pemasangannya, biasanya didalam template blog terdapat beberapa isyarat <data:post.body/> dan <div class='post-footer'> maka dari itu silahkan sesuaikan dengan template blog yang anda gunakan.

Tips Blogger Widget

Membuat Tombol Share Di Bawah Posting Blog

Concept Phone Selasa, 08 Mei 2018

Menambahkan widget share button merupakan salah satu cara untuk mendapat pembaca lebih banyak di blog kita. Karena, dengan memasang widget share ini pengunjung akan jadi lebih gampang untuk membagikan konten di sosial media miliknya.

merupakan salah satu cara untuk mendapat pembaca lebih banyak di blog kita Cara Memasang Widget ShareThis di Blogger

Mungkin sudah banyak yang sudah tahu bagaimana cara menambahkan widget share dan mungkin juga ada sebagian yang belum tahu, jadi tidak ada salahnya kali ini akan menyebarkan tips Cara Memasang Widget ShareThis di Blogger dengan efek melayang di pinggir halaman atau dipasang di dalam postingan blog. Tips ini juga sekaligus untuk menjawab ajakan dari Andika Pandanu lewat formulir kontak blog ini sebagai berikut

Bagi yang ingin memasang widget ShareThis ini silakan ikuti langkah-langkah di bawah ini.

Cara Memasang Widget ShareThis di Blogger

Pertama, kalau teman belum mempunyai akun di ShareThis silakan daftar terlebih dahulu di link ini https://www.sharethis.com. Cara daftarnya klik hidangan Account di pojok kanan atas halaman ShareThis, lalu akan muncul halaman ibarat ini dan klik goresan pena Sign up - it's free

Kemudian tambahkan keterangan email, password dan alamat blog di halaman selanjutnya. Klik tanda centang di Privacy Notice dan klik tombol GET STARTED - IT'S FREE

Setelah masuk di dasbor ShareThis, klik tombol Get The Code untuk memverifikasi

Kemudian klik tombol Copy dan pastekan instruksi tersebut di dalam template editor blog sebelum instruksi </head> atau instruksi </head>, kalau sudah ditambahkan klik tombol Simpan tema.

Jika terdapat pesan kesalahan dikala klik tombol Simpan tema, silakan tambahkan instruksi amp; pada link JS ShareThis misalnya ibarat ini

<script type='text/javascript' src='//platform-api.sharethis.com/js/sharethis.js#property=5aee32b17782d000113e1528&product=social-ab' async='async'></script>

Tambahkan dengan instruksi yang saya tandai di bawah ini

<script type='text/javascript' src='//platform-api.sharethis.com/js/sharethis.js#property=5aee32b17782d000113e1528&amp;product=social-ab' async='async'></script>

Jika sudah, kembali ke dasbor ShareThis dan klik tombol Verify. Setelah itu akan muncul pesan All systems go! We've verified sharethis.js in installed dan Widget ShareThis siap digunakan. Biar lebih afdol, kini teman klik hidangan Property Settings. Kemudian klik tombol Resend Verification Email dan cek email untuk verifikasi email dari ShareThis.

Nah kini teman tinggal mengaktifkan tombol mana yang ingin dimunculkan di blog, klik hidangan Share Buttons dan pilih style yang ingin digunakan. Misalnya saya pilih Sticky Share Buttons, maka aktifkan tombol dari off ke on ibarat ini

Di sini teman juga sanggup mengatur tombol share apa saja yang ingin diaktifkan dan beberapa pengaturan lainnya dengan mudah.

Tambahan

Reaction Buttons

Untuk mengaktifkan tombol Reaction Buttons, teman hanya perlu pilih hidangan Reaction Buttons lalu klik Inline Reaction Buttons dan klik tombol radio dengan posisi off ke on

Kemudian tambahkan instruksi HTML Reaction Buttons ini ke dalam template sesudah instruksi <data:post.body/> paling bawah

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='sharethis-inline-reaction-buttons'/> <div class='clear'/> </b:if>

GDPR Compliance tool

Untuk mengaktifkan fitur GDPR Compliance tool, cukup klik hidangan GDPR lalu klik tombol dari off ke on pada hidangan sebelah kanan dan edit bab pengaturannya sesuai kebutuhan

Itulah wacana Cara Memasang Widget ShareThis di Blogger, agar bermanfaat dan wassalam.

Tips Blogger Widget

Cara Memasang Widget Sharethis Di Blogger

Concept Phone Sabtu, 08 Desember 2018

Menambahkan Tombol Share Pada Template Revoltify Menambahkan Tombol Share Pada Template Revoltify

Menambahkan Tombol Share Pada Template Revoltify - Selamat malam teman blogger, kali ini Saya akan membuatkan cara memasang tombol share di halaman utama blog pada template Revoltify.

Postingan ini Saya buat atas ajakan teman blogger disini wacana bagaimana cara menambahkan tombol share yang muncul saat kursor mouse digeser ke postingan menyerupai yang ada di blog ini. Tentunya teman sudah tahu dengan fungsi dari tombol share ini dan disini Saya tidak akan menjelaskan wacana fungsinya melainkan cara penerapannya, teman tidak perlu khawatir wacana loading halaman alasannya tombol ini cukup ringan yang hanya memakai CSS dan Markup saja.

Berikut cara penerapannya :

Buka dashboard Blogger
Klik Template
Klik Edit HTML
Terapkan arahan di bawah ini di dalam CSS khusus homepage / halaman utama

/* CSS Homepage Share */ ul.twitfbshare{clear:both;float:left;list-style:none outside none;position:absolute;z-index:10;margin:0;padding:0;top:20px;left:20px;line-height:normal;overflow:hidden;} ul.twitfbshare li{text-align:left;float:left;margin-bottom:0;margin-top:-30px;opacity:0;padding:0;transition:all 0.3s;} .post:hover .twitfbshare li{opacity:1;margin-top:0;} ul.twitfbshare li a{background-clip:padding-box;background-repeat:no-repeat;display:block;overflow:hidden;text-align:center;text-transform:uppercase;white-space:nowrap;width:30px;height:30px;line-height:30px;position:relative;margin:0;padding:0;font-size:14px;font-weight:normal;background-color:#fff;color:#aaa;transition:all 0.3s;} ul.twitfbshare li a:hover{color:#fff;} ul.twitfbshare li a.f-like:hover {background-color:#5379b7;} ul.twitfbshare li a.t-share:hover {background-color:#59c2e7;} ul.twitfbshare li a.gplus-share:hover {background-color:#f35d5c;}

Kemudian cari arahan di bawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:post.thumbnailUrl'>

Terapkan arahan di bawah ini sempurna sesudah arahan di atas

<ul class='twitfbshare'>   <li>    <a class='f-like' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share On Facebook'><i class='fa fa-facebook'/></a>    </li>         <li>    <a class='t-share' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Tweet On Twitter'><i class='fa fa-twitter'/></a>    </li>         <li>    <a class='gplus-share' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share On Google Plus'><i class='fa fa-google-plus'/></a>    </li>  </ul>

Setelah diterapkan akan terlihat menyerupai ini

<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:post.thumbnailUrl'>  <ul class='twitfbshare'>   <li>    <a class='f-like' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share On Facebook'><i class='fa fa-facebook'/></a>    </li>         <li>    <a class='t-share' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Tweet On Twitter'><i class='fa fa-twitter'/></a>    </li>         <li>    <a class='gplus-share' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Share On Google Plus'><i class='fa fa-google-plus'/></a>    </li>  </ul>

Terakhir simpan template dan lihat hasilnya.

Jika teman ingin memasang tombol share tersebut pada template lain, silahkan diadaptasi kembali. Cukup sekian dan biar bermanfaat.

CSS Facebook HTML

Menambahkan Tombol Share Pada Template Revoltify

Concept Phone Sabtu, 07 April 2018

Memasang Tombol Back To Top di Blog - Kali ini akan share tombol back to top yang lebih sederhana. Bagi Anda yang ingin memasang tombol kembali ke atas atau back to top, di sini Saya akan menyebarkan bagaimana cara memasang aba-aba itu di blog Anda.

akan share tombol back to top yang lebih sederhana Memasang Tombol Back To Top di Blog

Walaupun tombol ini cukup sederhana, tetapi berdasarkan Saya terasa sangat menarik dan minimalis. Tombol ini nantinya akan muncul di pojok bawah kanan blog Anda. Oke! Langsung saja kita menuju tutorial :

1. Login ke Blogger > Klik Template > Edit HTML > Tambahkan aba-aba di bawah ini sempurna di atas aba-aba ]]></b:skin> atau </style>

/* Back To Top */ .backtotop{display:none}.backtotop{position:fixed;bottom:50px;right:0;cursor:pointer;font-weight:bold;box-shadow:-5px 5px rgba(0,0,0,.1);padding:10px;background-color:#fff;opacity:.6}.backtotop span{background-image:url(https://2.bp.blogspot.com/-QLZM-aUhB6w/VyL3AeOfEfI/AAAAAAAADBU/g6Ff-NvsU_c3ZZn3LM0luDDCRnQjzEK9wCLcB/s1600/icon.png);background-position:0 -272px;background-repeat:no-repeat;height:25px;width:22px;display:inline-block;vertical-align:middle;margin-right:5px }.backtotop:hover{opacity:1}

2. Setelah itu tambahkan aba-aba di bawah ini sempurna sebelum aba-aba </body>

<div class="backtotop hide"><span></span>Atas</div> <script type='text/javascript'> $(function(){$(window).scroll(function(){$(this).scrollTop()>100?$(".backtotop").fadeIn():$(".backtotop").fadeOut()}),$(".backtotop").click(function(){return $("html,body").animate({scrollTop:0},800),!1})}); </script>

3. Terakhir simpan template dan lihat hasilnya.

Result

Tips Blogger Widget

Memasang Tombol Back To Top Di Blog

Concept Phone Minggu, 16 September 2018

Tombol Back To Top Ala Blog Kang Ismet Terbaru - Halo, Kali ini saya mau ngasih sebuah tombol back to top yang keren ala blog kang ismet. Siapa sih yang gak kenal kang Ismet, kang Ismet ialah seorang blogger yang populer di Indonesia lewat keunikan dari tutorial blog yang selalu menciptakan pengunjung betah berlama-lama nangkring di blognya.

Tombol Back To Top Ala Blog Kang Ismet Terbaru Tombol Back To Top Ala Blog Kang Ismet Terbaru

Singkat cerita, tahun kemarin entah kenapa blog kang Ismet yang beralamat di blog.kangismet.net jadi jarang update. Saya sendiri kurang tahu penyebabnya apa, kemungkinan ada urusan atau aktivitas di dunia aktual yang tidak memungkinkan untuk update di dunia maya hehe... Tapi sekarang blog kang ismet sudah berdiri kembali dan mulai membuatkan tutorial-tutorial menarik untuk Anda teman Blogger.

Oke tanpa panjang lebar, di sini saya akan share sebuah tombol back to top yang digunakan pada blog kang Ismet dengan tampilan terbarunya. Yang menarik dari tombol ini ialah adanya embel-embel icon link sosmed yang dapat Anda isi dengan link akun sosmed. Bagaimana tertarik untuk mencobanya? Silakan ikuti tutorial berikut

Memasang Tombol Back To Top Ala Blog Kang Ismet Terbaru

1. Login ke blog > Buka Template > Salin isyarat di bawah ini sebelum ]]></b:skin> atau </style>

#fixed-bar{position:fixed;bottom:0;right:0;z-index:100;width:25%;height:38px;clear:both;margin:0;overflow:hidden}#fixed-bar a{float:right;margin:0;padding:0;width:38px;height:42px;font-size:22px;text-align:center;color:#fff;transition:all .3s ease-in}#fixed-bar a.first{background-color:#48cf89}#fixed-bar a.first:hover{background-color:#40bb7b}#fixed-bar a.gplus{background-color:#c95325}#fixed-bar a.gplus:hover{background-color:#bd4e23}#fixed-bar a.fb{background-color:#4591b1}#fixed-bar a.fb:hover{background-color:#3f84a1}#fixed-bar a.twit{background-color:#76bdda}#fixed-bar a.twit:hover{background-color:#67acc8}#fixed-bar a.impoh{background-color:#f8b26b}#fixed-bar a.impoh:hover{background-color:#e9a25a}.bottom-wrapper{max-width:100%;;margin:0 auto}

2. Kemudian salin isyarat di bawah ini sebelum </body>

<div id='fixed-bar' style='display:none'> <div class="bottom-wrapper"> <a class="go-top first" href="#"><span class="fa fa-arrow-up"></span></a> <a class="gplus" href="#" target="_blank" title="Tombol Back To Top Ala Blog Kang Ismet Terbaru"><span class="fa fa-google-plus" style="margin-top:8px"></span></a> <a class="fb" href="#" target="_blank" title="Tombol Back To Top Ala Blog Kang Ismet Terbaru"><span class="fa fa-facebook" style="margin-top:8px"></span></a> <a class="twit" href="#" target="_blank" title="Tombol Back To Top Ala Blog Kang Ismet Terbaru"><span class="fa fa-twitter" style="margin-top:8px"></span></a> <a class="impoh" href="#" title="Tombol Back To Top Ala Blog Kang Ismet Terbaru"><span class="fa fa-paperclip" style="margin-top:8px"></span></a> </div> </div> <script type='text/javascript'> $("#fixed-bar").hide(),$(function(){$(window).scroll(function(){$(this).scrollTop()>600?$("#fixed-bar").slideDown(200):$("#fixed-bar").slideUp(200)}),$(".go-top").click(function(){return $("html,body").animate({scrollTop:0},600),!1})}); </script>

Ganti isyarat yang ditandai dengan alamat sosmed Anda.

3. Simpan template.

Result

Mungkin itu saja sedikit yang dapat saya bagi, kalau ada kurang dan lebihnya dapat ditambahkan di kolom komentar. Terima kasih sudah membaca, agar bermanfaat.

Tips Blogger Widget

Tombol Back To Top Ala Blog Kang Ismet Terbaru

Concept Phone Selasa, 10 April 2018

Tips SEO Untuk Blog Tumblr - Tumblr memang tidah terlalu ramah dengan Search Engine Optimization (SEO), meskipun demikian kita sanggup tetap mengoptimalkan SEO blog tumblr. Sebagai platform blogging yang dikala ini populer, kita sanggup mengedit theme atau HTML blog Tumblr. Inilah yang kita manfaatkan untuk untuk SEO tumblr, yaitu dengan menambah instruksi di theme blog Tumblr.

memang tidah terlalu ramah dengan Search Engine Optimization Tips SEO Untuk Blog Tumblr

Langsung saja, kita bahas trik dan tips ampuh untuk mengakibatkan blog di tumblr menjadi lebih SEO ramah dengan search engine, menyerupai Google, Bing dan Yahoo dengan custum theme. Simak trik dan tips SEO berikut ini:

1. Menganti judul blog dengan judul post

Post di Tumblr dibagi menjadi beberapa jenis, yaitu; teks, photo, quote, chat, link, audio, dan video. Tidak semua post memperlihatkan kolom judul, sehingga jikalau permalinknya dibuka yang muncul yakni judul blog. Ini menciptakan blog sedikit kata kunci yang dirambahi search engine. Untuk itulah, perlu menganti judul blog dengan judul post. Caranya yakni dengan mengganti instruksi <title> yang ada di head tag dengan instruksi berikut:

<title>{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>

2. Menjadikan tag sebagai kata kunci

Sama menyerupai di platform lain, menyerupai Bogger dan Wordpress, di Tumblr juga ada pilihan untuk memperlihatkan tag dikala post. Tag ini sanggup dimanfaatkan menjadi meta keyword. Caranya yakni dengan menambahkan meta tag keyword berikut ini:

<meta name=”keywords” content=”{block:Permalink}{block:Posts}{block:Tags}{Tag}, {/block:Tags}{/block:Posts}{/block:Permalink}” />

3. Menambahkan meta tag title dan description

Tambahkan instruksi meta tag title dan description berikut ini di theme blog Tumblr:

<meta name=”title” content=”{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}” /> <meta name=”description” content=”{MetaDescription}” />

4. Gunakan tag <h1> untuk judul

Menggunakan tag <h1> pada judul post atau blog sanggup menciptakan blog tumblr sanggup menjadi lebih baik di posisi hasil pencarian search engine. Caranya yakni dengan cari instruksi {block:Title} dan ganti dengan instruksi berikut:

{block:Title}<h1>{Title}</h1>{/block:Title}

5. Daftarkan sitemap ke Google Webmaster Tools

Tumblr mimiliki Sitemap XML yaitu http://yourname.tumblr.com/sitemap.xml. Fungsi dari sitemap yakni untuk memperlihatkan gosip kepada search engine mengenai seluruh halaman dan post yang ada dalam sebuah blog. Daftarkan atau submit sitemap blog tumblr kita ke Google Webmaster Tools.

6. Pasang tombol mengembangkan ke bookmark dan sosial media

Dengan memasang button atau tombol mengembangkan pengunjung atau kita sendiri akan lebih gampang membagikan (share) post yang telah dibentuk ke sosial media menyerupai twitter, facebook, google+ dan sebagainya, atau sosial bookmark. Blog tumblr sanggup terbaca oleh search engine menambah backlink.

Itulah Tips SEO Untuk Blog Tumblr semoga blogmu lebih SEO, lebih terkenal di mata search engine. Yang terpenting selalu post konten yang menarik dan bermanfaat dan share ke twitter, facebok dan lain-lain.

SEO

Tips Seo Untuk Blog Tumblr

Concept Phone Kamis, 25 Oktober 2018

Halaman

Social Items

Dewa Blogger

Memasang Tombol Share Di Blog

Membuat Tombol Share Di Bawah Posting Blog

Cara Memasang Widget ShareThis di Blogger

Tambahan

Cara Memasang Widget Sharethis Di Blogger

Menambahkan Tombol Share Pada Template Revoltify

Memasang Tombol Back To Top Di Blog

Memasang Tombol Back To Top Ala Blog Kang Ismet Terbaru

Tombol Back To Top Ala Blog Kang Ismet Terbaru

Tips Seo Untuk Blog Tumblr