Berikut ini Cara Memperbaiki error Breadcrumbs sekaligus Pasang Schema Webpage dan NewsArticle di DetikStyle V2.
Perbaikan dan penambahan Schema Markup ini agar lebih SEO Friendly.
1. Klik Tema > Edit HTML
2. GANTI kode ini
#breadcrumbs{border-bottom:1px solid #eee;margin:0 0 10px;padding:5px 0;font-size:13px}
#breadcrumbs ul{margin:0;padding:0}
#breadcrumbs ul li{display:inline-block;position:relative;margin:0 0 0 18px}
#breadcrumbs a{color:#768187;margin:0}
#breadcrumbs ul li:first-child a{margin:0}
#breadcrumbs ul li::before{border-color:transparent transparent transparent #aaa;border-image:none;border-style:solid;border-width:4px;content:"";height:0;left:-12px;position:absolute;top:8px;width:0}
#breadcrumbs ul li:first-child::before{border:none}
DENGAN kode ini:
.breadcrumbs {line-height: 1.2em;width: auto;overflow: hidden;padding:5px 0;margin:10px 0;font-size: 90%;color: #888;font-weight:300}
.breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#777;font-weight:400}
.breadcrumbs a:hover{color:blue}
.breadcrumbs svg{width:20px;height:20px;vertical-align:-5px;margin:0 -3px}
.breadcrumbs svg path{fill:#c8c8c8}
3. GANTI kode ini:
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.pageType == "item"'>
<div id='breadcrumbs'>
<ul>
<b:loop values='data:posts' var='post'><b:if cond='data:post.labels'>
<span><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title' style='padding-left:8px;'><i class='fa fa-home'/> <data:blog.title/></span></a></span>
<b:loop values='data:post.labels' var='label'><li><a expr:href='data:label.url + "?&amp;max-results=6"' itemprop='url'><span itemprop='title'> <data:label.name/></span></a></li><b:if cond='data:label.isLast != "true"'/></b:loop>
</b:if></b:loop>
</ul>
</div>
</b:if>
</b:includable>
DENGAN kode 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'> &nbsp;›&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 + "?&max-results=8"' expr:title='data:label.name' itemprop='item' rel='nofollow'>
<span itemprop='name'><data:label.name/></span>
</a>
</span>
</b:loop>
<b:else/>
&nbsp;›&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> &nbsp;›&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>
Simpan!
Memasang SCHEMA NEWSARTICLE
DetikStyle V2 umumnya digunakan untuk blog berita. Meskipun bukan blog berita, ada baiknya juga menggunakan schema NewsArticle ini agar bisa bersaing dengan situs berita.1. HAPUS kode ini:
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:post.firstImageUrl'>
<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
</b:if>
<meta expr:content='data:blog.blogId' itemprop='blogId'/>
<meta expr:content='data:post.id' itemprop='postId'/>
2. GANTI dengan kode ini:
<div class='post hentry'>
<script type='application/ld+json'>
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "<data:post.title/>"
},
"headline": "<data:post.title/>",
"image": {
"@type": "ImageObject",
"url": "<data:post.firstImageUrl/>",
"height": 800,
"width": 800
},
"datePublished": "<data:post.timestampISO8601/>",
"dateModified": "<data:post.timestampISO8601/>",
"author": {
"@type": "Person",
"name": "<data:post.author/>"
},
"publisher": {
"@type": "Organization",
"name": "<data:blog.title/>",
"logo": {
"@type": "ImageObject",
"url": "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA7Nvkn2WAALb0k69gwEO2LYNTnYW7j6jwLyLqw2pfVYoQTGZNq7jkJh0y9quqKY55urZkVWTDu5Vx-jU_RhsMTBHREhbwjYW7B8BLKzeBkRcLNHsMIWU4WP0a-XjLwlIu6Sc4eBiM9VKR/s320/wallpaper+bola+gp+sport.png",
"width": 600,
"height": 60
}
},
"description": "<data:post.snippet/>"
}
</script>
Ganti kode warna merah dengan link gambar/logo blog Anda.
Memasang SCHEMA WEBPAGE
Kode berikut ini mengubah kode schema Blog menjadi Webpage agar lebih SEO.1. GANTI kode
<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
2. DENGAN kode
<div itemscope='itemscope' itemtype='http://schema.org/Webpage'>
Simpan!
Jika ingin file DetikStyle V2 Update, silakan kirim email ke cbblogger2014@gmail.com menggunakan email sebelumnya saat pembelian.*
Terima kasih infonya. Kami sudah memperbaiki Breadcrumbs plus Pasang Schema Webpage dan NewsArticle-nya.
ReplyDeleteSama-sama, good luck!
Delete