Istogrami Web Page design: SEO: Meta tags the ultimate Setup

Meta Tags Setting

In this template there are some meta tags that requires your attention. You can edit the meta tags with your info. So, lets's start, this tutorial is for the Google blogger Platfor
All Istogrami Templates inclute the SEO code below and now we show you how to update this code with your informations

To edit the Meta tags in this theme follow the below steps:

On your blogger dashboard go to Template
Click Edit HTML
On Head Write the below code. You will find it at the top of template code. Just click in template scroll and you will see the below code.

Code:

<link href='https://plus.google.com/xxxxx/posts' rel='publisher'/>
<link href='https://plus.google.com/xxxxx/about' rel='author'/>
<link href='https://plus.google.com/xxxxx' rel='me'/>
<meta content='xxxxx' name='google-site-verification'/>
<meta content='xxxxx' name='msvalidate.01'/>
<meta content='xxxxx' name='alexaVerifyID'/>
<meta content='Greece' name='geo.placename'/>
<meta content='xxxxx' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<meta content='Facebook App ID here' property='fb:app_id'/>
<meta content='Facebook Admin ID here' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='@username' name='twitter:site'/>
<meta content='@username' name='twitter:creator'/>

Example and explanation

Options

In the above meta tags, you can place your own info in place of below highlighted portion

xxxxx

Greece

Facebook App ID here

Facebook Admin ID here

@username

Also, find the below meta tag and place your keyword in it.

Code:

<meta content='xxxxx' name='keywords'/>

Options

In xxxxx place your keywords such as <meta content='Blogger, SEO, Template' name='keywords'/>

Example:

See This blog SEO Optimized Meta tags:


Code:

<!-- This site is optimized with the istogami SEO meta tags - https://istogrami365.bogspot.com -->
<meta name="description" content="Get Best Responsive Blogger Templates We are providing Free and Premium SEO Optimized Blogspot Templates For Your Blog"/>
<link rel="canonical" href="https://istogrammi.wixsite.com/website" />
<link rel="publisher" href="https://plus.google.com/+HelenPeraki-istogram"/>
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Templates Design - Premium Blogger Templates" />
<meta property="og:description" content="Get Best Responsive Blogger Templates For your blog. We are providing Free and Premium SEO Optimized Blogspot Templates" />
<meta property="og:url" content="https://istogrammi.wixsite.com/website" />
<meta property="og:site_name" content="istogrami365" />
<meta property="og:image" content="https://1.bp.blogspot.com/-VgIoeLfeSh4/W-aki0sDy9I/AAAAAAAABAM/4AhKOG9D_IgHCdG7lKpaagSS9iU26gXnwCLcBGAs/s1600/istogrami-template-design-960x540.jpg" />

<meta property="og:image:secure_url" content="https://1.bp.blogspot.com/-VgIoeLfeSh4/W-aki0sDy9I/AAAAAAAABAM/4AhKOG9D_IgHCdG7lKpaagSS9iU26gXnwCLcBGAs/s1600/istogrami-template-design-960x540.jpg" />
<meta property="og:image:width" content="960" />
<meta property="og:image:height" content="540" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:description" content="Get Best Responsive Blogger Templates For your blog. We are providing Free and Premium SEO Optimized Blogspot Templates" />
<meta name="twitter:title" content="Istogrami Web Design - Premium Blogger Templates" />
<meta name="twitter:site" content="@istogrami" />
<meta name="twitter:image" content="https://1.bp.blogspot.com/-VgIoeLfeSh4/W-aki0sDy9I/AAAAAAAABAM/4AhKOG9D_IgHCdG7lKpaagSS9iU26gXnwCLcBGAs/s1600/istogrami-template-design-960x540.jpg" />
<meta name="twitter:creator" content="@istogrami" />
<meta name="msvalidate.01" content="Your-microsoft-verification-code" />
<meta name="google-site-verification" content="Your-google-verification-code" />
<!-- / istogami SEO meta tags -->



Replace the Yellow content and paste in your blog <HEAD>  beafore  /<HEAD>

By default, when you upload the image logo in header and choose instead of title and description the H1 tag automatically disappeared from your template.

We have optimized the header by adding the H1 tag even when you upload the image logo. In order to work you just need to find out the below title in your template and replace it with your blog title and you are done with header SEO.

Header SEO

In your Blogger template
Search for Show the image only.
Just below it you will find the below code
Just Replace the istogrami Blogger Template three times as in the below code with your blog title.
Save Template.

Code:

        <b:if cond='data:blog.pageType == &quot;index&quot;'>
                          <h1 itemprop='name'><a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
                            <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span>istogrami Template</span></a>
                            </h1>
<b:elseif cond='data:blog.pageType == &quot;archive&quot;'/>
<h1 itemprop='name'><a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span>istogrami Blogger Template</span></a>
</h1>

<b:else/>
                                   <h2 itemprop='name'><a expr:href='data:blog.homepageUrl' style='display: block'>
                            <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span>istogrami Blogger Template</span></a></h2>            </b:if>

Options

Just change the istogrami Blogger Template with your blog title three time as in the code and save your template.

Mobile ULTIMATE Speedup
---------------------

Add this css beafore </b:skin>


Code:

/*-- mobile speadup and view -- */
.mobile {
background-image: none !important;
}
.mobile {
background-color: #FFFFFF
}







Mobile WINDGETS Speedup

---------------------

Find all windgets who you do non want to see on mobile mode

and replace the add the property mobile='no'

Code musst be like this


Code:

<b:widget id='HTML5' locked='false' mobile='no' title='.' type='HTML' version='1'>
</b:widget>

How to Fix All Structured Data Errors in Blogger Templates
----------------------------------------------------------------------------

Step by step how to resolve Structured Data (hatom markup) errors like missing Author, missing Title, missing Updated, missing Date, missing Image etc... from your blogger template. Before starting tutorial i'm going to tell, There is two way to resolve Structured Data errors.

1. How to Fix Structured Data Hatom Errors in Webmaster Tools.
2. Fix your Hatom markup errors in your blogger template with coding.

First login your Blogger account then go to your blogger template and resolve your errors.

1. Fix Missing Updated Error:

Find the following code 👇 in your blogger template:

<data:post.timestamp/>

And after the finding above code 👆, Replace with the following code 👇 as often as possible.

<span class='updated'><data:post.timestamp/></span>

If the above code 👆 is not working for you then rename 'updated' with 'post-date updated' like the following code 👇.

<span class='post-date updated'><data:post.timestamp/></span>

2. Fix Missing Entry-Title Error:

Find the following code 👇 in your template:

<b:if cond='data:post.title'><h2 class='post-title'>

Replace above code 👆 with the following code 👇 as often as possible.

<b:if cond='data:post.title'><h2 class='post-title entry-title'>

3. Fix Missing Author Error:

Search the following code 👇:

<span class='post-author vcard'>
                          <b:if cond='data:top.showAuthor'>
                            <b:if cond='data:post.authorProfileUrl'>
				Posted by <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/person'>
				<data:blog.title/></span> on 
                              <b:else/>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>                           
<span itemprop='name'><data:post.author/></span>
</span>
                            </b:if>
                          </b:if>
                        </span>

And Replace the above code 👆 by below code 👇:

<span class='post-author vcard'>
                <b:if cond='data:top.showAuthor'>
                  <b:if cond='data:post.authorProfileUrl'>
                  <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>  
                      <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
                      <a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
                        <span itemprop='name'><data:post.author/></span>
                      </a>
                    </span>
                  <b:else/>
                    <span class='fn' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
                      <span itemprop='name'><data:post.author/></span>
                    </span>
                  </b:if>
                </b:if>
              </span>

4. Fix Missing Headline and required Error:

Search and find the following code 👇:

<h1 class='post-title entry-title' itemprop='name'>

And Replace the above code 👆 with below code 👇:

<h1 class='post-title entry-title' itemprop='headline'>

5. Fix Missing Image_URL Error:

There are two methods to solve this issue.

Method.1

Search the below code 👇:

<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>

Replace the above code 👆 with below 👇:

<meta expr:content='data:post.firstImageUrl' itemprop='image'/>

Method.2

Find the following code 👇 in your blogger temple and remove it completely.

 <b:if cond='data:post.thumbnailUrl'><meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/></b:if>

6. Fix Missing BlogId Error:

There are also two method to fix this problem.

First Method:

<meta expr:content='data:blog.blogId' itemprop='blogId'/>

Find the above code 👆 as often as possible and replace with following 👇:

<meta expr:content='data:blog.blogId'/>

Second Method:

Search the following code 👇and completely delete it from your blogger template.

<meta expr:content='data:blog.blogId' itemprop='blogId'/>

7. Fix Missing PostId Error:

There are two way to fix this issue:

Method No.1

<meta expr:content='data:post.id' itemprop='postId'/>

Find the above code 👆 and replace with the following code 👇:

<meta expr:content='data:post.id'/>

Method No.2

Find the below code 👇 and completely remove from your blogger template.

<meta expr:content='data:post.id' itemprop='postId'/>

8. Fix Missing Image Field Error:

Search and find the following code 👇:

<data:post.body/>

And Replace by below code 👇:

<data:post.body/><div itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject'>
<b:if cond='data:post.firstImageUrl'><img style='display:none;' expr:src='data:post.firstImageUrl'/><meta itemprop='url' expr:content='data:post.firstImageUrl'/></b:if><meta itemprop='width' content='800'/><meta itemprop='height' content='800'/></div>

8. Fix Missing DateModified Error:

Find this code 👇 below in the code box:

<div class='post h-entry' itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

If your not found the above 👆 code then find the below 👇 one:

<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

If you have also not found the above 👆 code, then find the below 👇 one:

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

After the getting code 👆, Put down the below code 👇 after your detecting code, Remember the thing do not replace the code, Just put down after the detected code.

<meta expr:content='data:post.lastUpdatedISO8601' itemprop='dateModified'/>

If your problem is not solved then put down below code 👇 after the above code 👆:

<meta expr:content='data:post.timestamp' itemprop='datePublished'/><meta expr:content='data:post.lastUpdatedISO8601' itemprop='dateModified'/>

9. Fix Missing MainEntityofPage Error:

Search this code 👇:

<div class='post h-entry' itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

If your not found the above code 👆, Then you search the following 👇:

<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

If you have also not found the above 👆 code, then find the below 👇 one:

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

After the getting code 👆, Put down the below code 👇 after your detecting code, Remember the thing do not replace the code, Just put down after the detected code.

<meta itemscope='itemscope' itemprop='mainEntityOfPage'  itemType='https://schema.org/WebPage' expr:itemid='data:post.link' content= 'data:post.link : data:post.url'/>

If your problem is not solved then put down below code 👇 after the above code 👆:

<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
<meta itemscope='itemscope' itemprop='mainEntityOfPage'  itemType='https://schema.org/WebPage' expr:itemid='data:post.link ? data:post.link : data:post.url'/>

Now you have done your job Enjoy.

Reblog https://www.landofknowledge.com

More information about at: https://istogrammi.wixsite.com/website

NEW !!! Μπορείτε να συμμετέχετε ενεργά στην ομάδα wordpress911 να κάνετε και να απαντάτε ερωτήσεις να ανεβάζετε άρθρα και video κάντε εγγραφή » Here

Links: Μορείτε να κατεβάσετε τα καλύτερα WordPress Woocommerce Templates ΕΔΩ

2 σχόλια:

5150media23 Ιουνίου 2020 στις 3:47 μ.μ.
Great Post!!
Thank you for this really useful and extensive post. I will keep it in mind, if I ever go for webdesign seo services. We are also in the business of Software as a Service Provider company along with various web design services.
Thanks for sharing it.
ΑπάντησηΔιαγραφή
Απαντήσεις
Ankita Kumari7 Αυγούστου 2020 στις 11:47 π.μ.
This information on meta tags is very helpful for my blog. looking forward to read more.
Best Search Engine Optimization Services
ΑπάντησηΔιαγραφή
Απαντήσεις

Προσθήκη σχολίου

Thank you for contacting us

Istogrami Web Page design

Slide show

Pages

SEO: Meta tags the ultimate Setup

Example and explanation

Options

Options

Header SEO

Header SEO

Options

1. Fix Missing Updated Error:

2. Fix Missing Entry-Title Error:

3. Fix Missing Author Error:

4. Fix Missing Headline and required Error:

5. Fix Missing Image_URL Error:

6. Fix Missing BlogId Error:

7. Fix Missing PostId Error:

8. Fix Missing Image Field Error:

8. Fix Missing DateModified Error:

9. Fix Missing MainEntityofPage Error:

2 σχόλια:

Φόρμα επικοινωνίας του Blog

Facebook Chat

E-mail to Istogrami Webdesign

Labels - Ετικέτες