[notice type=”alert”]Updates: Check out how to add schema markup in WordPress Theme for WordPress blog with multiple authors[/notice]
For those who doesn’t know. Schemas, i.e., html tags, that webmasters can use to markup their pages in ways recognized by major search providers. Search engines including Bing, Google, Yahoo! and Yandex rely on this markup to improve the display of search results, making it easier for people to find the right web pages.
Many sites are generated from structured data, which is often stored in databases. When this data is formatted into HTML, it becomes very difficult to recover the original structured data. Many applications, especially search engines, can benefit greatly from direct access to this structured data. On-page markup enables search engines to understand the information on web pages and provide richer search results in order to make it easier for users to find relevant information on the web. Markup can also enable new tools and applications that make use of the structure.
A shared markup vocabulary makes it easier for webmasters to decide on a markup schema and get the maximum benefit for their efforts. So, in the spirit of sitemaps.org, search engines have come together to provide a shared collection of schemas that webmasters can use. – description via schema.org
Using Google Tools to Check Your Page Schemas
First check if your site and inner page already schema-ready. Go to Structured Data Testing Tool and enter your website or webpage address. If everything went well, you should see a results similar to below screenshot.
if not then you should consider starting to add schema markup on your website for better search engine optimization results. Don’t worry here’s an easy step by step tutorial on How to Add Schema Markup to your WordPress Theme.
1. Register a Google Plus Account
For the schema to work, you need a Google Plus Profile URL so register a new plus account now. Skip this step if you already had one.
2. Adding rel=’publisher’ to your WordPress Theme
Open header.php and just before closing of </head> add this code with your own google plus profile id for publisher profile.
[code lang=”html”]<link rel="publisher" href="https://plus.google.com/xxxxxxxxxxxxxxxxxxxx" />[/code]
3. Create Schema Data Templates
Create a new php file and copy paste this code into it and name it to schema.php and moved to your theme root. wp-content/your-theme-name/schema.php
[php]
<div style="width:10px;height:10px;position:absolute;left:-9999em" class="post-schema">
<article itemscope="" itemtype="http://schema.org/Article">
<span class="entry-title" itemprop="name headline"><a itemprop="url" href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></span>
<!– Insert data:Person schema –>
<span itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<!– Insert data:rel:Author schema –>
<span itemprop="name">
<a href="https://plus.google.com/xxxxx-your-id-xxxxxx?rel=author" itemprop="url">YOUR NAME</a>
</span>
<!– Insert data:others schema *optional –>
<span itemprop="givenName">YOUR FIRST NAME</span>
<span itemprop="familyName">YOUR FAMILY/LAST NAME</span>
<span itemprop="email">YOUR EMAIL ADDRESS</span>
<span itemprop="jobTitle">YOUR TITLE</span>
<span itemprop="brand">YOUR BRAND</span>
</span>
<!– Insert data:Published schema –>
<time datetime="<?php the_time(‘Y-m-d’) ?>" itemprop="datePublished"></time>
<time class="entry-date updated" datetime="<?php the_modified_time(‘d F Y’) ?>"><?php the_modified_time(‘d F Y’) ?></time>
<!– Insert data:Author schema –>
<span class="vcard author"><span class="fn"><?php the_author(); ?></span></span>
<!– Insert data:ArticleSection schema –>
<?php
$categories = get_the_category();
$separator = ‘, ‘;
$output = ”;
if($categories){
foreach($categories as $category) {
echo ‘<span style="display:none;" itemprop="articleSection">’ . $category->cat_name . ‘</span>’;
}
}
?>
<!– Insert data:Tag schema –>
<?php if( has_tag() ) { ?>
<span itemprop="keywords"><?php the_tags(”, ‘,’); ?></span>
<?php } ?>
<!– Insert data:Content schema –>
<?php if( !is_singular() ): ?>
<div itemprop="description"><?php the_excerpt(); ?></div>
<?php else: ?>
<div itemprop="articleBody"><?php the_content(); ?></div>
<?php endif; ?>
</article>
</div>
[/php]
or download the zipped schema.php here
You might notice in previous copied code. i included a style=’display:none’ in class=’post-schema’. This is to prevent the data been showed in your site.
4. Adding created schema.php into post_loop()
Open any file with post_loop (index.php, home.php, archive.php or single.php) and add this code
[php]<?php get_template_part(‘schema’); ?>[/php]
to post_loop() like this
[php]<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<!– your own existed loop code –>
<!– add this below –>
<?php get_template_part(‘schema’); ?>
<?php endwhile; else: ?> <?php endif; ?>[/php]
5. Retest with Google Snippet Tools
Finally Clear your cache and retest your website with Structured Data Testing Tool. You should be able to see the schema markup properly generated and structured.