Selasa, 11 Mei 2021

Cara Mengatasi Masalah Breadcrumbs Pada Google Url Inspection

Cara Mengatasi Masalah Breadcrumbs Pada Google Url Inspection

Bagaimana cara mengatasi atau membaiki masalah breadcrumbs pada google search console (Google Webmaster) khususnya untuk pengguna Blogger. Error ini terkesan apabila kita membuat submit url post ke google url inspection dan melihatnya melalui Live Test. Masalah ini confirm berlaku kepada mereka yang menggunakan custom templates kerana sejak akhir-akhir ini. Google search console semakin di inprove ke tahap yang lebih baik dan terperinci.

Mengatasi Masalah Breadcrumbs Pada Google Url Inspection


Tutorial langkah-langkah Mengatasi Masalah error Breadcrumbs Pada Google Url Inspection:


Jika anda tidak faham, anda boleh semak video dibawah ini untuk lebih detail untuk Cara Mengatasi Masalah Breadcrumbs Pada Google Url Inspection.

##VIDEO


Pertama, buka halaman blogger ⇾ Tema ⇾ Edit HTML ⇾ Paste kode dibawah ini tepat diatas kode <b:includable id='comment-form' var='post'>


<b:includable id='breadcrumb' var='posts'>
   <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' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
               <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
                  <a class='homebread' expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
                  <span itemprop='name'>Home</span></a>
                  <meta content='1' itemprop='position'/>
               </span>
               <svg viewBox='0 0 24 24'>
                  <path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
               </svg>
               <b:loop index='num' values='data:post.labels' var='label'>
                  <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
                     <a expr:href='data:label.url + &quot;?&amp;max-results=16&quot;' expr:title='data:label.name' itemprop='item'>
                        <span itemprop='name'>
                           <data:label.name/>
                        </span>
                     </a>
                     <meta expr:content='data:num+2' itemprop='position'/>
                  </span>
                  <b:if cond='data:label.isLast != &quot;true&quot;'>
                     <svg viewBox='0 0 24 24'>
                        <path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
                     </svg>
                  </b:if>
               </b:loop>
               <svg viewBox='0 0 24 24'>
                  <path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
               </svg>
               <span>
                  <data:post.title/>
               </span>
            </div>
         </b:if>
      </b:loop>
   </b:if>
</b:includable>

Selepas itu, copy kode CSS dibawah ini dan paste sebelum kode </head>

<style type='text/css'>
/* Breadcrumb */
.breadcrumbs{background:#fff;line-height:1.2em;width:auto;overflow:hidden;margin:0;padding:10px 0;border-top:1px solid #dedede;border-bottom:1px solid #dedede;font-size:80%;color:#222;font-weight:400;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap}
.breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#222}
.breadcrumbs a:hover{color:#11589D}
.breadcrumbs svg{width:16px;height:16px;vertical-align:-4px}
.breadcrumbs svg path{fill:#222}
.homebread{margin:0 2px 0 0}
</style>

Seterusnya, tambahkan copy dan paste kode ini tepat di bawah kode <b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

Seterusnya, klik Save Theme dan selesai. Sekarang pergi ke Google webmaster ⇾ Breadcrumb ⇾ klik pada bahagian tulisan error ⇾ klik button Validate Fix
Cara Mengatasi Error Breadcrumb di Search Console Blogger 2

Cara Mengatasi Error Breadcrumb di Search Console Blogger 2

Sekarang, anda hanya perlu tunggu email dalam beberapa hari untuk proses kemaskini daripada Google Webmaster. Demikianlah cara Mengatasi Masalah Breadcrumbs Pada Google Url Inspection. Jika anda mempunyai sebarang penambahan, persoalan dan lain-lain mengenai masalah breadcrumbs ini. Sila tinggalkan ulasan anda pada ruangan komen dibawah sini. Terima kasih!
Add Comments


EmoticonEmoticon