Tampilkan postingan dengan label Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Blog. Tampilkan semua postingan

Sabtu, 20 April 2019

Cara Mengganti dan Merubah Tampilan Kotak Komentar Blog Keren Ala Google

www.indoblog.me - Pada kesempatan kali ini cuma mau berbagi info Cara Mengganti dan Merubah Tampilan Kotak Komentar Blog Keren Ala Google sebenarnya jenis tampilan ini sudah umum akan tetapi apabila kamu belum memasangnya bisa juga ikut dicoba ya.

Sebenarnya tampilan atau design ini dikeluarkan oleh blogger pada versi 3 dan sepertinya beberapa platform yang digunakan oleh google banyak menggunakan tampilan dan design yang hampir hampir mirip dengan yang akan saya bagikan disini.

Yang dimana pada versi 3 ini tampilan komentar blog akan terkesan minimalis dan tentunya terlihat sangat modern dan untuk beberapa template blog yang ada saat ini belum bisa menggunakan fiture komentar blog minimalis jenis ini.

Akan tetapi kamu jangan khawatir karena saya sudah dapat kodenya dari blog seberang yang mungkin akan anda butuhkan juga.

Lantas apakah di blog ini sudah dipasang jenis tampilan komentar minimalis ini, jawabannya belum? soalnya lagi ada pr atau masih ada pr untuk edit-edit templatenya dan tentunya akan saya pasang juga kode tampilan komentar blog keren ini.

Sebenarnya ini untuk dokumentasi admin saja jika besok membutuhkan kode ini tinggal buka blog atau buka halaman posting ini saja, ya sudah bagi sahabat-sahabat semuanya yang membutuhkannya langsung saja disimak tipsnya.

CARA MERUBAH TAMPILAN KOMENTAR BLOG KE VERSI BARU

1. Langsung saja masuk ke EDIT HTML lalu cari kode <b:skin><![CDATA[ kemudian langsung pasang kode dibawah ini tepat dibawahnya kode <b:skin><![CDATA[ tersebut

Cara Mempercantik Tampilan Komentar Blog

<!-- Variable definitions -->
<Group description="Komentar Baru Blogger (Contempo, Soho, Emporio, Notable)">
 <Variable name="body.background" description="Body Background" type="background" color="#dddfe2" default="#1a1f26 none repeat scroll top left" value="#1a1f26 none repeat scroll top left"/>
 <Variable name="body.font" description="Font" type="font" default="normal 400 14px Roboto, Arial, sans-serif" value="normal 400 14px Arial,sans-serif"/>
 <Variable name="body.text.color" description="Text Color" type="color" default="#1d2129" value="#1d2129"/>
 <Variable name="body.text.font" description="1"
  type="font"
  default="$(body.font)" value="normal 400 14px Roboto,Arial,sans-serif"/>
 <Variable name="posts.background.color" description="2"
  type="color"
  default="#fff" value="#ffffff"/>
 <Variable name="body.link.color" description="3"
  type="color"
  default="#008c5f" value="#008c5f"/>
 <Variable name="body.link.visited.color" description="4"
  type="color"
  default="#008c5f" value="#008c5f"/>
 <Variable name="body.link.hover.color" description="5"
  type="color"
  default="#1d2129" value="#1d2129"/>
 <Variable name="blog.title.font" description="6"
  type="font"
  default="$(body.text.font)" value="normal 400 14px Roboto, Arial, sans-serif"/>
 <Variable name="blog.title.color" description="7"
  type="color"
  default="#fff" value="#ffffff"/>
 <Variable name="header.icons.color" description="8"
  type="color"
  default="#fff" value="#ffffff"/>
 <Variable name="tabs.font" description="9"
  type="font"
  default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
 <Variable name="tabs.color" description="10"
  type="color"
  default="#ccc" value="#cccccc"/>
 <Variable name="tabs.selected.color" description="11"
  type="color"
  default="#fff" value="#ffffff"/>
 <Variable name="tabs.overflow.background.color" description="12"
  type="color"
  default="#fff" value="#ffffff"/>
 <Variable name="tabs.overflow.color" description="13"
  type="color"
  default="$(body.text.color)" value="#1d2129"/>
 <Variable name="tabs.overflow.selected.color" description="14"
  type="color"
  default="$(body.text.color)" value="#1d2129"/>
 <Variable name="posts.title.color" description="15"
  type="color"
  default="$(body.text.color)" value="#1d2129"/>
 <Variable name="posts.title.font" description="16"
  type="font"
  default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
 <Variable name="posts.text.font" description="17"
  type="font"
  default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
 <Variable name="posts.text.color" description="18"
  type="color"
  default="$(body.text.color)" value="#1d2129"/>
 <Variable name="posts.icons.color" description="19"
  type="color"
  default="$(body.text.color)" value="#6c6f74"/>
 <Variable name="labels.background.color" description="20"
  type="color"
  default="#008c5f" value="#008c5f"/>
</Group>

2. Kemudian selanjutnya cari kode data:post.commentFormIframeSrc dan ganti semua kode tersebut dengan kode yang ada dibawah ini.

Cara Mengganti Tampilan Komentar Blogger Lebih Simpel Dan Keren

data:post.commentFormIframeSrc appendParams {skin: "contempo"}

Kemudian jangan lupa save atau simpan tema kamu dan lihat hasilnya apakah sekarang komentar kamu ada yang berubah terutama terlihat dari icon foto yang menjadi bulat-bulat.

Ok gaess itu saja dulu info kali ini dengan bagaimana Cara Mengganti dan Merubah Tampilan Kotak Komentar Blog Keren Ala Google semoga bermanfaat dan membantu dan terima kasih, dan apabila masih banyak kekurangannya mohon dimaafkan ya.

Cara Mengatasi dan Memperbaiki Tombol Balas Komentar Blog Yang Tidak Bisa Membalas

www.indoblog.me - Awalnya saya bingung kenapa komentar blog saya tidak membalas bahkan banyak yang error dan setelah mencoba di replace atau diganti dengan tema aslinya atau template bawaan ini tetap saja hasilnya nihil dan berikut adalah Cara Mengatasi dan Memperbaiki Tombol Balas Komentar Blog Yang Tidak Bisa Membalas yang dimana tips ini work untuk template buatan arlina design.

Uji coba perbaikan tombol komentar yang error reply atau yang tidak bisa membalas ini work untuk semua template buatan arlina design misalnya template Arlina Theme, Viomagz, ‎New Simplify 2, ‎Viral Go dan ‎Mocca dan kebetulan template blog yang digunakan ini menggunakan tema simplify dan tidak menutup kemungkinan bisa digunakan untuk template yang lainnya yang mengalami masalah yang sama dengan mimin.

Nah lantas bagaimana solusi error reply pada tombol komentar blog pada template buatan arlina design tersebut dan untuk mengatas kegalauan tersebut langsung saja disimak tips dan trik cara mengaktifkan kembali tombol balas komentar template arlina yang tidak berfungsi dan akan berfungsi kembali untuyk contohnya bisa kamu lihat pada blog ini saja.

1. Pada Langkah pertama silahkan masuk ke dasbard blogger TEMA lalu EDIT HTML cari kode seperti dibawah ini, pada template simplify kode tersebut ada 2 dan silahkan ganti dua-duanya.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
          <b:if cond='data:post.showThreadedComments'>
            <b:include data='post' name='comments'/>
          <b:else/>
            <b:include data='post' name='comments'/>
          </b:if>
        </b:if>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
          <b:if cond='data:post.showThreadedComments'>
            <b:include data='post' name='comments'/>
          <b:else/>
            <b:include data='post' name='comments'/>
          </b:if>
        </b:if>

Mengatasi Memperbaiki Mengembalikan Tombol Balas Komentar Blog Yang Rusak

Jika sudah ketemu kode diatas silahkan ganti dengan yang ada dibawah ini, ingat kode tersebut pada template arlina simplify ada 2

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
          <b:include data='post' name='comment_picker'/>
        </b:if>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
          <b:include data='post' name='comment_picker'/>
        </b:if>

Mengatasi Memperbaiki Mengembalikan Tombol Balas Komentar Blog Yang Rusak

2. Selanjutnya kemudian silahkan cari kode seperti dibawah ini, untuk mempermudah pencarian search menggunakan CTRL+F saja

<b:includable id='comment_picker' var='post'>...........</b:includable>

Mengatasi Memperbaiki Mengembalikan Tombol Balas Komentar Blog Yang Rusak

Setelah ketemu silahkan ganti mulai dari <b:includable id='comment_picker' var='post'> sampai dengan penutupnya </b:includable> dengan kode dibawah ini:

<b:includable id='comment_picker' var='post'>
  <b:if cond='data:post.commentSource == 1'>
    <b:include data='post' name='iframe_comments'/>
  <b:else/>
    <b:if cond='data:post.showThreadedComments'>
      <b:include data='post' name='threaded_comments'/>
    <b:else/>
      <b:include data='post' name='comments'/>
    </b:if>
  </b:if>
</b:includable>

3. Lalu untuk selanjutnya adalah cari kode ]]></b:skin> setelah ketemu silahkan taruh kode dibawah ini tepat diatas kode ]]></b:skin> tersebut

Mengatasi Memperbaiki Mengembalikan Tombol Balas Komentar Blog Yang Rusak

/* CSS New Comments */
.comment-thread .user a{font-weight:700;color:#4982dd;padding:0;font-size: 15px;text-decoration: none;}
.comment-thread .user a:hover{color:inherit}
.comment-thread .user{font-weight: bold;padding:0;font-size: 15px;text-decoration: none;}
.comment-thread .datetime {font-weight: normal;font-size:11px;}
.comment-thread .user {padding:0;font-size:15px;font-weight:bold;position:relative;}
.comment-thread .datetime {color: #a9a9a9;font-size:13px!important;margin-top:-3px;}
.comment-thread .datetime a{text-decoration:none;color: #a9a9a9;font-size:13px!important;font-weight:normal;}
.comment-thread .datetime a:hover{color: #000;}
.comment-content {line-height: 1.5em;margin:4px 0 5px;color: #444;font-weight:normal;font-size: 15px;word-wrap:break-word;padding:0;}
a.comment-reply, .item-control a{color: #aaa !important;font-size:12px!important;font-weight:normal!important;}
a:hover.comment-reply, .item-control a:hover{color:#000 !important;}
.item-control{margin-left:0px} /* tombol delete comment */
.thread-chrome a.comment-reply{margin-top:20px!important;border:1px solid #eee;text-align:center;border-radius:5px}
.thread-chrome a:hover.comment-reply{border-color:#bbb}
.comment-block{margin-left:65px;padding:10px;text-align:left;border:1px solid #2571ea;border-radius:5px;position:relative;display:block}
#comments .comments-content .icon.blog-author{
width: 16px;height: 16px;margin-left: 5px;vertical-align: 2px;display: inline-block;background: url(&quot;data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1Z' fill='%23118ff9'/></svg>&quot;) center center no-repeat;}

Catatan: Silahkan simpan template kamu tersebut karena khusus untuk template buatan arlina design yang simplify sampai tahap ini sudah memberikan solusi, hanya saja untuk template yang bukan buatan arlina sampai tahap ini belum memberikan solusi dan masih acak-acakan.

4. Lanjut jika tahap diatas masih banyak yang error dengan berbagai bentuk font dan tulisannya, silahkan cari kode dibawah ini

<b:includable id='threaded_comments' var='post'>......</b:includable>

Lalu replace atau ganti semuanya dengan kode yang ada dibawah ini

<b:includable id='threaded_comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
   <h3>
  <b:if cond='data:post.numComments == 1'>1 <data:commentLabel/>:
     <b:else/>
      <span class='embel'>This post have</span> <data:post.numComments/> <data:commentLabelPlural/>
    </b:if>
   </h3>
    <p class='comment-footer'>
      <b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>
      <b:else/>
        <data:post.noNewCommentsText/>
      </b:if>
    </p>
    <div class='comments-content'>
      <b:include cond='data:post.embedCommentForm' data='post' name='threaded_comment_js'/>
      <div id='comment-holder'>
         <data:post.commentHtml/>
      </div>
    </div>
    <b:if cond='data:showCmtPopup'>
      <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
      </div>
    </b:if>
    <div id='backlinks-container'>
    <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
      <b:include cond='data:post.showBacklinks' data='post' name='backlinks'/>
    </div>
    </div>
  </div>
</b:includable>

Catatan: Dan untuk sebagian besar kasus sampai tahap ini sudah memberikan solusinya dalam artian sebagian besar template blog yang tersebar sudah bisa teratasi dengan cara ini.

5. Jika tahap diatas belum memberikan solusi gunakan tahap terakhirnya yaitu silahkan cari kode &lt;head&gt; atau kode &lt;!--<head>--&gt;&lt;head&gt; dan ganti atau kembalikan menjadi <head> dan begitu juga lakukan pergantian pada penutupnya yaitu &lt;/head&gt; atau &lt;!--</head>--&gt;&lt;/head&gt; ganti dengan </head>

Jangan lupa simpan atau save tema kamu tersebut dan silahkan dicoba lihat apakah masih error atau sudah kembali pulih normal, mungkin itu saja dulu tips yang bisa mimin bagikan pada kesempatan kali ini dengan Cara Mengatasi dan Memperbaiki Tombol Balas Komentar Blog Yang Tidak Bisa Membalas dan atas kunjungannya mimin ucapkan terima kasih dan silahkan dicoba.

Jumat, 19 April 2019

Cara Mengatasi dan Memperbaiki Duplikat Konten m=1 di Blogger

www.indoblog.me - Bismillah, pagi sahabat-sahabat semua dan pada kali ini mimin masih membahas seputar dunia blogging yang mungkin kamu butuhkan saat ini yang dimana yaitu menyangkut dengan Cara Mengatasi dan Memperbaiki Duplikat Konten m=1 di Blogger sebenarnya tips ini sudah pernah mimin bahas di beberapa tahun lalu tapi tidak ada salahnya mimin coba angkat kembali disini dengan source code html yang sedikit berbeda.

Secara kasar duplikat itu ada 2 atau double, tetapi karena yang kita bahas adalah menyangkut dengan konten maka yang admin bahas adalah duplikat artikel atau duplikate konten, memang duplikat konten di mesin pencarian atau mesin telusur terutama google momok yang sangat menakutkan bagi para webmasters soalnya akan memperburuk rangking suatu artikel atau halaman blog kita pada mesin pencari.

Lantas bagaimana Cara Mengatasi Duplikat Artikel di Blog dan Bagimana Memperbaiki Duplikate m=1 pada Blog kita dan untuk mengatasi semua itu sebenarnya banyak cara, tetapi saya hanya akan memberikan cara yang paling mudah saja.

Untuk mengatasi duplikat artikel di mesin pencari sebenarnya kalau kita menggunakan template template yang seo friendly seharusnya masalah tersebut tidak ada akan tetapi kadang kita lupa atau ada sesuatu pengaturan yang tak sengaja kita ubah sehingga terjadi beberapa duplikat artikel dimesin pencari.

Cara Mengatasi dan Memperbaiki Duplikat Konten m=1 di Blogger
CONTOH DUPLIKAT KONTEN DI MESIN PENCARI

1. Cara Pertama yaitu dengan menambahkan <link expr:href='data:blog.url' rel='canonical' /> setelah kode <head> hanya saja ini bisa mengatasi duplikat konten pada mesin pencari, sekarang mari kita buat asumsi blog kita dibuka pada hp android kemudian silahkan kamu share atau lihat pada adress bar hp kamu blog kamu tersebut jika ada ujungnya misal html?m=1 berarti ada embel-embelnya.

2. Nah kalau cara pertama hanya mengatasi duplikat versi mesin pencari kita akan mengatasi m=1 tersebut akan hilang ketika blog atau salah satu postingan kita di share di media sosial, atau bahkan kamu bisa mengujinya sendiri dan kode ini bisa mengatasi duplikat di berbagai media baik PC Desktop maupun HP atau Mobile, masih di halaman EDIT HTML template kamu cari kode </head> lalu masukan kode dibawah ini tepat diatas kode </head> tersebut.

<script type='text/javascript'>
var uri = window.location.toString();
if (uri.indexOf("%3D","%3D") > 0) {
  var clean_uri = uri.substring(0, uri.indexOf("%3D"));
    window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("%3D%3D","%3D%3D") > 0) {
  var clean_uri = uri.substring(0, uri.indexOf("%3D%3D"));
    window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("&amp;m=1","&amp;m=1") > 0) {
  var clean_uri = uri.substring(0, uri.indexOf("&amp;m=1"));
    window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("?m=1","?m=1") > 0) {
  var clean_uri = uri.substring(0, uri.indexOf("?m=1"));
    window.history.replaceState({}, document.title, clean_uri);
}
</script>


Artinya script tersebut akan meredirect jika ada user yang mengakses via html?m=1 baik disengaja maupun tidak disengaja, jangan lupa simpan pengaturan templatenya yah.

Ya udah kawanku itulah tips pada kesempatan kali ini dengan Cara Mengatasi dan Memperbaiki Duplikat Konten m=1 di Blogger semoga bermanfaat dan dapat membantu rekan-rekan semua dan atas kunjungannya mimin ucapkan terima kasih, silahkan langsung dicoba.

Cara Membuat Gambar di Semua Artikel Blog Menjadi Responsive

www.indoblog.me - Bagaimana Cara Membuat Gambar di Semua Artikel Blog Menjadi Responsive? Hay Blogger semuanya sebenarnya saya masih membahas seputar disqus hanya saja setelah saya menggunakan kolom komentar disqus justru loading blog menjadi berat dan yang lebih parah lagi semua gambar yang ada di artikel ketika pertama kali diload menjadi blank putih, kecuali kalau gambar tersebut diklik baru semuanya kelihatan dan sepertinya sayapun memutuskan untuk mengehentikan proyek tentang disqus dulu.

Nah bagi teman-teman semuanya yang ingin mengetahui prihal cara membuat gambar responsive di blogger atau mungkin ingin menjadikan gambar postingan responsive lantas bagaimana cara membuatnya agar gambar tersebut menjadi seo friendly, ternyata tutorial ini juga berhubungan dengan header responsive, dan bagi pengguna wordpress sudah saya bahas di website yang berbeda.

Sebenarnya saya masih terbilang kaku dengan platform blogger karena memang saya lebih fokus ke wordpress ketimbang menggunakan blogger, tetapi lama kelamaan mau gak mau saya juga harus lebih memperdalam bahasa html yang paling sering digunakan oleh platform blogger besutan google ini.

Cara Membuat Gambar di Semua Postingan Blog Menjadi Responsive

Nah tujuan utama pembahasan kali ini mungkin kamu pernah mengupload sebuah gambar yang ukurannya lebih besar dari pada ukuran postingan blog atau artikel blog maka untuk meminimalisir terjadi di sesuatu halaman postingan blog ada gambar yang tidak pas dengan salah satu postingan kita, bahkan kita tidak tahu ada dihalaman mana saja, maka tips ini akan membantu anda untuk membuat responsif semua gambar yang ada pada seluruh dan semua artikel postingan kamu.

Ya udah langsung saja berikut adalah ulasannya, langsung saja masuk ke blogger kamu lalu ke TEMA lalu klik EDIT HTML lalu silahkan cari kode ]]></b:skin> karena kita akan menambahkan css lalu simpan kode css dibawah ini sebelum ]]></b:skin>

.post-body img {
  max-width:100%;
  height:auto;
}


Dan sekarang lihat gambar-gambar yang besar yang lebarnya melebihi postingan kamu pasti akan berubah dan akan menyesuaikan dengan lebar pada psotingan kamu.

Tips ini sangat cocok sekali jika website kamu dan blog kamu dibuka via hp android karena semua gambarnya akan menyesuaikan dengan lebar hp android yang membuka website maupun blog kamu.

Sekian dulu gaes info dengan Cara Membuat Gambar di Semua Artikel Blog Menjadi Responsive semoga bermanfaat dan silahkan dicoba dan salam sukses.

Cara Mengaktifkan Moderasi Untuk Mengatasi Spam Komentar di Disqus

www.indoblog.me - Sebenarnya bagaimana cara meminilisir terjadinya komentar-komentar spam yang ada pada website kita maupun blog kita, yang dimana salah satunya adalah dengan Cara Mengaktifkan Moderasi Untuk Mengatasi Spam Komentar di Disqus yang dimana ini dikhususkan bagi kamu yang menggunakan komentar disqus pada weblognya.

Dan untuk mengaktifkan plugin atau fitur ini tidaklah sulit karena memang sudah disediakan di dasboard disqus kita masing-masing, untuk mengaktifkan fiture ini agar komentar komentar yang ada pada blog kita bisa kita filter apalagi jika komentar tersebut bebau porn*grafi dan sara tentu saja kamu bisa memfilternya terlebih dahulu sebelum dipublikasikan.

Cara Mengatasi Spam Komentar Disqus Di Blogspot dan Wordpress

Tanpa basa basi lagi bagi kamu yang ingin mengaktifkan fitur moderasi langsung saja masuk pada admin disqus masing masing jika bingung dimana letaknya bisa kamu lewat link dibawah ini

https://SHORTNAME_DISQUS.disqus.com/admin/settings/community/

Silahkan ganti SHORTNAME_DISQUS dengan shortname punya kamu lalu kamu buka pada browser kamu, maka secara otomatis kamu akan masuk pada halaman seperti pada gambar dibawah ini

Cara Setting Komentar Disqus Agar Tidak Banyak Spam

Dan silahkan perhatikan pada gambar diatas saja dan untuk mengaktifkan moderasi silahkan pada bagian Pre-Moderasi dari None silahkan ganti ke ALL, Cukup mudah dan simple bukan?

Mungkin kamu ingin membuat komentar disqus seperti yang ada diblog ini agar bisa show hide panduannya bisa baca di halaman postingan Cara Membuat Komentar Disqus Show Hide Dengan Event On Click kemudian kamu juga mungkin membutuhkan tutorial komentar disqus agar bisa permanen panduannya ada di postingan Cara Membuat Komentar Disqus Permanen di Blog

Ya sudah hanya itu dulu bosquee informasi yang bisa mimin sampaikan pada kesempatan yang cerah kali ini dengan Cara Mengaktifkan Moderasi Untuk Mengatasi Spam Komentar di Disqus semoga masih bermanfaat dan tentunya masih bisa kamu gunakan untuk menghandle komentar komentar spam di blog kamu dan terima kasih.

Cara Membuat dan Mempilkan Komentar Disqus Show Hide di Halaman Postingan

www.indoblog.me - Bagaimana sih Cara Membuat dan Mempilkan Komentar Disqus Show Hide di Halaman Postingan atau halaman artikel blog kita? mungkin kamu sedang atau lagi membutuhkannya bagaimana agar kolom komentar disqus tersebut agar bisa di show hide seperti yang ada di website ini dengan tulisan "Load Comments" silahkan bisa diperhatikan saja.

Nah mudah-mudahan kamu sudah paham maksudnya sekarang, jadi tombol yang terlihat ketika halaman artikel kita di buka maka hanya akan terlihat tombol "Load Comments" saja tetapi setelah di on click atau di tekan maka tombol tersebut akan hilang, kemudian apabila kamu ingin memasang komentar diskus secara permanen bisa baca panduannya disini Cara Membuat Komentar Disqus Secara Permanen di Blog.

Lantas apakah ada kelebihannya, untuk kelebihannya adalah hanya untuk mepercepat loading blog saja ketika halaman artikel tersebut dibuka, jadi bagaimana apakah kamu ingin mencoba menerapkannya pada blog kesayangan kamu, kalau mau mencobanya langsung simak saja berikut ini.

Cara Membuat dan Mempilkan Komentar Disqus Show Hide di Halaman Postingan

Sebelum memulai tutorial ini pastikan di tema atau template kamu sudah menginstal fontawesome dan silahkan hapus dulu semua kode disqus yang ada diblog kamu tersebut, karena akan diganti dengan yang baru ini.

1. Pada tahap pertama tentunya silahkan masuk dulu ke blogger lalu EDIT TEMA kemudian silahkan cari kode <b:includable id='comments' var='post'> sampai penutupnya </b:includable> lalu silahkan tambahkan kode dibawah ini setelah kode tersebut, untuk  contohnya bisa lihat gambar dibawah.

<b:includable id='disqus-comment' var='post'> <script type='text/javascript'>
var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;
 if (!disqus_blogger_current_url.length) {
 disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
 }
var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
 var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
</script> </b:includable>

Cara Menyembunyikan Kotak Komentar Bawaan Blogger

2. Lalu kemudian cari kode </body> lalu silahkan copy kode yang ada dibawah ini sebelum kode </body> bisa kamu lihat contohnya pada gambar, SHORTNAME_DISQUS ganti dengan shortname disqus punya kamu.

<script type='text/javascript'>
var disqus_shortname = &quot;SHORTNAME_DISQUS&quot;;
!function(){var e=document.createElement(&quot;script&quot;);e.type=&quot;text/javascript&quot;,e.async=!0,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_index.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
</script> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script type='text/javascript'>
!function(){var e=document.createElement(&quot;script&quot;);e.type=&quot;text/javascript&quot;,e.async=!0,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_item.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
//<![CDATA[
function load_Comments(){var e=document.getElementById("disqusshow");e.style.display="none";var t="arlinadesign";!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="http://"+t+".disqus.com/embed.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}()}
//]]>
</script> </b:if>

Cara Menyembunyikan Kotak Komentar Bawaan Blogger

3. Kemudian untuk selanjutnya adalah silahkan cari kode ]]></b:skin> lalu masukan kode yang ada dibawah ini tepat diatas kode ]]></b:skin> untuk contohnya bisa kamu lihat digambar

/* Disqus Comments */
#comments{display:none;}
.post-comment-link {visibility:hidden;}
#disqus_thread {background:#fff;margin:10px 0 0 0;padding:20px;box-shadow:inset 0 0 1px 0 #aaa;}
#disqusshow{position:relative;overflow:hidden;display:block;padding:15px 20px;text-align:left;color:#222;font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;margin:10px 0;background:#fff;border:1px solid #999;transition:all .3s}
#disqusshow:after{display:inline-block;content:"\f086";font-family:fontAwesome;font-style:normal;font-weight:normal;font-size:18px;color:#e85e54;border-left:1px solid #999;top:0;right:0;padding:12px 20px;position:absolute}
#disqusshow:hover,#disqusshow:active{color:#f8695f}e} #disqusshow:hover,#disqusshow:active{color:#f8695f}

Cara Hapus Komentar Disqus Pada Template

4. Kemudian selanjutnya silahkan sobat cari kode <div class='comments' id='comments'> lalu tambahkan kode yang ada dibawah ini tepat diatas kode <div class='comments' id='comments'>

<div id='disqusshow' onclick='load_Comments()'>Load Comments</div>
<div id='disqus_thread'/>

Memuat Komentar Disqus dengan Onclick Event

5. Kemudian cari kode <b:skin><![CDATA[ lalu tambahkan kode yang ada dibawah ini tepat diatas kode <b:skin><![CDATA[ tersebut untuk contohnya bisa kamu lihat gambar saja dibawah, dan jangan lupa simpan dan lihat hasilnya

<a expr:href='data:post.url + &quot;#disqus_thread&quot;' title='Comments Count'> Comments</a>

Menampilkan Komentar Disqus di Halaman Statis

Ok gaess dicukupkan terlebih dahulu postingan kali ini dengan Cara Membuat dan Mempilkan Komentar Disqus Show Hide di Halaman Artikel semoga bermanfaat dan membantu dan silahkan langsung dipraktekan saja , Wassalam.

Cara Import Komentar Blog Ke Komentar Disqus Dengan Mudah

www.indoblog.me - Mungkin anda ada masalah ketika pertama kali memasang disqus pada website maupun pada blog anda yang diantaranya bagaimana Cara Import Komentar Blog Ke Komentar Disqus , sebenarnya untuk memindahkan komentar blog yang ada pada blogspot kamu, kamu tidak perlu bersusah susah paya soalnya sebenarnya sangat mudah sekali.

Akan tetapi pada dasarnya memang kalau namanya belum tahu kan tetep susah bener gak, ya udah biar gak lama lama lagi berikut adalah cara fix memindahkan komentar dari blog ke komentar disqus secara otomatis yang dimana dalam artian bahwa komentar yang sebelumnya berada di blogspot kamu akan dipindahkan ke komentar disqus.

Ya udah bagi kamu yang ingin memindahkan komentar dari bawaan komentar blogger ke komentar disqus langsung saja masuk ke link ini https://SHOTNAME_DISQUS.disqus.com/admin/discussions/import/platform/blogger/ atau anda masuk ke menu admin lalu pilih bagian discussion lalu pilih platform blogger maka akan muncul seperti pada gambar dibawah ini

Jangan lupa SHORTNAME_DISQUS ganti dulu dengan shotname disqus punya kamu.

Cara membuat akun disqus terbaru 2019

Lalu langsung saja klik "import comments from blogger" lalu kemudian pilih blog mana yang ingin kamu import komentarnya ke komentar disqus, dan pastikan saja sesuai antara akun disqus dengan blognya saja.

Cara Mudah membuat akun disqus terbaru 2019


Ya udah cukup simple bukan tips cara bagaimana Cara Import Komentar Blog Ke Komentar Disqus semoga masih bisa bermanfaat untuk rekan-rekan semuanya dan atas kunjungannya admin cara apa saja ucapkan terima kasih dan semoga membantu.

Cara Menghapus Duplikat Kolom Disqus Pada Komentar Blog

www.indoblog.me - Mungkin hal ini jarang terjadi tetapi tidak apa-apa admin tetap akan coba share yang mungkin suatu waktu kamu mengalami masalah ini dan berikut adalah Cara Menghapus Duplikat Kolom Disqus Pada Komentar Blog kalaupun kasus ini dan masalah ini sebenarnya jarang terjadi tetapi tidak apa-apa admin akan coba membahasnya.

Bagi kamu yang menggunakan komentar disqus pada blognya mungkin sering mengalami masalah apalagi bisa terbilang baru membuatnya, lantas bagaimana cara kita mengatasi masalah tersebut, dan apabila kamu mengalami masalah atau kesusahan mencari shortname disqus punya kamu, kamu bisa lihat pada artikel Cara Mengetahui Shortname Disqus

Cara Pasang Disqus di Blogger Beserta Shortname Disqus

Dan apabila kamu ingin memasang komentar disqus secara permanen pada blognya maupun pada websitenya silahkan bisa baca baca panduannya yang sudah admin bagikan pada halaman Cara Memasang Komentar Disqus di Blog Secara Permanen

Nah untuk permasalahan kali ini hanyalah menghapus double komentar pada disqus dalam artian bahwa komentar diskus jadi ada 2 kolom mungkin itu maksudnya.

Lagkah utama langsung saja masuk ke dasboard blogger kamu lalu langsung ke EDIT TEMA dan cari kode disqus_shortname untuk mempercepat pencarian gunakan keyboar CTRL+F

Cara Memasang dan Membuat Komentar Disqus Keren

Silahkan hapus dari <div class='comments' id='comments'> sampai kode </div sebelum </b:includable> pada source area tersebut maka setelah dihapus hasilnya akan seperti pada gambar dibawah ini, lalu jangan lupa save tema kamu tersebut.

Cara Memasang dan Membuat Komentar Disqus Keren

Ok itulah tutorial dan corat-coret pada kali ini tentang Cara Menghapus Duplikat Kolom Disqus Pada Komentar Blog semoga masih bermanfaat untuk kamu semuanya para blogger dan atas kunjungannya saya ucapkan terima kasih dan silahkan dicoba.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

www.indoblog.me - Langsung saja ke pokok pembahasannya yaitu bagaimana Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus yang dimana kadang kita lupa dengan shortname disqus kita atau bahkan kita belum tahu sama sekali bagaimana mengetahui shortname disqus milik kita maka dari itu pada postingan kali ini mimin coba angkat 2 topik yaitu cara singkat instal disqus yang mungkin pada blogspot kamu belum muncul dan atau mungkin kamu belum tahu shortname disqus kamu.

Lantas apa itu disqus? disqus adalah layanan diskusi serta sekaligus layanan komentar yang saat ini banyak digunakan diberbagai macam website yang ada, dan selain itu yaitu memiliki tujuan untuk memudahkan antar pengunjung sebuah website untuk saling berinteraksi dengan pengunjung yang lainnya.

Tujuan utama menggunakan disqus adalah untuk mengurangi bebas server jika dalam 1 waktu dibuka oleh ratusan bahkan ribuan orang karena komentar-komentar kamu ditaruh di server pihak ketiga sehingga tidak akan memberatkan loading website kamu apalagi jika kamu memasangnya dengan disqus on scroll.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

Versi memasang disqus ini bukanlah versi permanen melainkan versi yang biasa saja kalau kamu mau memasang yang permanen bisa dilihat pada postingan Cara Memasang Komentar Disqus Secara Permanen di Blogspot

1. Jika kamu belum memiliki akun diskus silahkan langsung saja daftar dulu di alamat https://disqus.com/profile/signup/ silahkan login dengan akun twitter, facebook atau google plus kamu tetapi tetapi yang terbaik adalah daftar secara manual dengan email saja.

2. Kemudian jika kamu menggunakan wordpress atau jenis engine website yang lainnya bahkan dengan blogger sekalipun bisa menggunakan cara ini silahkan langsung klik I want to install Disqus on my site. pada select a plan pilih yang basis saja.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

3. Kemudian untuk langkah selanjutnya silahkan langsung saja isikan nama website kamu dan pilih juga jenis kategori yang digunakan website kamu tersebut.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus
4. Karena saya instalnya diblogger jadi untuk installnya jadi pilih saja platform blogger, kemudian silahkan klik seperti nomor point 1 dibawah, itu juga sekaligus shortname disqus anda, atau untuk shortname disqus kamu bisa nanti lihat pada gambar selanjutnya.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

5. Kemudian jika kamu memiliki banyak blog silahkan pilih salah satu blog kamu yang ingin dipasangi komentar disqus tersebut lalu langsung tambahkan widget dengan menekan tombol menambahkan widget

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

6. Kalau sudah jadi kira-kira akan tampil dan akan nampak seperti pada gambar dibawah ini, tetapi jangan lupa untuk memverifikasi dulu akun disqus milik kamu tersebut biar aktif maksimal.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

7. Seperti janji saya sekarang lantas bagaimana cara mengetahui akun disqus atau shortname disqus milik kita caranya sangat mudah sekali langsung saja masuk ke admin disqus kamu di https://disqus.com/admin/ kemudian pilih situs kamu yang ingin dicek shortnamenya jika kamu memiliki banyak situs atau website pilih yang akan dicek shortnamenya saja.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

8. Perhatikan pada gambar dibawah ini dan itulah shortname disqus milik kamu misal indoblog-me itulah shortname disqusnya yang perlu kamu pasang pada blog maupun website kamu.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus

Ok hanya itu dulu apa yang bisa saya sampaikan kali ini dengan Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus Terbaru semoga bermanfaat dan atas kunjungannya saya ucapkan terima kasih dan wassalam dan sebentar lagi kita akan melaksanakan puasa ramadhan.

Kamis, 18 April 2019

Cara Memasang Komentar Disqus Secara Permanen di Blogspot

www.indoblog.me - Mungkin kamu pernah melihat jenis komentar disqus atau bahkan kamu ingin mencoba memasangnya pada platform blogger kamu atau blogspot kamu atau bahkan blog kamu, maka kebetulan disini mimin juga mau ngebahas soal tersebut dan berikut adalah bagaimana Cara Memasang Komentar Disqus Secara Permanen di Blogspot dan Blogger.com dan bagi kamu yang ingin membuatnya atau pasang komentar disqus tersebut langsung saja simak tipsnya dibawah ini.

Lantas apa saja kekurangan dan kelebihan dari komentar disqus tersebut dengan komentar bawaan dari blogger itu sendiri, untuk kelebihan dan kekurangnnya sebenarnya tergantung dari pengelola atau admin blog dan website itu sendiri.

Mungkin pemasangan komentar disqus bukan lagi merupakan hal yang baru lagi akan tetapi seperti admin juga komentar disqus baru dipasang beberapa hari ini karena selama bertahun tahun memang belum pernah mencoba memasangnya jadi dengan kelebihannyapun admin belum tahu pasti apa saja.

Cara Pasang Disqus di Blogger Dan Mengetahui Shortname Disqus 2019

Dan bagi kamu yang ingin komentar disqusnya biar tidak ada iklan referensi dari disqusnya atau agar bisa load on scroll dan bagaimana membaca shortname dari disqusnya, bagi kamu yang ini pasang disqus tanpa permanen sekaligus buat liat shortnamenya bisa dilihat pada postingan Cara Mengetahui Shortname Akun Disqus Milik Kita nanti yang lainnya akan mimin bahas tetapi sekarang kita akan pasang dulu script disqus, dan sebagai catatan bahwa tutorial ini akan menghapus semua source komentar bawaan blogger tujuannya agar loading blog semakin ringan.

Berikut adalah tips trik Cara Pasang Komentar Disqus di Blogger silahkan disimak. dan pastikan kamu sudah membackup tema atau template kamu sebelum memulai panduan ini.

1. Silahkan masuk ke dasboard blogger kalau kamu pengguna blog kalau kamu pengguna wordpress tinggal disesuaikan saja kemudian silahkan masuk ke bagian TEMA lalu EDIT TEMA lalu cari kode #Comments atau .Comments gunakan CTRL+F saja untuk mempercepat pencarian lalu kemudian silahkan kamu hapus semua kode tersebut pastikan yang dihapus bukan yang ada didalam sebuah source code saja contohnya yang dihapus yang dipinggir pinggir saja.

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

2. Selanjutnya lalu cari <b:includable id='comment-form' lalu hapus mulai dari <div class ='comment-form' sampai dengan </div> yang pas atasnya <b:/includable> contohnya bisa kamu lihat pada gambar dibawah ini.

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

3. Lalu maka setelah dihapus akan menjadi seperti ini <b:includable id='comment-form' var='pos' <b:/includable> lalu tambahkan tanda garis miring pada <b:includable id='comment-form' maka hasilnya akan menjadi <b:includable id='comment-form/' atau kode lengkapnya menjadi <b:includable id='comment-form/' var='pos' <b:/includable> dan lakukan untuk yang lainnya jadi seperti cara diatas

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

Kode lengkapnya yang perlu kamu lakukan seperti cara diatas adalah: comment-form, commentDeleteIcon, comment_count_picker, comment-picker, threaded-comment-form, threaded_comment_js, threaded_comment, ShareButtons semua kode tersebut tepat berada didepan <b:includable id='

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

4. Kemudian selanjutnya silahkan cari kode <b:includable id='comments' var='post'> kalau sudah ketemu jangan lupa ganti semua kode <b:includable id='comments' var='post'> sampai penutupnya yaitu </b:includable>

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

Lalu selanjutnya ganti kode diatas tersebut dengan kode yang ada dibawah ini

<b:includable id='comments' var='post'>
  <div class='comments' id='comments'>
<script type='text/javascript'>
                var disqus_shortname = &quot;SHORTNAME DISQUS&quot;;
                var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;
                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
                }
                var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
                var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
             (function() {
                        var bloggerjs = document.createElement(&quot;script&quot;);
                        bloggerjs.type = &quot;text/javascript&quot;;
                        bloggerjs.async = true;
                        bloggerjs.src = &quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_item.js&quot;;
                        (document.getElementsByTagName(&quot;head&quot;)[0] || document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(bloggerjs);
                    })();
                (function() {
                    var bloggerjs = document.createElement(&quot;script&quot;);
                    bloggerjs.type = &quot;text/javascript&quot;;
                    bloggerjs.async = true;
                    bloggerjs.src = &quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_index.js&quot;;
                    (document.getElementsByTagName(&quot;head&quot;)[0] || document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(bloggerjs);
                })();
    var disqus_shortname = &#39;SHORTNAME DISQUS&#39;;
    (function () {
        var s = document.createElement(&#39;script&#39;); s.async = true;
        s.type = &#39;text/javascript&#39;;
        s.src = &#39;//&#39; + disqus_shortname + &#39;.disqus.com/count.js&#39;;
        (document.getElementsByTagName(&#39;HEAD&#39;)[0] || document.getElementsByTagName(&#39;BODY&#39;)[0]).appendChild(s);
    }());
                </script>
  </div>
</b:includable>

Kemudian jangan lupa SHORTNAME DISQUS ganti dengan shortname disqus punya kamu, dan silahkan simpan templatenya dan apakah sudah tampil sempurna, dan apabila pada LAMAN muncul juga disqusnya kamu bisa tambahkan kode ini <b:if cond='data:blog.pageType == &quot;item&quot;'> tepat dibawah kode <div class='comments' id='comments'>

Cara Membuat dan Mengembalikan Komentar Disqus Permanen Di Blogspot dan Blogger

Kemudian jangan lupa kode penutupnya juga yaitu </b:if> pasang diatas </div>
</b:includable> kalau dibiarkanpun tidak apa tergantung kebutuhan dan keperluan saja.

Sekiranya itu saja dulu apa yang bisa mimin sampaikan pada kesempatan kali ini dengan Cara Memasang Komentar Disqus Secara Permanen di Blogspot semoga bermanfaat dan membantu dan terima kasih silahkan langsung dicoba.

Rabu, 17 April 2019

Cara Membuat Text Area Keren Pada Postingan Di Blogger

www.indoblog.me - Mungkin kamu seorang blogger yang lagi nyasar ke artikel ini yang dimana mungkin juga lagi membutuhkan tips tri Cara Membuat Text Area Keren Pada Postingan Di Blogger atau blogspot kamu maka anda akan saya suguhkan berbagai macam teks area keren yang bisa kamu lihat dibawah ini.

Penggunaan teks area sebenarnya banyak manfaatnya yang salah satunya adalah memudahkan kita ketika mau berbagi script sehingga akan semakin memperindah dan mempercantik tampilan halaman postingan kamu tersebut atau bisa jadi akan memudahkan pengunjung kamu untuk menyeleksi atau mengcopy kode kode tersebut.

Mungkin juga anda sudah tahu menggunakan cara ini, akan tetapi tidak ada salahnya kamu coba jika sewaktu-waktu lupa lagi, soalnya admin juga sering lupa dalam hal tersebut sehingga banyak kode kode blog yang sulit ditalar sehingga perlu admin simpan di blog sekaligus dokumenTasi pribadi.

Cara Membuat Text Area Keren Pada Postingan Di Blogger

Berikut adalah beberapa contoh teks area yang bisa kamu manfaatkan untuk mempercantik halaman postingan kamu ketika kamu berbagi css atau script dan yang sejenisnya, dan langsung saja simak kodenya dibawah ini.

CONTOH 1:

<div style="overflow: auto; width: auto; height: auto;
background-color: #4286f4; text-align: justify; padding: 5px;
border: 3px solid #1b2028;"><span style="color: White;">TULISAN ATAU TEKS KAMU DISINI</span></div>

HASILNYA:
TULISAN ATAU TEKS KAMU DISINI

CONTOH 2:
<div style="overflow: auto; width: auto; height: auto;
background-color: #13a023; text-align: justify; padding: 5px;
border: 3px solid #1b2028;"><span style="color: White;">TULISAN ATAU TEKS KAMU DISINI</span></div>

HASILNYA:
TULISAN ATAU TEKS KAMU DISINI

CONTOH 3:
<div style="overflow: auto; width: auto; height: auto;
background-color: #e2c41b; text-align: justify; padding: 5px;
border: 3px solid #1b2028;"><span style="color: White;">TULISAN ATAU TEKS KAMU DISINI</span></div>

HASILNYA:
TULISAN ATAU TEKS KAMU DISINI

CONTOH 4:
<div style="overflow: auto; width: auto; height: auto;
background-color: #1be2d2; text-align: justify; padding: 5px;
border: 3px solid #1b2028;"><span style="color: White;">TULISAN ATAU TEKS KAMU DISINI</span></div>

HASILNYA:
TULISAN ATAU TEKS KAMU DISINI

CONTOH 5:
<div style="overflow: auto; width: auto; height: auto;
background-color: #e21b57; text-align: justify; padding: 5px;
border: 3px solid #1b2028;"><span style="color: White;">TULISAN ATAU TEKS KAMU DISINI</span></div>

HASILNYA:
TULISAN ATAU TEKS KAMU DISINI

Nah itulah kira-kira contohnya buat kamu pelajari dan selanjutnya silahkan tinggal anda gunakan pada postingan kamu dan cara menggunakannyapun sangatlah mudah sekali.

Oke gaess hanya itu dulu apa yang bisa admin sampaikan pada kesempatan kali ini tentang Cara Membuat Text Area Keren Pada Postingan Di Blogger semoga bermanfaat dan membantu dan sebenarnya tulisan ini pernah dimuat di tahun-tahun sebelumnya tetapi tidak apa-apa saya ulas kembali ditahun ini untuk mempermudah mencarinya saja dan terima kasih.