Adding Schema.org Structured Data to Blogger Templates

Adding Schema.org Structured Data to Blogger Templates

Peace be upon you. In the Rotkx blog, we present to you exclusively all the codes related to structured data that appear in the Structured Data Testing Tool and site supervisors, to make your site template compatible with Google 💪, due to its importance in the On-Page SEO process 🎯.


To improve search results in search engines, by creating organized and defined data using approved encoding to help search engines understand page content 😎, and provide higher quality search results 😇.


Unfortunately, most Arabic templates do not include this 😥, but for the first time in the Arab web, Rotkx blog provides you with an explanation of how to add Schema.org Structured Data Codes to Blogger templates or Schema codes with simplified illustrative images 💝.


Adding Schema.org Structured Data Codes to Blogger Templates


This is a very easy task, and everyone can do it easily. You just need to add a small code in a few lines to your template. Focus and read each step carefully so you don't encounter any problems 😊.


1. Look for <body> or body> and add the specified code, then make it as follows


<body itemscope='' itemtype='http://schema.org/WebPage'>

The header (the part containing the categories list, blog title, etc.)


2. Look for <div id='header-wrapper' or <header> and add the specified code, then make it as follows


<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>

The main categories menu in the header


3. Look for <nav or <div class='main-menu' and add the specified code, then make it as follows


<nav id='topnav' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>

The part containing the main content and sidebar together


4. Look for <div id='content-wrapper' and add the specified code, then make it as follows


<div id='content-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'>

The part containing only the post, either on the homepage or inside the post


5. Look for <article and add the specified code, then make it as follows


<article class='post hentry' expr:id='data:post.id' itemscope='' itemtype='http://schema.org/BlogPosting'>

If you don't find the previous code, you'll find the following code. Look for <div class='post hentry and add the specified code, then make it as follows


<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Author code (responsible for displaying the name on the homepage)


6. Look for <span class='fn author' and add the specified code, then make it as follows


<span class='fn author' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>

The sidebar (containing widgets like popular posts and newsletter subscription)


7. Look for <div id='sidebar-wrapper' or id='sidebar' and add the specified code, then make it as follows


<div id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'>

The footer, the last part of the site always located at the bottom of the template

8. Look for <footer or id='footer-wrapper' and add the specified code, then make it as follows


<footer id='footer-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>

And thus we have finished. I hope you find it useful 😊. Waiting for your feedback in the comments 💬 and thank you for watching.

Comments

  1. جزاكم الله خيرا موضوع جيد

    ReplyDelete
  2. شكرا على الموضوع الجميل

    ReplyDelete

Post a Comment