Calon Bloggers: tutorial
Tampilkan postingan dengan label tutorial. Tampilkan semua postingan
Tampilkan postingan dengan label tutorial. Tampilkan semua postingan

Kamis, 27 Mei 2021

Cara Menghilangkan Kode ? m=1 atau ? m=0 di blogspot

Perbedaan Kode m=1 m=0 serta Fungsinya

Kode m=1, artinya blog anda dikunjungi dari mobile device, smartphone atau Hp, sedangkan kalau kodenya m=0, itu artinya blog anda dikunjungi dari desktop (komputer atau laptop).
Sedangkan kode m=0 dianggap ada kalau blog dikunjungi dari komputer ,kode ini beneran memang ada, tapi tidak muncul, tidak terlihat di address bar pada layar komputer anda.

Cara Menghilangkan Kode ? m=1 atau ? m=0

Silahkan buka akun Blogger Anda.
Lalu pergi ke bagian Tema > Edit Html. Kemudian salin dan tempel kode di bawah ini tepat di bawah </body>

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

Simpan Tema dan silahkan Anda coba akses url blog maka kode akhiran sekarang tidak ada lagi pada url blog Anda.

Kode diatas bisa dibilang berfungsi untuk menghilangkan atau mematikan fungsi kode m=1, sehingga dialihkan ke m=0  alias kunjungan versi desktop.

Karena kode diatas adalah JavaScript yang bisa memperberat atau memperlambat loading blog anda.

Melalui Google Webmaster Tool 

  • Google Webmaster Tool > Crawl > URL Parameters
  • Pilih pada Configure URL parameters, kemudian klik Add Parameter Apabila tidak ada, pasti ada tulisan parameter "m", klik edit saja kemudian simpan konfigurasi yang telah anda lakukan barusan.
  • Silakan uji coba di blog Anda masing-masing.

Rel='Canonical'

Kode ini bertujuan mengatasi duplikat konten pada umumnya, kode ini sudah terpasang di template blogger 2018, baik gratis maupun premium.

Cara pasangnya ikuti langkah-langkah berikut ini :

  • Cari kede </head> atau &lt;head&gt;
  • Letakkan kode dibawah ini, tepat dibawah kode </head> atau &lt;head&gt;
<link expr:href='data:blog.url' rel='canonical'/>

Memanfaatkan Custom Robot.Txt.
  • Setting > Search Preferences.
  • Aktifkan atau klik Enable fitur dan layanan Custom Robot.txt.
  • Copas kode dibawah ini, pada kolom Custom Robot tersebut :
User-agent: Mediapartners-Google Disallow: User-agent: * Disallow: /search Disallow: /?m=0 Disallow: /?m=1 Allow: / https://calonbloggerr.blogspot.com/feeds/posts/default?orderby=UPDATED

Catatan : Ganti URL diatas dengan URL blog anda.

Agar bisa mempermudah untuk menghilangkan code tersebut anda bisa lakukan melalui tata letak dengan cara d bawah ini.

1. Masuk ke akun Blogger Anda.
2. Klik tata letak > Tambahan gagdet > pilih Html JavaScript.
3. Copy code di bawah ini dan pastekan lalu simpan.

<script type='text/javascript'> 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); } 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>
Sekian ulasan mengenai cara menghilangkan code ? m=1 atau ? m=0 pada Bloggers , selamat mencoba dan jangan sungkan untuk berkomentar . Terimakasih,Semoga bermanfaat !!!

Minggu, 23 Mei 2021

Cara Membuat tombol Night Mode di Blogger

Baru baru ini banyak sekali blog yang menggunakan fitur night mode, fitur blog yang satu ini banyak di minati para blogger hanya untuk memperindah tampilan dan memberikan sensasi yang berbeda pada blognya, sehingga para pengunjung betah dan nyaman saat membacanya.
Cara pemasangannya pun tidaklah terlalu sulit asalkan anda bisa teliti cara meletakkan kodenya. Jika anda yang gemar edit html,Tidak salahnya kan mencoba 😁 ...

Silahkan bagi anda yang tertarik dan penasaran untuk mengaktifkan fitur night mode ini, anda bisa mengikuti cara berikut ini :

  • Cara Membuat Night Mode di Blogger

  1. Masuk ke Blogger akun anda
  2. Buka Menu Tema.
  3. Lalu klik tombol Edit HTML.
  4. Cari kode  ]]></b:skin>
  5. Jika sudah ketemu letakkan kode di bawah ini tepat di atas kode  ]]></b:skin>

Gambar 1

Lihat seperti gambar 1 di atas

* Button Dark Mode */ .modedark{display:inline-block;float: right;margin-top: 3px;position:absolute;right:45px;top: 0;z-index:999;} .modedark svg{ width:24px; height:24px; vertical-align: -5px; background-repeat: no-repeat !important; content: ''; } .modedark svg path{ fill:#fff; } .modedark .check:checked ~ .NavMenu{ opacity:1; visibility:visible; top:45px; min-width:200px; transition:all .3s ease; z-index:2; } .iconmode { cursor: pointer; display: block; padding: 8px; background-position: center; transition: all .5s linear; } .iconmode:hover{ border-radius: 100px; background: rgba(0,0,0,.2) radial-gradient(circle, transparent 2%, rgba(0,0,0,.2) 2%) center/15000%; } .check { display: none; } .modedark .iconmode .openmode{ display:block; } .modedark .iconmode .closemode{ display:none; } .modedark .check:checked ~ .iconmode .openmode{ display:none; } .modedark .check:checked ~ .iconmode .closemode{ display:block; } /* Warna Dark Mode */ /* Warna Night Mode */ .Night #wrapper {background: #292e38;} .Night #HTML3 {background:#1d2129;} .Night #footer-widget-container {background:#1d2129;} .Night .share-this-pleaseeeee {background:#292e38;} .Night .related-post h4{background:#292e38;} .Night #label-info-th {background:#1d2129;} .Night body {background:#1d2129;} .Night .post-body {color:#cccccc} .Night #baca-juga h2 {color:#cccccc;background:#1d2129} .Night .label-info-th a {color:#cccccc;background:#3d4658} .Night li.recent-posts a{color:#cccccc} .Night .recent-posts-title h2{color:#cccccc} .Night .Recent_Post_Mas_Tamvan .recent-post-mas-tamvan span.mastamvan_title a{color:#cccccc} .Night span.mastamvan_title a .Recent_Post_Mas_Tamvan .recent-post-mas-tamvan {color:#cccccc;background:#1d2129} .Night .Recent_Post_Mas_Tamvan .recent-post-mas-tamvan .widget-content {color:#cccccc;background:#1d2129} .Night .post-info {color:#cccccc} .Night {background:#1d2129;} .Night h2.post-title a {color:#9e9e9e;} .Night h2.post-title a:hover {color:#f17f43} .Night .post-title {color:#1e90ff} .Night ul.nav-social {color:#1d2129} .Night .post-snippet {color:#cccccc} .Night #ignielNewsletter {background:#292e38;} .Night #Label1{background:#292e38;} .Night .post{background:#292e38;border-bottom-color: #252a33;} .Night .PopularPosts h2{background:#343944;} .Night .latest-post-title h2{background:#292e38;border-bottom-color: #313640;} .Night .newspaptext{color:#9e9e9e} .Night .PopularPosts h2 span{color:#9e9e9e} .Night .list-label-widget-content ul li {border-bottom-color: #313640;} .Night .img-thumbnail img {background: #252931 linear-gradient(to right, rgba(255, 255, 255, 0) 5%, rgb(49, 54, 64) 20%, rgba(255, 255, 255, 0) 30%);background-size: 800px 104px;} .Night #ignielNewsletter .medsos__ {border-top-color: #313640;} .Night #footer-container{background:#12161f;} .Night #footer-navmenu{background:#171b25;} .Night .sidebar h2 {color:#b7b7b7;border-bottom-color: #313640;} .Night .sidebar-sticky h2 {color:#b7b7b7;border-bottom-color: #313640;} .Night .latest-post-title h2 {color:#b7b7b7;border-bottom-color: #313640;} .Night .above-post-widget h2 {color:#b7b7b7;border-bottom-color: #313640;} .Night .comments h3 {color:#b7b7b7;border-bottom-color: #313640;} .Night .breadcrumbs {color:#b7b7b7;border-bottom-color: #313640;} .Night .btnsocialshare {background:#383c44;} .Night .label-line::before{background: #1d2129;} .Night .label-line-c::before {background: #333740;} .Night a.showcontent:hover {background: #373a42;} .Night a.showcontent{background: #292e38} .Night #ignielNewsletter input{background: #272b33;border-color:#2b303a;} .Night .comments .comments-content .comment-content {color:#ffffff} .Night div#Label1 h2 {border-bottom: 1px solid #272b33;background: #343944;} .Night .related-post-style-3 .related-post-item-title {color: #bbb;} .Night #baca-juga ul {border: 2px solid #333740;} .Night #baca-juga h2 {border: 2px solid #292e38;} .Night #comments a.hiddencontent {background: #424854;} .Night .comments .comments-content .comment-thread ol {background: #292e38;} .Night .comments .comments-content .inline-thread {background #292e38;}

  • Untuk dark mode bintang pasang tepat di atas kode ]]></b:skin>


/* Dark Mode Bintang  */
.section-center{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    display: none;
    overflow: hidden;
    z-index: 5;
 pointer-events: none;
    box-shadow: 0 0 50px 5px rgba(255,148,0,.1);
    transform: translate(-50%, -50%);
}
.section-center {
    -webkit-transition: all 500ms linear;
    transition: all 500ms linear;
}
.shooting-star {
 z-index: 2;
 width: 1px;
 height: 50px;
 border-bottom-left-radius: 50%;
 border-bottom-right-radius: 50%;
 position: absolute;
 top: 0;
 left: -70px;
 background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white);
 animation: animShootingStar 6s linear infinite;
 -webkit-transition: all 2000ms linear;
 transition: all 2000ms linear; 
}
.shooting-star-2 {
 z-index: 2;
 width: 1px;
 height: 50px;
 border-bottom-left-radius: 50%;
 border-bottom-right-radius: 50%;
 position: absolute;
 top: 0;
 left: 200px;
 background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white);
 animation: animShootingStar-2 9s linear infinite;
 -webkit-transition: all 2000ms linear;
 transition: all 2000ms linear; 
}
.star {
 z-index: 2;
 position: absolute;
 top: 185px;
 left: 25px;
 background-image: url('https://ivang-design.com//svg-load/air/star.png');
 background-size: 15px 15px;
 width: 15px;
 height: 15px;
 opacity: 0.4;
 animation: starShine 3.5s linear infinite;
 -webkit-transition: all 1200ms linear;
 transition: all 1200ms linear; 
}
.star.snd {
 top: 100px;
 left: 310px;
 animation-delay: 1s;
}
.star.trd {
 top: 130px;
 left: 100px;
 animation-delay: 1.4s;
}
.star.fth {
 top: 190px;
 left: 200px;
 animation-delay: 1.8s;
}
.star.fith {
 top: 85px;
 left: 1080px;
 animation-delay: 2.2s;
}

@keyframes animShootingStar {
 from {
  transform: translateY(0px) translateX(0px) rotate(-45deg);
  opacity: 1;
  height: 5px;
 }
 to {
  transform: translateY(1280px) translateX(1280px) rotate(-45deg);
  opacity: 1;
  height: 800px;
 }
}
@keyframes animShootingStar-2 {
 from {
  transform: translateY(0px) translateX(0px) rotate(-45deg);
  opacity: 1;
  height: 5px;
 }
 to {
  transform: translateY(1920px) translateX(1920px) rotate(-45deg);
  opacity: 1;
  height: 800px;
 }
}

@keyframes starShine {
 0% {
  transform: scale(0.3) rotate(0deg);
  opacity: 0.4;
 }
 25% {
  transform: scale(1) rotate(360deg);
  opacity: 1;
 }
 50% {
  transform: scale(0.3) rotate(720deg);
  opacity: 0.4;
 }
 100% {
  transform: scale(0.3) rotate(0deg);
  opacity: 0.4;
 }
}

  • Selanjutnya silahkan cari kode </head> dan letakan kode di bawah ini tepat di atas kode </head>
Gambar 2

Lihat seperti gambar 2  di atas

<div class='modedark'>
<input class='check' id='modedark' title='Mode Dark' type='checkbox'/>
<label class='iconmode' for='modedark'>
<svg class='openmode' viewBox='0 0 24 24'><path d='M12,18C11.11,18 10.26,17.8 9.5,17.45C11.56,16.5 13,14.42 13,12C13,9.58 11.56,7.5 9.5,6.55C10.26,6.2 11.11,6 12,6A6,6 0 0,1 18,12A6,6 0 0,1 12,18M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69Z'/></svg>
<svg class='closemode' viewBox='0 0 24 24'><path d='M14.3,16L13.6,14H10.4L9.7,16H7.8L11,7H13L16.2,16H14.3M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69M10.85,12.65H13.15L12,9L10.85,12.65Z'/></svg>
</label>
</div>

  • Untuk tahap berikutnya sekarang tinggal anda pasang scrips JS di bawah ini dan letakan tepat di atas kode </body>
lihat seperti gambar dibawah ini

Gambar 3
Lihat gambar3 di atas

<script type='text/javascript'>//<![CDATA[/* Dark Mode */$(document).ready(function(){$("body").toggleClass(localStorage.toggled),$("#modedark").on("click",function(){"Night"!=localStorage.toggled?($("body").toggleClass("Night",!0),localStorage.toggled="Night",$(".section-center").css("display","block")):($("body").toggleClass("Night",!1),localStorage.toggled="",$(".section-center").css("display",""))}),$("body").hasClass("Night")?$("#modedark").prop("checked",!0):$("#modedark").prop("checked",!1)});//]]></script>

  • Jika kode di atas sudah di semua, Untuk selanjutnya silahkan anda cari kode </head> dan pasang kode jQuery dibawah ini bagi anda yang belum memasang nya. Letakkan tepat di atas </head>

<script src='//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>

Note : jika Anda belum memasang kode jQuery di blog kalian Kemudian yang terakhir simpan kode di bawah ini tepat di atad kode </head>

<div class='section-center'> <div class='shooting-star'/> <div class='shooting-star-2'/><div class='star'/><div class='star snd'/><div class='star trd'/><div class='star fth'/><div class='star fith'/></div>

Tahap terakhir simpan tema dan lihat hasilnya , selamat mencoba semoga berhasil !!

Kamis, 20 Mei 2021

Cara menghapus gambar thumbnail dan optimasi pada template Viomagz v 3.2

Bagi anda pengguna template Viomagz karya Mas Sugeng ini, template ini sudah tidak asing lagi di telinga para blogger,sudah template nya sangat ringan,Fast Loading dan SEO Friendly lagi.
Di kesempatan kali ini saya akan berbagi sedikit tips tentang Cara Optimasi Template dan Untuk Cara Optimasi Rangking dan traffic anda bisa baca disini :

Manfaat dari optimasi Template VioMagz.

Untuk manfaat optimasi Template Tentunya banyak mendapatkan manfaat seperti mempercepat kecepatan loading blog kita dan memiliki blog yang fast loading.

Keuntungan memiliki blog yang fast loading.

Ada banyak keuntungan dari fast loading blog yang cepat,seperti membuat pengunjung betah di blog kita sehingga mengurangi bounce rate, dan membuat mesin pencari google lebih menyukai blog kita karena loadingnya yang cepat.

Seperti yang kita ketahui bahwa kecepatan pemuatan sebuah situs sudah menjadi salah satu dari sekian banyak faktor yang mempengaruhi SEO.

Cara Optimasi dan Mempercepat Template VioMagz

1. Menonaktifkan Navbar

Selain memperberat loading blog kita,navbar di template Viomagz tidak ada fungsinya.
Cara menonaktifkan Navbar

Masuk ke Blogger akun anda.
Masuk ke menu tata letak dan pilih Navbar.
Lalu pilih off untuk menonaktifkannya.
Klik simpan bila sudah selesai.

2. Menghapus Gambar Thumbnail Postingan di Hompage

Berikut ini cara menghapus gambar thumbnail postingan di hompage :

Anda harus Log In Blogger dahulu seperti langkah pertama.
Masuk ke menu Tema.
Lalu klik pada Tombol Edit HTML.

Hapus kode di bawah ini :
<b:include data='post' name='postthumbnail'/>

Setelah itu cari kode CSS berikut ini :

info-1, .info-2, h2.post-title, .post-snippet {
margin-left: 275px;
}

Bila sudah ketemu silahkan hapus,lalu ganti dengan kode CSS berikut ini :

info-1, .info-2, h2.post-title, .post-snippet {
margin-left: 0px !important;
}

Lihat seperti gambar dibawah ini :
Bila sudah klik " Simpan Tema "

3. Menghapus Fitur Numbered Page Navigation

Cara menghapus Numbered Page Navigation :

Buka Edit HTML seperti pada tutorial No 2 tadi
Lalu cari kode Javascript berikut ini :

var numberedPagination = true
Bila sudah ketemu silahkan ganti true dengan false
Lalu klik Simpan Tema

4. Memasang Fitur Load More

Fitur Load More adalah pengganti terbaik untuk numbered page navigation maupun tombol page navigation bawaan blogger.

Selain ringan,dengan penggunaan fitur ini mampu mengurangi jumlah Bounce Rate dari situs anda.

5. Menghapus Thumbnail Pada Widget Popular Post

Cara menghapus thumbnail pada widget popular post VioMagz :

Buka Menu Tata Letak seperti pada langkah-langkah sebelumnya.

Lalu Pilih Postingan Populer/Popular Post.
Hapus Centang pada pilihan Thumbnail Gambar.
Lalu klik Simpan.

6. Menghapus Fitur Numbered di Popular Post

Cara menghapus fitur numbered di widget popular post VioMagz :

Buka Menu Tema.
Lalu klik tombol Edit HTML.
Setelah itu cari dan hapus kode di bawah ini :

<b:include name='numberedpopularposts'/>

Lihat seperti gambar dibawah ini
Bila sudah klik Simpan Tema.

7. Memasang Script Lazyload untuk Gambar

Script lazyload ini adalah fitur yang membuat gambar hanya akan dimuat ketika pengunjung membuka/mengaksesnya. Sehingga pada saat pengunjung membuka blog kita mereka hanya memuat beberapa file - file penting saja.

8. Memasang Expired Header

Expired Header pada dasarnya berfungsi untuk menyimpan cache pada browser sehingga saat pengunjung membuka blog kita untuk kesekian kalinya,mereka bisa memuat dalam waktu cepat. 

Karena fitur ini bekerja dengan menyimpan cache dari file seperti CSS,HTML,JS,Jpg.PNG,ico dan file lain yang terdapat di blog kita.

Selamat mencoba semoga bermanfaat !!

Rabu, 19 Mei 2021

Cara cepat Memperbaiki Error Breadcrumb di Google Search Console

 "Cara cepat Memperbaiki Error Breadcrumb di Google Search Console"

" Bicara tentang google search console ,Google Search Console adalah layanan gratis yang ditawarkan oleh Google untuk membantu Anda memantau situs anda di google pnulusuran, jika Anda memiliki situs dan ingin tahu bagaimana kinerja situs anda di google penelusuran anda bisa memantau nya di  layanan Google search console.
Google search console banyak memberikan manfaat bagi situs anda, terutama anda bisa melihat hasil atau performa penelusuran situs Anda dengan Google Search Console dan jelajahi untuk mendapat dukungan Google Webmaster ,...

Lalu bagaimana cara menggunakan google search console ?

Nanti kita akan bahas di postingan selanjutnya : cara menggunakan google search console

Langsung saja ke pokok pembahasan yang akan kita bahas, banyak para blogger pemula mungkin merasa kebingungan dengan yang namanya Error Breadcrumb di Google Search Console lalu bagaimana cara memper baikinya ?

Error Breadcrumb di Google Search Console ini adalah fitur baru dari Google Search Console untuk membantu pengunjung untuk memahami lokasi mereka dalam sebuah website.

Masalah ini biasanya di sebabkan dari template yang baru z ganti, seperti template blogger Viomagz, Jika Anda menggunakan Template Blogger dari Viomagz pasti menerima update versi terbarunya. Nah, kamu akan melihat bahwa ada perbaikan "Markup" Kode Data Terstruktur dari yang sebelumnya data-vocabulary.org ke schema.org pada template versi terbaru, maka terjadilah Error Breadcrumb ...

Nah, jika anda sedang mengalami masalah error ini, tenang saja ini ada solusinya, silahkan ikuti tips tentang Cara Memperbaiki Error Breadcrumb di Google Search Console berikut ini.

Cara Memperbaiki Error Breadcrumb di Google Search Console.

1. Silahkan Anda masuk ke Dashboard Blogger ➧ Klik menu Tema ➧ Klik Edit HTML.

2. Arahkan kursor di dalam HTML tersebut, lalu tekan CTRL + F. Sehingga muncul kotak pencarian.

3. Cari dan ganti code Breadcrumb di bawah ini :

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span>
</div></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs-outer'><div class='breadcrumbs'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a></span> &#8250; <b:loop values='data:post.labels' var='label'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span><b:if cond='data:label.isLast != &quot;true&quot;'> &#8250; </b:if> </b:loop>
</div></div>
<b:else/>
<div class='breadcrumbs-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><b:switch var='data:blog.locale'><b:case value='id'/>Tanpa Kategori<b:default/>No Category</b:switch></span></div></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs-outer'><div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><b:switch var='data:blog.locale'><b:case value='id'/>Arsip untuk<b:default/>Archive for</b:switch> <data:blog.pageName/></span> 
</div></div>
<b:else/>
<b:if cond='data:blog.searchQuery'>
<div class='breadcrumbs-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span>
</div></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'> 
<div class='breadcrumbs-outer'><div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'> <span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span>Daftar Artikel</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span> 
</b:if>
</div></div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

Lalu ganti semua kode script Breadcrumb yang lama dengan kode script di bawah ini :

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:view.isPost'>
 <b:loop values='data:posts' var='post'>
  <div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
   <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
   <a expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
   <meta content='1' itemprop='position'/>
   <span itemprop='name'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a>
   </span>
   <b:if cond='data:post.labels'>
   <b:loop index='nomor' values='data:post.labels' var='label'> &amp;nbsp;&#8250;&amp;nbsp;
     <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
    <meta expr:content='data:nomor+2' itemprop='position'/>
    <a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' expr:title='data:label.name' itemprop='item' rel='nofollow'>
      <span itemprop='name'><data:label.name/></span>
    </a>
     </span>
   </b:loop>
   <b:else/>
   &amp;nbsp;&#8250;&amp;nbsp; <span itemprop='name'><data:blog.pageName/></span>
   </b:if>
  </div>
 </b:loop>
<b:elseif cond='data:view.isPage'/>
 <div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
  <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
  <a expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
  <meta content='1' itemprop='position'/>
  <span itemprop='name'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a>
  </span> &amp;nbsp;&#8250;&amp;nbsp; 
  <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
  <meta expr:content='data:num+2' itemprop='position'/>
  <a expr:href='data:blog.url' expr:title='data:post.url' itemprop='item'>
    <span itemprop='name'><data:blog.pageName/></span>
  </a>
  </span>
 </div>
</b:if>
</b:includable>
 



BACA JUGA:


4. Klik Simpan Tema dan Selesai.

Langkah Selanjutnya, silahkan Anda cek di Search Console dan klik menu Breadcrumb.


5. Langkah Selanjutnya, silahkan Anda cek di Search Console dan klik menu Breadcrumb.

Setelah itu, Anda tinggal menunggu pesan atau notifikasi perbaikan yang akan dikirimkan melalui email blog setelah divalidasi.

Semoga artikel tentang Cara cepat Memperbaiki Error Breadcrumb di Google Search Console bisa membantu Anda.
Selamat Mencoba!
Semoga Bermanfaat!

Minggu, 16 Mei 2021

Cara membuat kotak script dalam postingan blog

Cara membuat kotak script dalam postingan blog


"Di kesempatan kali ini saya akan coba membahas mengenai cara bagaimana membuat kotak script dalam postingan atau artikel.
Apa itu kotak script ?

Kotak script tex box atau dikenal dengan text box area adalah sebuah kotak khusus yang bisa digunakan untuk meletakkan kode script HTML, CSS, Java script, atau bahasa pemograman lainnya.

Tidak hanya itu, kotak script juga bisa digunakan untuk catatan penting atau tulisan penegasan pada postingan atau artikel di blog atau website.

Mungkin bagi anda yang sering membaca atau sekedar mencari informasi tentang sesuatu yang sedang anda cari, di dalam postingan nya ada sebuah kotak yang menunjukkan hal hal yang penting yang mengharuskan anda untuk membacanya, seakan anda bertanya ,kok bagus ya ,bagaimana cara membuatnya ?

   "Langsung saja ke pokok pembahasan.
Secara default, platform Blogspot dan Wordpress masing-masing theme sudah menyediakan fitur yang di namakan“blockquote”.

Kita tinggal hanya menseting, dengan cara drag paragraf-nya dan klik “tanda kutip dua” di bagian toolbar pada panel postingan. Hanya saja layout-nya kurang menarik dan modelnya juga cuma itu-itu saja.

Di bawah ini ada beberapa code untuk membuat kotak script di dalam postingan blog, yang bisa anda pilih :

1. Kotak Script dengan groove-border (seperti masuk ke dalam halaman postingan)

<div style="background-color: white; border: 3px Pink Groove; padding: 5px; text-align: left;"> Tulis script anda di sini..! </div>

2. Kotak Script dengan ridge-border (seperti timbul)
<div style="background-color: #dde5d1; border: 3px Blue Ridge; padding: 5px; text-align: left;"> Tulis script anda di sini..! </div>

3. Kotak Script dengan outset-border (seperti keluar dari halaman postingan)
<div style="background-color: white; border: 3px #1780dd outset; padding: 10px; text-align: left;"> Tulis script anda di sini..! </div>

4. Kotak Script dengan inset-border (seperti tertanam pada halaman postingan)
<div style="border: 4px #02d144 inset; padding: 10px; background-color: #d5839f; text-align: left;"> Tulis script anda di sini..! </div>

5. Kotak Script dengan dashed-border (garis putus-putus)
<div style="background-color: palegreen; border: 5px #1780dd Dashed; padding: 5px; text-align: left;"> Tulis script anda di sini..! </div>

6. Kotak Script dengan dotted-border (garis titik-titik/dots)
<div style="background-color: #ffebcd; border: 3px Red Dotted; padding: 5px; text-align: left;"> Tulis script anda di sini..! </div>

7. Kotak Script dengan left-border
<div style="background-color: #f3f3f3; border-left: 10px solid #2288dd; padding: 10px; t-align: left;"> Tulis script anda di sini..! </div>

8. Kotak Script dengan top-border
<div style="background-color: ghostwhite; border-top: 8px solid red; overflow: auto; padding: 10px; t-align: left;"> Tulis script anda di sini..! </div>

9. Kotak Script dengan double-border
<div style="background-color: lightcyan; border: 3px #FE0606 double; padding: 10px; text-align: left;"> Tulis script anda di sini..! </div>

10. Kotak Script dengan single-border solid 4px
<div style="background-color: #f3f3f3; border: 4px solid #999; padding: 10px; t-align: left;"> Tulis script anda di sini..! </div>

11. Kotak Script dengan single-border solid 2px
<div style="background-color: ivory; border: 2px solid black; padding: 10px; text-align: left;"> Tulis script anda di sini..! </div>

12. Kotak Script sederhana tanpa lis border
<div style="background-color: turquoise; padding: 10px; text-align: left;"> Tulis script anda di sini..! </div>

Catatan :
  • Background-color (warna kotak script) 
  • Border-color(warna garis border) 
  • Border (..)px (ketebalan garis border) text-align (posisi script). 
Cara membuat kotak Script dalam postingan blog Anda cukup ikuti langkah-langkah di bawah ini :

  • Masukk ke Dashboard Blog
  • Posting/New Entry Tulis konten seperti biasa sampai selesai Ganti mode penulisan dari “Compose” menjadi “HTML” 
  • Copyrr script yang kalian suka, dan Paste -kan Script tersebut pada posisi yang kalian mau.
  • Kembali ganti mode penulisan dari “HTML” menjadi "Compose", lalu edit “Tulis script anda di sini..!” ganti dengan tulisan sobat yang mau dimasukan dalam kotak script.
  • Silahkan klik "Pratinjau" untuk memastikan script sudah berjalan. Terakhir, kalau sudah berjalan dan posisinya sudah pas. Jangan lupa di simpan dulu dan silahkan dipublish.
Sekian ulasan mengenai cara membuat kotak Script dalam postingan blog, selamat mencoba semoga bermanfaat !!!

Sabtu, 15 Mei 2021

Cara membuat dan memasang gambar Favicon di Hp Android

Apa itu Favicon?

Favicons bisa dikenal dengan nama favorite icons, URL icons, atau website icon.
Favicon ini adalah ikon-ikon yang sangat kecil (biasanya 16x16 atau 32x32) dan muncul di samping URL situs web Anda di dalam tab dan bookmarks peramban, yang memudahkan para pengunjung Anda mengenali situs web Anda di dalam tab mereka yang sedang terbuka.
Mengapa Harus Menggunakan Favicon generator ?

Tujuan nya untuk mengatur ulang ukuran logo situs web Anda secara manual untuk digunakan sebagai favicon, Favicon Generator secara instan menyediakan ukuran favicon yang tepat untuk Anda dalam format PNG.

Memiliki favicon adalah hal penting untuk branding dan dengan Favicon Generator, Anda tak lagi kesulitan mengatur ulang ukuran ikon Anda secara tepat guna membuat situs Anda dikenali dengan mudah.

Membuat favicon blog sebenarnya cukup mudah namun terkadang ini sangat membingungkan karena ukuran icon yang sangat kecil pasti susah untuk menentukan ukuran yang pas di blogspot.


Oke langsung saja kita ikuti langkah langkah di bawah ini untuk cara pembuatanya :


1. klik link favicon generator yang di atas.

2. Create new Favicon
3. Pilih Chose File Cari file img di Pc > Pilih Generate only 16x16 favicon.ico.

4. Bila proses Create sudah selesai langsung saja pilih Download the generated favicon.
5. Selesai.


Untuk cara pemasangan gambar Favicon ikuti langkah langkah di bawah ini :

1. Log-in ke blogger.com

2. Pilih menu setting dan cari Favicon.
3. Upload file Favicon yang sudah anda buat tadi.
4. Jika sudah selesai pilih simpan.

Demikian untuk Cara Membuat Favicon 
Untuk blog semoga bermanfaat terimakasih.

Minggu, 09 Mei 2021

Cara membuka situs yang diblokir oleh mesin pencari Google

Cara membuka situs yang diblokir oleh mesin pencari Google

Di kesempatan kali ini saya akan jelaskan bagaimana cara membuka situs yang diblokir google, pasti anda pernah mengalami dimana Anda sedang mencari situs yang anda cari ternyata pas di klik sudah di blokir dengan tulisan internet baik ,,😁

Apa yang anda rasakan ? 😁 ,menjengkelkan ya , ini berdasarkan pengalaman pribadi saya juga .
 

Tapi Google memang benar-benar baik untuk kebaikan kita juga, dimana situ-situs yang tidak layak untuk di lihat seperti yang berbau pornografi oleh mbah Google di blokir, karena banyak para pengguna gadget sekarang tidak hanya di kalangan orang dewasa saja, anak di bawah umur saja sekarang sudah bisa mengerti bagaimana cara menggunakan handphone dan mencari banyak informasi di google.

Google adalah mesin pencari pertama yang banyak di kenal di masyarakat luas, kebanyakan orang mencari sesuatu informasi atau membuka situs-situs dengan menggunakan Google, Google merupakan sumber informasi pertama.

Langsung saja ke pokok pembahasan, bagi anda yang lagi kebingungan untuk membuka situs yang sedang Anda cari tetapi oleh Google sudah di blokir ,anda bisa menggunakan yandek.com.

Yandex adalah mesin pencari semacam google yang di miliki perusahaan rusia, di mesin telusur yandek semua situs yang di blokir oleh mesin pencari Google bisa di buka.

Namun, Mesin telusur yandek ini tidak semua orang tahu , Jika anda ingin mencobanya silahkan anda download aplikasinya di bawah ini :

Link : yandek

Selamat mencoba !!
semoga bermanfaat !!

Jumat, 07 Mei 2021

Cara Daftar Yandex ,Submit dan Verifikasi Blog ke Yandex Webmaster tools dengan mudah dan cepat

Yandex Webmaster adalah salah satu layanan situs yang dimiliki oleh mesin telusur raksasa Yandex, sebuah mesin pencari yang menyerupai Google.
Yandex merupakan perusahaan teknologi yang berpusat tepatnya di rusia, kita juga bisa memanfaatkan mesin telusur Yandex ini untuk meningkatkan jumlah kunjungan ke situs yang kita miliki.

Tidak jauh beda sama Google webmaster ,yandex juga mempunyai webmaster tool seperti yang google punya, fungsinya juga sama seperti google webmaster atau Google search console yang di miliki google, Yandex Webmaster Tools adalah mesin pencari yang berasal dari negara Rusia, mesin pencarian ini sama seperti Google, Bing, dan Yahoo.

Walaupun yandex webmaster tidak terlalu di kenal oleh banyak orang dan memang sedikit asing dengan namanya, Namun banyak pemilik blog ataupun website yang menggunakan webmaster tool ini tujuan mereka yaitu untuk menunjuang performa dan kualitas website mereka.

Karena dengan menggunakannya harapan mereka adalah untuk mendapatkan pengunjung yang sebesar-besarnya yang akan datang ke website mereka.



bagi anda yang belum mengetahui cara mendaftarkan serta submit URL website atau blog kalian ke yandex webmaster tools.

silahkan ikuti langkah-langkah berikut ini :

1. Buka browser anda dan kunjungi situs webmaster.yandex.com

2. Kemdian setelah Anda berada di halaman awal Yandex webmaster, klik menu Login nanti ada pilihan untuk Registrasi.

Pada bagian ini silahkan lengkapi data diri Anda:

  • Isikan nama depan anda.
  • Isikan nama belakang anda.
  • Isikan nama untuk login masuk setelah terdaftar.
  • Isikan password.
  • Ulangi kembali isikan password.
  • Kemudian masukkanlah nomor handphone Anda yang masih aktif, karena kita Negara Indonesia jadi di awali dengan menggunakan kode +62, nah setelah Anda selesai maka akan diminta mengisikannya kode verifikasi yang dikirim ke no handphone Anda dan masukkan saja kodenya.
  • Setelah selesai dan sukses semua maka tingga klik “Register”.

Biar lebih gampang anda bisa langsung mendaftar dengan menggunakan akun Google anda jadi tidak perlu mengisi seperti yang saya jelaskan di atas.

3. Submit URL Blog anda ke Yandex Webmaster Tools.

Cara Submit URL Blog ke Yandex Webmaster Tools ,Jika anda sudah terdaftar dan telah berhasil silahkan login terlebih dahulu dan masuk ke pengaturan dasar Yandex Webmaster Tools di dashboard.

  • Pertama kali Anda Login maka akan diminta untuk menambahkan situs Anda Pilih tanda (+).  Kemudian silahkan untuk mengisikan nama url blog Anda dan tinggal pilih “Add” dan selesai.

  • Nah setelah selesai maka Anda akan diminta untuk virifikasi ke blog atau website Anda ,ada 3 cara untuk melakukan verifikasi yaitu dengan HTML tag, HTML file dan DNS record.

  • Lakukan saja dengan cara meta tag biar lebih gampang,klik meta tag dan dapat kan codenya  seperti contoh :

  • <meta name=”yandex-verification” content=”........

Salin kode tersebut dan tempelkan tepat di bawah kode script <head>
Dengan cara edit html tema pada situs yang daftarkan, Jika sudah klik verifikasi.

4.Submit sitemap di yandex Webmaster Tools.
bagaimana cara kita submit URL ke yandex Webmaster Tools caranya anda bisa ikuti langkah langkah di bawah ini .


  • Langkah pertama yaitu pilihlah menu “Indexing

  • Lalu pilih ” Sitemap file” maka akan tampil form pengisian sitemap Anda.

  • Disini silahkan memasukkan sitemap Anda terlebih dahulu di form yang disediakan tersebut, cukup mudah untuk menerapkannya tinggal buat saja “sitemap.xml” contohnya sebagai berikut :

  • https://www.xsample.com/sitemap.xml

  • Jika sudah silahkan klik tombol “Add” dan selesai.

  • Langkah berikutnya yaitu submit URL artikel blog atau website kita.

5. Submit URL Artikel Blog di yandex Webmaster Tools.


Seperti halnya dengan Google webmaster dan bing webmaster setelah kita membuat artikel maka yang perlu kita lakukan adalah submit url artikel tersebut ke mesin pencari nah begitu juga di yandex webmaster ini coba ikuti langkah berikut ini :

  • Langkah pertama yaitu pilihlah menu “Indexing”.

  • Kemudian pilihlah menu ” Reindex pages”.

  • Jika sudah maka disitu ada kolom kosong yang nantinya untuk mengisi URL artikel Anda, kolom tersebut berfungsi untuk mengisikan URL artikel yang Anda miliki setelah memposting artikel.

  • Copy-lah link artikel yang Anda miliki contohnya :

  • https://www.xsample.com/2021/03/cara-mendaftar-dan-submit-url.html

  • Link tersebut Anda taruh saja di kolom yang disediakan dan pilih “Send” dan selesai, jika Anda belum sempat submit url sebelumnya maka Anda bisa menambahkan beberapa URL langsung seperti diatas selamat mencobanya.

Semoga bermanfaat !!