Memuat

IndexBlogging

IndexTips SEO

Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar)

Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar)

Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar)
Berikut ini Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar).

Navigasi menu yang tetap tampil saat halaman discroll ke bawah ini disebut juga static menu (menu statis),  floating menu (menu melayang), atau fixed menu.

Cara membuatnya mudah.

Hanya memasang dua jenis kode, yaitu kode CSS dan Javascript.

Tutorial ini terdiri dari dua, yaitu menjadikan menu yang ada menjadi stricky atau melayang dan satu lagi membuat menu statis --termasuk membuat menunya.

Lihat Demo

Cara Menjadikan Menu Tetap Muncul Saat Discroll 

1. Tema > Edit HTML
2. Copas kode berikut ini di atas kode ]]></b:skin>

.sticky {position: fixed;top: 0;width: 100%;}
.sticky + .content {padding-top: 60px;}

3. Copas kode Javascript berikut ini di atas kode </body>

<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("navbar");
var sticky = navbar.offsetTop;
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
</script>

Perhatikan kode warna merah (navbar). Ganti dengan nama kode navigasi menu di template Anda, misalnya navmenu, menunav, main-menu, topmenu, dan semisalnya. 

4. Save!

Cara Membuat Menu Tetap Muncul Saat Discroll

Berikut ini Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar) termasuk membuat navigasi menunya. Bisa diterapkan bagi blog Anda yang belum punya menu, seperti template bawaan blogger.

1.Tema >  Edit HTML
2. Copas kode CSS berikut ini di atas kode ]]></b:skin>

/* Style the navbar */
#navbar {
  overflow: hidden;
  background-color: #333;
}
/* Navbar links */
#navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}
/* Page content */
.content {
  padding: 16px;
}
/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 60px;
}

3. Copas kode HTML berikut ini di bawah kode </header> atau di atas kode seperti <div id='content-wrapper'>  atau <div id='main-wrapper'>

<div id="navbar">
  <a href="#home">Home</a>
  <a href="#news">News</a>
  <a href="#contact">Contact</a>
</div>

4. Copas kode javascript berikut ini di atas kode </body>

<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("myTopnav");
var sticky = navbar.offsetTop;
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
</script>

5. Save! Simpan Template.

Demikian Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar). Good Luck & Happy Blogging! (www.contohblog.com).


Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore Blog

Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore Blog

Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore Blog
Halaman depan (homepage) blog yang menggunakan template selain bawaan Blogger biasanya menampilkan gambar, judul, dan ringkasan atau cuplikan isi artikel (Data Post Snippet).

Para blogger mengenalnya sebagai "Auto Read More".

Jika menggunakan kode auto readmore tanpa javascript, maka jumlah kata atau panjang-pendeknya kutipan sama dengan panjang-pendek ringkasan dari kode Populer Posts bawaan Blogger.

Kita bisa mengatur jumlah karakter atau panjang-pendek auto readmore itu dengan menyisipkan kode dalam template. Di bawah ini tutorialnya.

Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore Blog

Berikut ini Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore  di halaan depan blog. Berlaku bagi template yang menggunakan auto readmore tanpa javascript.

1. Template > Edit HTML
2. Cari kode di bawah ini, gunakan tombol Ctrl + F untuk mempermudah pencarian

<data:post.snippet/>

3. Hapus kode diatas, lalu ganti dengan kode dibawah ini.

<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSnippet(&quot;summary<data:post.id/>&quot;);</script> 

4. Simpan kode berikut ini di atas kode </head>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
snippet_count = 140;
//<![CDATA[
function removeHtmlTag(n,e){if(-1!=n.indexOf("<")){for(var t=n.split("<"),i=0;i<t.length;i++)-1!=t[i].indexOf(">")&&(t[i]=t[i].substring(t[i].indexOf(">")+1,t[i].length));n=t.join("")}for(e=e<n.length-1?e:n.length-2;" "!=n.charAt(e-1)&&-1!=n.indexOf(" ",e);)e++;return n=n.substring(0,e-1),n+"..."}function createSnippet(n){var e=document.getElementById(n),t=snippet_count,i='<div class="snippets">'+removeHtmlTag(e.innerHTML,t)+"</div>";e.innerHTML=i} //]]> </script> </b:if>
</b:if>
5. Atur jumlah karakter deskripsi snippet di kode 140
6. Save! Simpan template.

Catatan: Jika auto readmore blog Anda sudah menggunakan javascript, biasanya kode seperti snippet_count = 140; sudah ada, cuma beda angkanya. Tinggal ubah saja angkanya.

Demikian Cara Menambah atau Mengurangi Teks Ringkasan Auto Readmore Blog. . Good Luck & Happy Blogging! (www.contohblog.com).*

Kode Tampilan Komentar Blogger Responsive & Menarik

Kode Tampilan Komentar Blogger Responsive & Menarik

Sekadar menyimpan Kode Tampilan Komentar Blogger Responsive & Menarik, siapa tahu Anda juga berminat. Kode ini bekerja dengan baik di template Valid HTML dan template bawaan blogger.

Kode Tampilan Komentar Blogger Responsive & Menarik

Desainnya seperti gambar di bawah ini. Simple & Elegant!

Kode Tampilan Komentar Blogger Responsive & Menarik

Cara memasangnya, copas Kode Tampilan Komentar Blogger Responsive & Menarik ini di atas kode ]]></b:skin> atau bungkus dengan kode <style> .... </style> dan simpan di atas kode </head>

.comments{display:block;clear:both;margin:0;color:#333333}
.comments h4{font-weight:400;font-size:12px;font-style:italic;padding-top:1px}
.comments .comments-content{margin:0;padding:0}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:8px}
.comments .comments-content .comment:first-child{padding-top:0}
.facebook-tab,.fb_iframe_widget_fluid span,.fb_iframe_widget iframe{width:100%!important}
.comments .item-control{position:static}
.comments .avatar-image-container{float:left;overflow:hidden;position:absolute}
.comments .avatar-image-container,.comments .avatar-image-container img{height:45px;max-height:45px;width:45px;max-width:45px;border-radius:3px}
.comments .comment-block{overflow:hidden;padding:0 0 10px}
.comments .comment-block,.comments .comments-content .comment-replies{margin-left:60px;margin-top:0}
.comments .comments-content .inline-thread{padding:0}
.comments .comment-actions{float:left;width:100%;position:relative;margin:0}
.comments .comments-content .comment-header{font-size:12px;display:block;overflow:hidden;clear:both;margin:0 0 3px;padding:0 0 5px;border-bottom:1px solid #eee}
.comments .comments-content .comment-header a{color:#333333;transition:color .3s}
.comments .comments-content .comment-header a:hover{color:#5e52f8}
.comments .comments-content .user{font-style:normal;font-weight:600;text-transform:uppercase;display:block}
.comments .comments-content .icon.blog-author{display:none}
.comments .comments-content .comment-content{float:left;text-align:left;color:#5E5E5E;font-size:13px;line-height:1.4em;margin:5px 0 9px}
.comments .comment .comment-actions a{margin-right:5px;padding:2px 5px;background-color:#5e52f8;color:#fff;font-weight:400;font-size:10px;border-radius:2px;transition:all .3s ease}
.comments .comment .comment-actions a:hover{background-color:#272727;text-decoration:none}
.comments .comments-content .datetime{color:#aaa;float:left;font-size:11px;position:relative;display:block;text-transform:uppercase;font-style:italic;margin:4px 0 0}
.comments .comments-content .datetime a,.comments .comments-content .datetime a:hover{color:#aaa}
.comments .thread-toggle{margin-bottom:4px}
.comments .thread-toggle .thread-arrow{height:7px;margin:0 3px 2px 0}
.comments .thread-expanded{padding:8px 0 0}
.comments .comments-content .comment-thread{margin:0}
.comments .continue a{padding:0 0 0 60px;font-weight:400}
.comments .comments-content .loadmore.loaded{margin:0;padding:0}
.comments .comment-replybox-thread{margin:0}
iframe.blogger-iframe-colorize,iframe.blogger-comment-from-post{height:283px!important}
.static_page .comment-system,.static_page .comments{display:block}
.comments ol{list-style:none;margin:0;padding:0}
@media screen and (max-width:480px){.comments .comments-content .comment-replies{margin-left:0}
}

Save!

Demikian Kode Tampilan Komentar Blogger Responsive & Menarik. Happy Blogging! (www.contohblog.com).*

Cara Memasang Tombol Berbagi (Social Share Buttons) Responsive Tanpa Javascript

Cara Memasang Tombol Berbagi (Social Share Buttons) Responsive Tanpa Javascript

Tombol Berbagi (Social Share Buttons) Responsive Tanpa Javascript
KITA bisa memasang tombol berbagi posting blog ke media sosial (Social Share Buttons) dengan menggunakan Addthis atau ShareThis.

Namun, keduanya menggunakan kode javascript yang bisa memberatkan blog.

Berikut ini Tombol Berbagi Sosial (Social Share) Responsive Tanpa Javascript, hanya menggunakan kode CSS dan HTML yang bisa dipasang di bawah posting blog.

Tombol Berbagi Sosial (Social Share) Responsive ini lengkap, mulai Facebook, Twitter, hingga WhatsApp (WA) dan BBM.

Demonya ada di bagian bawah posting ini (Codepen).

Baca Juga: Cara Memasang Link Media Sosial di Sidebar Blog

Cara Memasang Tombol Berbagi Sosial Responsive Tanpa Javascript

1. Klik Tema > Edit HTML
2. Copas kode CSS Tombol Berbagi Sosial (Social Share) Responsive berikut ini di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
.share_responsive{position:relative;height:40px;margin:20px 0!important;padding:0}
.share-btn,.share-btn li,.share_responsive h4{margin:0;padding:0}
.share_responsive h4{height:40px;width:10%;position:absolute;top:0;left:0;z-index:2}
.share-btn{height:40px;padding:0;margin:0!important;width:100%;}
.share-btn:after{clear:both}
.share-btn:after,.share-btn:before{content:' ';display:table}
.share-btn li{box-sizing:border-box;width:10%;height:100%;line-height:40px;padding:0!important;margin:0!important;list-style-type:none!important;transition:all .3s ease-in-out;float:left;border:0!important}
.share-btn li.btn-line a,.share-btn li.btn-line a:hover{background-color:#00C300}
.share-btn li.btn-facebook a{background-color:#306199}
.share-btn li.btn-facebook a:hover{background-color:#244872}
.share-btn li.btn-tumblr a{background-color:#32506d}
.share-btn li.btn-tumblr a:hover{background-color:#22364a}
.share-btn li.btn-linkedin a{background-color:#007bb6}
.share-btn li.btn-linkedin a:hover{background-color:#005983}
.share-btn li.btn-twitter a{background-color:#26c4f1}
.share-btn li.btn-twitter a:hover{background-color:#0eaad6}
.share-btn li.btn-googleplus a{background-color:#e93f2e}
.share-btn li.btn-googleplus a:hover{background-color:#ce2616}
.share-btn li.btn-pinterest a{background-color:#b81621}
.share-btn li.btn-pinterest a:hover{background-color:#8a1119}
.share-btn li.btn-whatsapp a{background-color:#43d854}
.share-btn li.btn-whatsapp a:hover{background-color:#28c039}
.share-btn li.btn-bbm a,.share-btn li.btn-bbm a:hover{background-color:#000}
.share-btn li a,.share_responsive .show-share .show-more{background-color:#ccc;box-sizing:border-box;display:block;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;height:40px;padding:0;position:relative;text-align:center;text-decoration:none;-webkit-transition:background-color .2s ease-in-out;transition:background-color .2s ease-in-out;}
.share_responsive .show-share .show-more{line-height:40px;width:100%;float:left;margin:0;top:0;left:0;cursor:pointer;background-color:#2196f3;position:absolute;top:0;left:0;z-index:2}
.share_responsive .show-share .share-text{font-size:16px;width:0%;height:40px;line-height:40px;overflow:hidden;background:#efefef;position:absolute;top:0;right:0;left:10%;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition: width 2s;transition: width 2s;z-index:1}
.share_responsive .show-share:hover{width:100%;}
.share_responsive .show-share:hover .show-more{width:10%;}
.share_responsive .show-share:hover .share-text{width:90%;padding:0 10px;}
.share-btn li a .btn-icon{display:block;cursor:pointer}
.share-btn li a .btn-icon svg,.share_responsive .show-share svg{height:24px;width:24px;vertical-align:middle}
.share-btn li.btn-googleplus a .btn-icon svg{height:30px;width:30px}
.share-btn li.btn-line a .btn-icon svg{height:44px;width:44px}
.share-btn li.btn-bbm a .btn-icon svg{height:34px;width:34px}
.share-btn li.btn-bbm a,.share-btn li.btn-line a{padding:0}
.share-btn li.btn-bbm a .btn-icon,.share-btn li.btn-line a .btn-icon{padding-top:0}
.share-btn li a .btn-icon svg circle,.share-btn li a .btn-icon svg path,.share_responsive .show-share svg path{fill:#fff}
.share-btn li a .btn-text{color:#fff}
.share-btn li a:active{box-shadow:inset 1px 3px 15px 0 rgba(22,0,0,.25)}
@media screen and (max-width:414px){
.share-btn li a .btn-icon svg,.share_responsive .show-share svg{height:18px;width:18px;vertical-align:middle}
.share-btn li.btn-googleplus a .btn-icon svg{height:24px;width:24px}
.share-btn li.btn-line a .btn-icon svg{height:38px;width:38px}
.share-btn li.btn-bbm a .btn-icon svg{height:28px;width:28px}
}
@media screen and (max-width:375px){
.share-btn li a .btn-icon svg,.share_responsive .show-share svg{height:14px;width:14px;vertical-align:middle}
.share-btn li.btn-googleplus a .btn-icon svg{height:20px;width:20px}
.share-btn li.btn-line a .btn-icon svg{height:30px;width:30px}
.share-btn li.btn-bbm a .btn-icon svg{height:22px;width:22px}
.share_responsive,.share_responsive h4,.share-btn,.share-btn li a,.share_responsive .show-share .show-more,.share_responsive .show-share .show-more,.share_responsive .show-share .share-text{height:30px;}
.share-btn li,.share_responsive .show-share .show-more,.share_responsive .show-share .share-text{line-height:30px;}
.share_responsive .show-share .share-text{font-size:12px;}
}
/*]]>*/
</style>
</b:if>

3. Copas kode HTML Tombol Berbagi Sosial (Social Share) Responsive berikut ini di bawah kode <data:post.body/> yang kedua atau ketiga, atau di atas kode <div class='post-footer>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="share_responsive">
<h4 class='show-share'>
<div class="show-more">
<svg viewBox="0 0 24 24">
<path d="M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z" fill="#000000"></path>
</svg>
</div>
<div class="share-text">Share this post, please!</div>
</h4>
  <ul class='share-btn'>
    <li class='btn-blank'></li>
    <li class='btn-facebook'>
      <a expr:href='&quot;https://www.facebook.com/sharer/sharer.php?u=&quot; + data:post.url' target='_blank' title='Share on Facebook'>
        <span class='btn-icon'>
            <svg viewBox='0 0 29 29' xmlns='http://www.w3.org/2000/svg'><path d='M26.4 0H2.6C1.714 0 0 1.715 0 2.6v23.8c0 .884 1.715 2.6 2.6 2.6h12.393V17.988h-3.996v-3.98h3.997v-3.062c0-3.746 2.835-5.97 6.177-5.97 1.6 0 2.444.173 2.845.226v3.792H21.18c-1.817 0-2.156.9-2.156 2.168v2.847h5.045l-.66 3.978h-4.386V29H26.4c.884 0 2.6-1.716 2.6-2.6V2.6c0-.885-1.716-2.6-2.6-2.6z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-twitter'>
      <a expr:href='&quot;https://twitter.com/intent/tweet?text=&quot; + data:post.title + &quot;&amp;url=&quot; + data:post.url' target='_blank' title='Share on Twitter'>
        <span class='btn-icon'>
            <svg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'><path d='M24.253 8.756C24.69 17.08 18.297 24.182 9.97 24.62a15.093 15.093 0 0 1-8.86-2.32c2.702.18 5.375-.648 7.507-2.32a5.417 5.417 0 0 1-4.49-3.64c.802.13 1.62.077 2.4-.154a5.416 5.416 0 0 1-4.412-5.11 5.43 5.43 0 0 0 2.168.387A5.416 5.416 0 0 1 2.89 4.498a15.09 15.09 0 0 0 10.913 5.573 5.185 5.185 0 0 1 3.434-6.48 5.18 5.18 0 0 1 5.546 1.682 9.076 9.076 0 0 0 3.33-1.317 5.038 5.038 0 0 1-2.4 2.942 9.068 9.068 0 0 0 3.02-.85 5.05 5.05 0 0 1-2.48 2.71z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-googleplus'>
      <a expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' target='_blank' title='Share on Google+'>
        <span class='btn-icon'>
            <svg height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M21 8.29h-1.95v2.6h-2.6v1.82h2.6v2.6H21v-2.6h2.6v-1.885H21V8.29zM7.614 10.306v2.925h3.9c-.26 1.69-1.755 2.925-3.9 2.925-2.34 0-4.29-2.016-4.29-4.354s1.885-4.353 4.29-4.353c1.104 0 2.014.326 2.794 1.105l2.08-2.08c-1.3-1.17-2.924-1.883-4.874-1.883C3.65 4.586.4 7.835.4 11.8s3.25 7.212 7.214 7.212c4.224 0 6.953-2.988 6.953-7.082 0-.52-.065-1.104-.13-1.624H7.614z'/></svg>
            </span>
      </a>
    </li>
    <li class='btn-tumblr'>
      <a expr:href='&quot;http://tumblr.com/share/link?url=&quot; + data:post.url + &quot;&amp;name=&quot; + data:post.title + &quot;&amp;description=&quot; + data:post.snippet' target='_blank' title='Share on Tumblr'>
        <span class='btn-icon'>
            <svg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'><path d='M18.02 21.842c-2.03.052-2.422-1.396-2.44-2.446v-7.294h4.73V7.874H15.6V1.592h-3.714s-.167.053-.182.186c-.218 1.935-1.144 5.33-4.988 6.688v3.637h2.927v7.677c0 2.8 1.7 6.7 7.3 6.6 1.863-.03 3.934-.795 4.392-1.453l-1.22-3.54c-.52.213-1.415.413-2.115.455z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-linkedin'>
      <a expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url' target='_blank' title='Share on Linkedin'>
        <span class='btn-icon'>
            <svg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'><path d='M25.424 15.887v8.447h-4.896v-7.882c0-1.98-.71-3.33-2.48-3.33-1.354 0-2.158.91-2.514 1.802-.13.315-.162.753-.162 1.194v8.216h-4.9s.067-13.35 0-14.73h4.9v2.087c-.01.017-.023.033-.033.05h.032v-.05c.65-1.002 1.812-2.435 4.414-2.435 3.222 0 5.638 2.106 5.638 6.632zM5.348 2.5c-1.676 0-2.772 1.093-2.772 2.54 0 1.42 1.066 2.538 2.717 2.546h.032c1.71 0 2.77-1.132 2.77-2.546C8.056 3.593 7.02 2.5 5.344 2.5h.005zm-2.48 21.834h4.896V9.604H2.867v14.73z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-pinterest'>
      <a expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;media=&quot; + data:post.firstImageUrl + &quot;&amp;description=&quot; + data:post.title' target='_blank' title='Share on Pinterest'>
        <span class='btn-icon'>
            <svg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'><path d='M14.02 1.57c-7.06 0-12.784 5.723-12.784 12.785S6.96 27.14 14.02 27.14c7.062 0 12.786-5.725 12.786-12.785 0-7.06-5.724-12.785-12.785-12.785zm1.24 17.085c-1.16-.09-1.648-.666-2.558-1.22-.5 2.627-1.113 5.146-2.925 6.46-.56-3.972.822-6.952 1.462-10.117-1.094-1.84.13-5.545 2.437-4.632 2.837 1.123-2.458 6.842 1.1 7.557 3.71.744 5.226-6.44 2.924-8.775-3.324-3.374-9.677-.077-8.896 4.754.19 1.178 1.408 1.538.49 3.168-2.13-.472-2.764-2.15-2.683-4.388.132-3.662 3.292-6.227 6.46-6.582 4.008-.448 7.772 1.474 8.29 5.24.58 4.254-1.815 8.864-6.1 8.532v.003z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-whatsapp'>
      <a data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%3A%20&quot; + data:post.url' target='_blank' title='Share on Whatsapp'>
        <span class='btn-icon'>
            <svg height='90' viewBox='0 0 90 90' width='90' xmlns='http://www.w3.org/2000/svg'><path d='M90 43.84c0 24.214-19.78 43.842-44.182 43.842a44.256 44.256 0 0 1-21.357-5.455L0 90l7.975-23.522a43.38 43.38 0 0 1-6.34-22.637C1.635 19.63 21.415 0 45.818 0 70.223 0 90 19.628 90 43.84zM45.818 6.983c-20.484 0-37.146 16.535-37.146 36.86 0 8.064 2.63 15.533 7.076 21.61l-4.64 13.688 14.274-4.537A37.122 37.122 0 0 0 45.82 80.7c20.48 0 37.145-16.533 37.145-36.857S66.3 6.983 45.818 6.983zm22.31 46.956c-.272-.447-.993-.717-2.075-1.254-1.084-.537-6.41-3.138-7.4-3.495-.993-.36-1.717-.54-2.438.536-.72 1.076-2.797 3.495-3.43 4.212-.632.72-1.263.81-2.347.27-1.082-.536-4.57-1.672-8.708-5.332-3.22-2.848-5.393-6.364-6.025-7.44-.63-1.076-.066-1.657.475-2.192.488-.482 1.084-1.255 1.625-1.882.543-.628.723-1.075 1.082-1.793.363-.718.182-1.345-.09-1.884-.27-.537-2.438-5.825-3.34-7.977-.902-2.15-1.803-1.793-2.436-1.793-.63 0-1.353-.09-2.075-.09-.722 0-1.896.27-2.89 1.344-.99 1.077-3.788 3.677-3.788 8.964 0 5.288 3.88 10.397 4.422 11.113.54.716 7.49 11.92 18.5 16.223 11.01 4.3 11.01 2.866 12.996 2.686 1.984-.18 6.406-2.6 7.312-5.107.9-2.513.9-4.664.63-5.112z'/></svg>
          </span>
      </a>
    </li>
    <li class='btn-line'>
      <a expr:href='&quot;https://timeline.line.me/social-plugin/share?url=&quot; + data:post.url' target='_blank' title='Share on Line'>
        <span class='btn-icon'>
           <svg class='icon icons8-LINE' viewBox='0 0 48 48'>
    <path d='M12.5,42h23c3.59,0,6.5-2.91,6.5-6.5v-23C42,8.91,39.09,6,35.5,6h-23C8.91,6,6,8.91,6,12.5v23      C6,39.09,8.91,42,12.5,42z' style='fill:#00C300;'/>
    <path d='M37.113,22.417c0-5.865-5.88-10.637-13.107-10.637s-13.108,4.772-13.108,10.637      c0,5.258,4.663,9.662,10.962,10.495c0.427,0.092,1.008,0.282,1.155,0.646c0.132,0.331,0.086,0.85,0.042,1.185      c0,0-0.153,0.925-0.187,1.122c-0.057,0.331-0.263,1.296,1.135,0.707c1.399-0.589,7.548-4.445,10.298-7.611h-0.001      C36.203,26.879,37.113,24.764,37.113,22.417z M18.875,25.907h-2.604c-0.379,0-0.687-0.308-0.687-0.688V20.01      c0-0.379,0.308-0.687,0.687-0.687c0.379,0,0.687,0.308,0.687,0.687v4.521h1.917c0.379,0,0.687,0.308,0.687,0.687      C19.562,25.598,19.254,25.907,18.875,25.907z M21.568,25.219c0,0.379-0.308,0.688-0.687,0.688s-0.687-0.308-0.687-0.688V20.01      c0-0.379,0.308-0.687,0.687-0.687s0.687,0.308,0.687,0.687V25.219z M27.838,25.219c0,0.297-0.188,0.559-0.47,0.652      c-0.071,0.024-0.145,0.036-0.218,0.036c-0.215,0-0.42-0.103-0.549-0.275l-2.669-3.635v3.222c0,0.379-0.308,0.688-0.688,0.688      c-0.379,0-0.688-0.308-0.688-0.688V20.01c0-0.296,0.189-0.558,0.47-0.652c0.071-0.024,0.144-0.035,0.218-0.035      c0.214,0,0.42,0.103,0.549,0.275l2.67,3.635V20.01c0-0.379,0.309-0.687,0.688-0.687c0.379,0,0.687,0.308,0.687,0.687V25.219z      M32.052,21.927c0.379,0,0.688,0.308,0.688,0.688c0,0.379-0.308,0.687-0.688,0.687h-1.917v1.23h1.917      c0.379,0,0.688,0.308,0.688,0.687c0,0.379-0.309,0.688-0.688,0.688h-2.604c-0.378,0-0.687-0.308-0.687-0.688v-2.603      c0-0.001,0-0.001,0-0.001c0,0,0-0.001,0-0.001v-2.601c0-0.001,0-0.001,0-0.002c0-0.379,0.308-0.687,0.687-0.687h2.604      c0.379,0,0.688,0.308,0.688,0.687s-0.308,0.687-0.688,0.687h-1.917v1.23H32.052z' style='fill:#FFFFFF;'/>
  </svg>
          </span>
      </a>
    </li>
    <li class='btn-bbm'>
      <a expr:href='&quot;bbmi://api/share?message=&quot; + data:post.url + &quot;?ref=bbm&amp;userCustomMessage=&quot; + data:post.title' target='_blank' title='Share on Blackberry'>
        <span class='btn-icon'>
            <svg class='icon BlackBerry-Icon' viewBox='0 0 5067 5067'>
    <rect height='5067' rx='489' ry='489' style='fill: black;' width='5067'/>
    <g>
      <path d='M1327 885l2018 0c141,0 269,58 361,150 93,93 150,221 150,361l0 1457c0,141 -57,268 -150,361 -92,93 -220,150 -361,150l-1584 0 -724 737c64,-258 143,-487 226,-741 -115,-15 -219,-68 -297,-146 -93,-93 -150,-220 -150,-361l0 -1457c0,-140 57,-268 150,-361 92,-92 220,-150 361,-150zm2018 135l-2018 0c-104,0 -197,43 -266,111 -68,68 -110,162 -110,265l0 1457c0,103 42,197 110,265 69,69 162,111 266,111l27 0 90 0 -26 87c-11,37 -57,177 -102,312l369 -379 20 -20 28 0 1612 0c104,0 198,-42 266,-111 68,-68 110,-162 110,-265l0 -1457c0,-103 -42,-197 -110,-265 -68,-68 -162,-111 -266,-111z' style='fill: white; fill-rule: nonzero;'/>
      <path d='M1655 1452l310 0c91,0 149,75 129,166l0 0c-19,91 -110,166 -201,166l-310 0 72 -332z' style='fill: white;'/>
      <path d='M1565 1938l309 0c91,0 149,74 130,165l0 0c-20,92 -111,166 -202,166l-310 0 73 -331z' style='fill: white;'/>
      <path d='M2291 1452l309 0c91,0 150,75 130,166l0 0c-20,91 -111,166 -202,166l-309 0 72 -332z' style='fill: white;'/>
      <path d='M2200 1938l309 0c92,0 150,74 130,165l0 0c-20,92 -111,166 -202,166l-309 0 72 -331z' style='fill: white;'/>
      <path d='M2872 1748l309 0c91,0 149,74 130,165l0 0c-20,92 -111,166 -202,166l-310 0 73 -331z' style='fill: white;'/>
      <path d='M2781 2233l309 0c91,0 150,75 130,166l0 0c-20,91 -111,166 -202,166l-309 0 72 -332z' style='fill: white;'/>
      <path d='M2118 2419l309 0c91,0 150,75 130,166l0 0c-20,91 -111,166 -202,166l-309 0 72 -332z' style='fill: white;'/>
      <path d='M3819 1091l10 0c233,0 423,190 423,422l0 1715c0,232 -190,422 -423,422l-13 0 225 735 -719 -735 -1224 0c-165,0 -308,-96 -378,-235 17,2 34,2 51,2l1586 0c301,0 548,-246 548,-547l0 -1486c0,-107 -32,-208 -86,-293z' style='fill: white;'/>
    </g>
  </svg>
          </span>
      </a>
    </li>
  </ul>
</div>
</b:if>

4. Save! Simpan Template.

DEMO



Demikian Cara Memasang Tombol Berbagi (Social Share Buttons) Responsive Tanpa Javascript. Lihat juga Desain Social Share Lebih Simple Tanpa JS Lainnya. Good Luck & Happy Blogging! (www.contohblog.com).*

Cara Menampilkan Komentar Terbaru di Urutan Pertama

Cara Menampilkan Komentar Terbaru di Urutan Pertama

Cara Menampilkan Komentar Terbaru di Urutan Pertama
Cara Menampilkan Komentar Terbaru di Urutan Pertama.

DI blog ini, komentar terbaru tampil di urutan pertama. Silakan bisa coba sendiri, nanti komentar Anda setelah dipublish akan muncul di urutan teratas.

Secara default, Blogger menampilkan komentar terbaru di bagian bawah daftar komentar. Ini akan membuat komentar terbaru menjadi tidak terlihat, jika komentarnya sudah banyak banget, seperti komentar di posting Cara Ganti Template Blog yang sudah mencapai 260 komenatar lebih.

Cara Menampilkan Komentar Terbaru di Urutan Pertama

Bagaimana caranya menampilkan komentar terbaru di peringkat teratas? Berikut ini cara mengaturnya.

1. Klik Tema » Klik Edit HTML
2. Cari kode ini:

<b:loop values='data:post.comments' var='comment'> 

3. Hapus dan ganti dengan kode ini:

<b:loop reverse='1' values='data:post.comments' var='comment'>

4. Simpan Template!

Demikian tutorial singkat Cara Menampilkan Komentar Terbaru di Urutan Pertama. Good Luck & Happy Blogging! (www.contohblog.com).*

4 Cara Agar Posting Artikel Blog Cepat Terindeks Google & Banyak Pengunjung

4 Cara Agar Posting Artikel Blog Cepat Terindeks Google & Banyak Pengunjung

4 Cara Agar Posting Artikel Blog Cepat Terindeks Google & Banyak Pengunjung.


Cara Agar Posting Artikel Blog Cepat Terindeks Google

PROSES indeks mesin pencari (Google Index) terhadap postingan, tulisan, posting, atau konten blog kita bisa cepat, bisa juga lama (berjam-jam bahkan berhari-hari).

Mesin perayap Google (Googlebot) melakukan perayapan ulang situs web di seluruh dunia. Saingan kita banyak, pastinya. Kecuali postingan kita benar-benar unik, baru, dan tidak punya saingan atau tidak ada artikel yang topiknya serupa.

Butuh sentuhan pengoptimalan mesin pencari (SEO) agar tulisan kita mudah dan cepat terindeks Google dan mesin telusur lainnya. Namun, Google sendiri tidak menjamin cepat atau lambat karena yang bekerja adalah sistem (robot, mesin) yang sudah diterapkan.

Kita tidak bisa hanya menunggu. Harus proaktif biar postingan blog cepat dan mudah terindeks Google.

Dengan cepat terindex Google, maka postingan blog kita pun akan tampil di halaman depan hasil pencarian (SERP), sehingga banyak pengunjung.

4 Cara Agar Posting Artikel Blog Cepat Terindeks Google

1. Daftarkan Blog ke Google Webmasters Tools (Search Console)

- Klik Google Search Console.
- Tambahkan Property dengan memasukkan url blog Anda
- Klik ADD PROPERTY warna merah.

tambahkan properti

2. Kirim Peta Situs (Sitemap)

Peta situs ini akan membantu mesin perayap Google menjangkau seluruh bagian dalam situs web atau blog dengan lebih cepat.

- Klik Crawl
- Klik Sitemap

crawl sitemap

- Klik ADD/TEST SITEMAP
- Tambahkan sitemap.xml di kolom yang tersedia.

Kirim Peta Situs
- Klik Submit

3. Ambil sebagai Google (Fetch as Google)

- Pada menu sebelah kiri pilih lagi Crawl (Perayapan)
- Klik "Fetch as Google" (Ambil sebagai Google)

Fetch as Google

- Klik FETCH

Ambil sebagai Google

Catatan: 
- Langkah ketiga ini juga bisa dilakukan setiap kali Anda menulis artikel baru, agar cepat dan mudah terindeks Google. 
- Maksud "Fetch as Google" adalah langkah proaktif kita untuk "mengundang" mesin pencari agar segera merayap dan mengindeks konten blog kita.

4. Ping Blog!

Setelah ketiga  Cara Agar Posting Artikel Blog Cepat Terindeks Google di atas, kita bisa melakukan langkah tambahan, dengan Ping blog kita ke Pingomatic.

- Buka Pingo Matic
- Masukkan Nama & Alamat Blog
- Klik Send Ping!

Ping Blog Pingomatic

Demikian  4 Cara Agar Posting Artikel Blog Cepat Terindeks Google, sehingga blog kita banyak pengunjungnya. Lebih penting lagi adalah memastikan postingan blog kita merupakan Konten Berkualitas.


Good Luck & Happy Blogging! (www.contohblog.com).*

Cara Mengatasi Gambar & Deskripsi Posting Blog Tidak Muncul Saat Share di Facebook

Cara Mengatasi Gambar & Deskripsi Posting Blog Tidak Muncul Saat Share di Facebook

Cara Mengatasi Gambar & Deskripsi Posting Blog Tidak Muncul Saat Share di Facebook
Cara Mengatasi Gambar & Deskripsi Posting Blog Tidak Muncul Saat Share di Facebook.

BIASANYA masalah gambar dan deskripsi posting blog tidak muncul saat dishare ke Facebook, dialami blog yang menggunakan template yang sudah dimodifikasi.

Template bawaan blogger biasanya aman-aman saja.

Tampilan posting saat dibagikan di Facebook lengkap: judul, gambar, deskripsi, dan link atau nama blog.

Berikut ini contoh dua tampilan posting blog saat dibagikan di Facebook, gambar besar dan gambar kecil.

share posting blog facebook

share posting blog facebook

Mengatasi Masalah Gambar & Deskripsi Share Facebook

Berikut ini Cara Mengatasi Gambar & Deskripsi Posting Blog Tidak Muncul Saat Share di Facebook.

1. Tema > klik Edit HTML
2. Copas kode berikut ini di bawah kode <head>


<b:if cond='data:blog.postImageUrl'>
<meta expr:content='"" + data:blog.postImageUrl' property='og:image'/>
<b:else/>
<meta content='https://2.bp.blogspot.com/-erTXCq61ULM/TmHYAQBZ0GI/AAAAAAAACCs/6cBX54Dn6Gs/s200-c/default.png' property='og:image'/>
</b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.pageName' property='og:title'/>

Yang warna merah itu adalah link gambar cadangan jika postingan Anda tidak memiliki gambar atau foto. Bisa diganti dengan logo atau gambar lain. Ukuran minimal 200x200 pixel.

3. Save!

Cek di Facebook Debugger Tools!

CARA LAIN

Jika setelah kode di atas terpasang, dalam 1x24 jam masih belum teratasi, lakukan cara Mengatasi Masalah Deskripsi yang Tidak Muncul berikut ini sebabagai langkah extra:

CARA #1

Pasang kode ini di atas kode <data:post.body/> yang kedua atau ketiga. Kode ini untuk memunculkan deskripsi atau kutipan isi postingan blog.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.snippet'>
<meta expr:content='data:post.snippet' name='description'/>
</b:if>
</b:if>

CARA #2

Jika cara pertama tidak berhasil, lanjutkan dengan cara yang kedua ini, yaitu mengubah kode <data:post.body/> menjadi <p><data:post.body/></p>

Intinya, menambahkan kode <p> dan </p> di depan dan belakang <data:post.body/>

CARA #3

Jika masih saja bermasalah:

1. Copas kode Meta Tag Facebook Open Graph berikut ini di bawah kode <head>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:post.snippet' name='og:description'/>
<b:else/>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='KODE_APLIKASI_FB_ANDA' property='fb:app_id'/>
<meta content='KODE_ADMIN_FB_ANDA' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>

2. Copas juga kode berikut ini di bawah kode <body> atau <body ....>

<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'KODE_APLIKASI_FB_ANDA',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>

PENTING!

Jika masih berlum berhasil juga, gambar dan deskripsi masih tidak muncul saat share ke FB, kemungkinan Anda tidak mengisi form "Search Description" (Deskripsi Pencarian) saat menulis posting, yaitu menu di sidebar kanan:

form "Search Description" atau Deskripsi Pencarian

Demikian Cara Mengatasi Masalah Gambar & Deskripsi Posting Saat Share di di Facebook. Good Luck! (www.contohblog.com).*

Sumber:
http://www.bloggersentral.com/2010/11/facebook-share-shows-wrong-description.html
http://www.bloggerplugins.org/2012/01/wrong-description-image-facebook.html

Cara Mengembalikan Tampilan Gmail ke Versi Lama (Classic)

Cara Mengembalikan Tampilan Gmail ke Versi Lama (Classic)

GMAIL (Google Mail) memiliki tampilan baru. Namun, CB lebih suka tampilan lama. Mungkin, Anda juga karena banyak lho yang lebih suka tampilan klasik.

Bagaimana cara mengembalikan tampilan email Gmail ke versi lama (classic)?

Cara Mengembalikan Tampilan Gmail ke Versi Lama (Classic)

Cara Mengembalikan Tampilan Gmail ke Versi Lama (Classic)

Awalnya, sangat mudah kembali ke tampilan lama yang lebih simple dan lebih nyaman di mata. Caranya:

1. Klik icon gear di kanan atas
2. Klik "Go back to classic Gmail" (Kembali ke Gmail klasik)

Kembali ke Gmail klasik


Namun, kini, opsi itu tidak ada lagi. Kita tidak bisa kembali ke tampilan Gmail versi klasik.

Saat ini kita hanya bisa melakukan setting (pengaturan) agar tampilan Gmail mirip desain klasik atau mendekati versi lama yang lebih simple.

Caranya:

1. Klik icon Gear > Pilih choose “Display Density”
2. Pilih “Compact” atau ‘Comfortable’ > Klik OK
3. Klik lagi ikon gear > pilih “Settings”
4. Di bawah menu ‘General’, lihat pilihan “Hover actions:” dan Pilih “Disable hover actions

Disable hover actions


5. Scroll ke bawah lalu klik Save Changes

OPSI

Kita juga bisa lakukan langkah tambahan dengan memilih tema (themes) untuk memilik background.

1. Klik lagi icon Gear > pilih “Themes
2. Scroll ke bawah dan pilih “Soft Gray”.

Soft Gray Gmail Theme


Demikian Cara Mengembalikan Tampilan Gmail ke Versi Lama (Classic). (www.contohblog.com).*

Pengertian Niche Blog, Jenis-Jenis & Cara Memilihnya

Pengertian Niche Blog, Jenis-Jenis & Cara Memilihnya

Pengertian Niche Blog, Jenis-Jenis & Cara Memilihnya.

Pengertian Niche Blog, Jenis-Jenis & Cara Memilihnya
Niche adalah ceruk, relung, atau kedudukan yg sesuai. Itu pengertian niche secara bahasa (Inggris).

Secara istilah, niche artinya adalah topik atau subjek bahasan tertentu.

Wikipedia mendefinisikan niche sebagai "bagian dari sektor pasar yang terfokus dan dapat ditargetkan".

Dalam dunia blogging, niche adalah topik khusus yang menjadi konten utama blog, misalnya blog pendidikan, blog sepakbola, blog kecantikan, blog kesehatan, dsb.

Dengan demikian, niche blog itu merupakan jenis blog yang berisi konten atau tulisan khusus topik tertentu, seperti blog kesehatan, blog pendidikan, dll.

Lawan niche blog adalah general blog, yaitu blog yang berisi beragam topik alias campur-campur. Jika blog Anda berisi beragam posting dengan berbagai macam topik, maka tidak masuk dalam kategori niche blog, melainkan general blogging alias "blog gado-gado".

Blogger pemula banyak yang memilih niche tentang blogging. Blog tentang blogging ini disebut Meta Blogging.

Agak "lucu" memang, baru ngeblog kok sudah "ngajarin" orang lain tentang blogging. Udah gitu, copas lagi! Tapi tidak apa. Mungkin maksudnya berbagi (share) saja.

Jenis Niche Blog

Secara umum ada empat jenis niche blog, menurut John James Robinson dalam e-booknya  The Authority Site Adsense Guide.

Pengertian Niche Blog dan Jenis-Jenisnya
1. Whole-niche.

Yaitu niche blog yang membahas seluruh jangkauan topik. Ambil contoh, jika blog Anda membahas seputar Blogger, maka Anda membahas seluruh topik, mulai dari template Blogger, panduan Blogger, SEO Blogger, dan Desain Blogger.

2. Broad-niche

Yaitu niche blog yang tidak membahas keseluruhan topik, melainkan sebagian besar topik. 

Contoh, jika blog Anda membahas seputar Blogger, maka blog Anda akan membahas bagaimana blog bisa menghasilkan uang, jadi pembahasannya meliputi, SEO untuk blogger, hingga monetize blog Blogger Anda.

3. Themed-niche

Yaitu niche blog yang sudah mengarah ke suatu topik tertentu saja. Misalnya blog Anda topiknya seputar Blogger, maka pembahasan di blog Anda hanya seo off page untuk blogger saja.

4. Micro-niche

Yaitu niche blog yang sangat sempit dan begitu terarah detail. Misalnya, topik blog Anda adalah seputar blogger, maka pembahasan di niche blog Anda nantinya hanya membahas seputar blogging.

Tips Memilih Niche Blog

Banyak blogger yang memilih niche blog yang tidak sesuai dengan keahliannya. Akibatnya, konten blognya lebih banyak hasil COPAS ketimbang tulisan sendiri, asli, unik, orisinal.

Niche blog terbaik adalah topik yang sesuai dengan passion, yakni bakat dan minat, sehingga posting akan asli, ditulis dengan hati, punya jiwa, kuat, karena memang dikuasai.

Blogger sendiri sudah memandu Anda tentang passion ini:

passion niche blog

Niche blog terbaik lainnya adalah topik seputar pengalaman atau hal-hal yang sudah dialami, lalu dibagikan kepada pembaca.

Posting berupa pengalaman akan tampak alami, natural, orisinal, dan ini sangat disukai Google. Google want fresh content!

Sehebat-hebatnya trik COPAS agar tidak ketauan sebagai copy paste, mesin pencari sudah punya database yang menyimpan posting aslinya. 

Jikapun tulisan hasil copas Anda ada di peringkat atas hasil pencarian, itu hanya sementara, bahkan bisa berakibat fatal: blog Anda melanggar hak cipta dan dibanned Google.

Demikian sekilas Pengertian Niche Blog dan Jenis-Jenisnya, plus tips memilih niche blog yang baik bagi blog Anda. Good Luck & Happy Blogging! (www.contohblog.com).*

Cara Share Gambar & Posting Blog ke Instagram

Cara Share Gambar & Posting Blog ke Instagram

Cara Share Gambar & Posting Blog ke Instagram


Cara Share Gambar & Posting Blog ke Instagram
Bagaimana cara share gambar & posting blog ke Instagram? Apakah bisa pasang tombol berbagi (share button) instagram di blog?

Pertanyaan serupa muncul di forum Quora. Jawabannya:

"No, you can't. Instagram doesn't have such feature which lets you share image from the website directly like Pinterest."

Jadi, sejauh ini kita belum bisa shara posting blog ke Instagram sebagaimana kita share ke Facebook, Twitter, Google Plus, atau Pinterest. 

Cara Share Gambar & Posting Blog ke Instagram

Untuk share posting blog harus dilakukan manual. Kita bisa gunakan Instagram for Desktop untuk share posting blog ke Instagram:

1. Upload Foto
2. Kasih Keterangan/Caption
3. Tambahkan Link ke Posting Blog

Demikian Cara Share Gambar & Posting Blog ke Instagram. Happy Blogging! (www.contohblog.com).*

Contact Form

Name

Email *

Message *