Blog Tutorial Supporter, Simple Search Engine Optimization

August 14, 2016

WordPress Template
WordPress Theme is a most popular template for bloggers that are using WordPress Custom Management System (WCMS). Wordpress system provides a website control by downloading and config into the personal website hosting. A Blogger or website developer will be able to control their posts, pages and everything in WordPress dashboard.

Now everyone can use my free premium WordPress Theme for travel agency website. You can also use it as a personal blog or whatever you want to customize because this template is designed specific with travel agency idea and flexibility for your style. This WordPress template offers many features that designed in many different features and benefit for users. These are below features we design to help you to enjoy you blogging.

WordPress Theme


WordPress Theme Key Features:

  • Minimalistic
  • Grid Layout Related Posts
  • Fast Loading
  • Google Testing Tool Validation
  • Responsive Desing (mobile friendly)
  • 7 Custom Page Templates
  • Featured Image Ready
  • Header Ads Ready
  • Custom Widgets
  • SEO Optimization
  • Support all major browsers (Chrome, Firefox, Safari, IE, and other)
  • Featured Posts Slider
  • Theme Options
  • Cleaned Code
  • Contacts Page Template.

How To Add Grid Layout On Page?

The grid layout is an another feature that you can create it by manual. The below HTML codes are special code that allows you create it by manual. Before you create full-width grid page, you would install this template. This tutorial will be assisting you to install WordPress themes.

Grid Layout On Page

1. Create a new page, look at  Page Attributes > Full Width, Homepage.

Fullwidth Page

2. Select on Text and copy below code and paste in the text field then fill up then the information you need such as Title, description, URL, and Image.

WordPress Text field

<section class="lazy-load-box trigger effect-fade">
<ul class="posts-grid row-fluid unstyled services ul-item-0">
<li class="span3 list-item-4"><figure class="featured-thumbnail thumbnail">
<a title="Title Here" href="URL HERE"><img src="Image URL Here" alt="Title Here"/></a>
</figure>
<div class="clear"></div>
<h4 class="golf-destination">
<a title="Title Here" href="Link URL Here">Title Here</a></h4>
<p class="excerpt">Text here (Long as long as you want)</p>
<a class="price-botton">Price Here</a>
<a class="booking-botton" href="Link URL Here">Book Now <i class="fa fa-chevron-circle-right"></i>
</a>
</li>
<li class="span3 list-item-6"><figure class="featured-thumbnail thumbnail">
<a title="Title Here" href="URL HERE"><img src="Image URL Here" alt="Title Here"/></a>
</figure>
<div class="clear"></div>
<h4 class="golf-destination">
<a title="Title Here" href="Link URL Here">Title Here</a></h4>
<p class="excerpt">Text Here (Long as long as you want)</p>
<a class="price-botton">Price Here</a>
<a class="booking-botton" href="Link URL Here">Book Now <i class="fa fa-chevron-circle-right"></i>
</a>
</li>
<li class="span3 list-item-7"><figure class="featured-thumbnail thumbnail">
<a title="Title Here" href="URL HERE"><img src="Image URL Here" alt="Title Here"/></a>
</figure>
<div class="clear"></div>
<h4 class="golf-destination">
<a title="Title Here" href="Link URL Here">Title Here</a></h4>
<p class="excerpt">Text here (Long as long as you want)</p>
<a class="price-botton">Price Here</a>
<a class="booking-botton" href="Link URL Here">Book Now <i class="fa fa-chevron-circle-right"></i>
</a>
</li>
</section>
3. If you are ready. Click on Publish button.

WordPress Plugins Installation

Last work you would do is install all WordPress plugins that provided in the folders that we provide in the download folder.

If you would like to install those plugin one by one, you would compress each plugin into a zip file before install it.

There are many other functions in the theme dashboard where you can customize your blog template yourself such as logo, slider, header ads, primary menu,secondary menu, and featured image options.

August 4, 2016

Google Tag Assistant
It would be great if you knew your Google Analytics Code that placed in HTML of your website was an error or blocked tracking analysis. You can not find this problem in your website HTML or in your Google Analytics account. You have the another method to add Google tag assistant that is a Chrome browser extension. You will be allowed install into your browser from the Chrome Web Store.

The Google tag assistant will help you to get verification that you have installed various Google tag correctly on your blog or web page. The tag assistant will tell you the tag are present every time you open the web page. The tag assistant will report all errors that found and suggest to improve all of them. It will work with google products including Google Adwords Conversion Tracking, Google Analytics, Google Tag Manager and more.

How to Add Google Tag Assistant?

Well, go the Chrome Web Store where you can search for the Tag Assistant then add it to your chrome web browser.

Three Different Tag Assistant Color Marks

  1. Green: mean the tag is finding correctly.
  2. Blue: mean that google will suggest how to improve your error.
  3. Red: A technical error. The tag is not tracking properly for most users. You should fix it as soon as possible.
As well as you will see the number of error on the top of you tag assistant screen when you click on the extension icon.

Google Analytics Error

How To Use Tag Assistant To Solve Google Analytics Error?

There are different errors that happen on the different problem that most users are facing. So the most problem that always happen is "Invalid or missing property ID, Premium Content section not found, and No HTTP response detected".

The Tag Assistant extension will guide on when you got an error. Click on question mark gets more detail about the solution.

Missing Web Property ID

July 30, 2016

Google Domains
A long time ago I wrote an article about how to configure custom domain name with blogger blog and a few weeks ago I explained a way to increase the domain authority score.

In this new articles, I will share the another new thing that is most important for bloggers and web developers. That is Google Domains, it is the best choice for all of you that is looking for a good domain name for building a blog or website. 

I knew there are many international and local companies are providing domain name and hosting services but those are some third party suppliers and limited services providers. These below reasons and benefits that you will need to choose Google domains name.

Google Domains


Why Choose Google Domains?

A buyer always thinks about benefits that received from the products that he/she bought from a company. If you a clever buyer, you will think about those company that provides benefits and truth. These are below benefits lists you will get from the Google.


Best Security backed by the Google

As known as Google is a giant company that developed search engine website (google.com), and other services such as Blogger, Gmail, Google Drives, Social Networks (Google Plus), Google map, Google Adsense, Google webmaster tools, Google Analytics, and many other. So Google has enough ability to protect all those services that are providing to the customers.

Private Registration Without Surcharge

The private registration will be offered when you purchase or transfer your existing domain to Google domains without surcharge. This feature is an option that will not display your register information such as your address, name, contact information, and other.

Faster Integrate With Top Website Builders

You can create a website with few website builders such as Blogger, Squarespace, Weebly, Shopify, and Wix. This feature is vary in cost and options include good speed hosting, security, good templates, and other power features such as drag and drop, and mobile friendly management.


Create Email With Domain and Forward It To Existing Gmail Account

In this feature, you will be able to create at least 100 email aliases with your domain name, like info@blogsupporter.com, and forward them to your existing Gmail email address.


Customizable Multi Sub-Domain

At least 100 sub-domains such as convert.blogsupporter.com will allow the users to create within the unique page and within a website.

More than 90 New Domains are including in Google Domain

You will be able to purchase a domain name within more than 90 new domain such as dot world, dot business, dot media, dot network, dot exchange, and dot codes, etc...

These above feature benefits are few that you will get when you purchase Google domains. Moreover, you will get many other functions that can manage your domain name such as Simple domain management tools (manage your domain dynamic DNS, manage resource records: A, CNAME, AAAA, MX, NS, PTR, SOA, SPF, SRV, TXT).

How to Purchase Google Domain?

Recently Google does not allow citizen that are living out of the USA to purchase a domain name from Google Domain unless they have a U.S. billing address, but they can manage the existing domains. 

The US citizen can purchase domain names from Google Domains website where you can search a domain and register to purchase it.

July 28, 2016

Integrate reCAPTCHA with Contact Form 7
If you have a blog or a website, you might be thinking about the contact form that is an easy method to allow your visit contact you faster then they use their email. The contact form needs a tool that can protect from the spam mail that sends to you without permission and the spam emails are very bother your mind.

To protect from the spam mail, you need to use CAPTCHA that will help you to avoid those spam emails problem or spam activities. So it this tutorial I will share you the way to integrate reCHAPTCHA with your contact form 7. To integrate them you have to register both reCAPTCHA and install Contact Form 7 plugin.

To create install Contact Form Plugin you may need this assistance, The Way to Add Contact Form Form WordPress.

Register reCAPTCHA form

What is a Contact Form 7?

Contact Form 7 is a WordPress Contact Form Plugin that allows you to download and install it by free of charge. The Contact form 7 allows you to create and manage multiple forms. You can create forms such as text form, email form, telephone form, reCAPTCHA, file, date, drop-down menu, checkboxes, text area form, radio buttons, acceptance, quiz, and submit button.

What is reCAPTCHA?

reCAPTCHA created, offered, and managed by Google that users can register and integrate with any suitable activities. It is a new system that allows a user to show the personality as human activities before he/she click on the button.

reCAPTCHA

How to Register reCAPTCHA?

  1. Register from Google’s reCAPTCHA admin page.
  2. Register your website in the form that shown above.
  3. Then you will receive a site key and secret key. (The site key and secret key will use to integrate with form you apply).

How to Integrate reCAPTCHA with Contact Form 7?

Note: Before you start a reCAPTCHA integration, you have to install Contact Form 7 into your WordPress website.

  1. Login Wordpress Website
  2. On the dashboard find Contact > Integration
  3. Use the site key and secret key into the reCAPTCHA fields then save them.

Integrate reCAPTCHA with Contact Form 7

Now you ready integrated your contact form 7 with CAPTCHA, then every time you create a captcha in your contact form 7, it will appear a specific one on your form.

July 15, 2016

 Page Level
In the previous posts, I have explained you about how to apply Google Adsense and create Adsense unit to place to your blog and website. So this fresh article I will explain the another thing that will be offering you more benefit from Google Adsense.

I do believe that you might be love mobile temple or responsive template for your blog or website because it has a power for every view on the mobile and let your visitors enjoy with it. The mobile friendly for a website is one that display your website in a correctly on mobile view.

Thus, Adsense page-level is a topic that I will share by today. Add Google Adsense page-level to monetize your ad to effort your website template.


What is Adsense Page-Level?

Adsense page-level is a new kind of ads format that innovative method for you to monetize your website contents. Use the Adsense page-level ads to effort ads on your website and especially for the mobile view. When you use page-level, you can place the same ad code on the same page and many your want, then it will exchange automatically and it optimizes time to show your ads. This performed well for user experiences.

What is the Benefit of Adsense Page-Level?

Why do you need to use Page-level? What benefit you get from this innovative ads?. Well, you will see something change after your add the page-level code into your website HTML. Then the benefit found such as:

  • Provide a new experience to your website visitor. 
  • Stop ads that show more than 3 Units.
  • Good show on mobile page view.
  • Increase your revenue.

Ad Formats For Mobile Friendly

Add page-level ads to your website and blog to get a great page view through mobile. The ad will show full size at the bottom the mobile screen. It optimizes your ads to show them effectively and following to users mobile screen.

Adsense Page Level

How to Setup Page-Level?

Please Following this below guide within few steps to setup page-level while you are on the Google Adsense account or log in your Google Adsense before processing it.
  1. Click on My Ads menu.
  2. Click on Page-level-ads on the left navigation bar.
  3. To allow it works on mobile, please switch the Anchor and Vignette ads function on .
  4. Click on Get Code button to get a code.

Setup Page-Level

How to Add Adsense Page-Level on Blogger Blog?

One you got the Google Adsense Account and place some code it to your website, then you can setup page-level ads for your website. The below guide is a way to setup Adsense page-level.

Step 1: Login Your Blogger Account.

Step 2: Select a blog that you would like to add the code, Then click on Template on the left of the navigation bar.

Step 3: Click on Edit HTML button.

Step 4: Add the page-level code in the Blogger blog HTML: Now you got a code from you setting up page-level then copy it and paste in the head section or below the <head> tag of your blog HTML code area.

Step 5: After added the code in your blog head section then click on Save Template button to change.


How to Add Adsense Page-Level Ads on WordPress Site?

If you are using WordPess CMS, you might need the below tutorial that will guide you to add page-level on the WordPress website.

Step 1: Login Your WordPress Website.

Step 2: When you are on the dashboard of your website. Just reach to the head section <head> tag.

  1. On the left navigation bar, just click on Appearance
  2. And click on Editor
  3. Find out and Click on head.php on the right of the navigation bar.
  4. Paste the page-level code in suitable place (below head section).

Step 3: Everything has done, just click on Update File button.

Adsense Page Level For WordPress

Now you are ready set up and add code to your website, then you will see something change within your ads that added to your website and especially, the add view on mobile friendly.

July 12, 2016

Meta Description.
Meta Description is known by blogger writers, web development, and web designers. It is a most important for search engine ranking for blog and website where everyone can see on the search engine result page. It would be a great ranking on the google search engine if your website has a strong page description on the page.

A young Blogger who is using Blogger CMS, he might be getting stress to find where he/she can create and add a description to their post or page so a blogger should not miss two things to improve SEO on Blogger when you create a post and page. Follow the link I provided to set up meta description on Blogger blog.  And this below guide will intend to help you write a strong meta description.


What is a Meta Description?

The meta description is a message that is intended to provide the user a snippet of what they want to look for on search engine results and it was limited to write 160 characters long that summarizes about the page of content.

The user will meet it in the search result on any search engine website when they use a phrase to search for something then a short snippet show below the page titles. That is a meta description that the webmaster wrote for their page content.

Meta Description Snippet

How to Write a Killer Meta Description?

I still strong believe that a page description will impact search engine rankings. Although, Google said that meta description does not impact search engine rankings in 2007. So I work focus with page description hardly within these below guides.

Limite Length of Meta Descriptions

You can create a meta description tag and write as long as you want, but it will not impact on search engine ranking because the search engine will truncate any longer than 160 characters. So I recommend to write it about 135 to 160 characters length.

Write A Page Description to Match the Content

What are you writing about? Think about it and start to write a page description to match it. Google will find your page description and it tricks the visitor into clicking and score it less but bounce rate will be increasing. So to avoid  the mistake you should write a page description to match your content of a page.

Write a Unique Meta Description

Try to think a unique one or summarize your content avoid copy or duplicate from other websites. The unique meta-description is an effective marketing message reach to visitors and recognize it's quality by the search engine.


Put Keywords Inside It

If you value to any keywords that force you to write the article or a keyword that you are targeting, then put them in your meta-description because Google will highlight the search term in the page description. If your description is strong the page will be ranking.

Take Off Page Description From Un Useful Pages

There are few pages such as contact us page, privacy page, term and condition page, and others that you would think about them and put them in your term. Should you provide a meta description tag to all of them? If you have any pages that are not necessary to live on the search engine you should be provided meta-description to them, then Google or other search engines will hard to find all of them it the search result.

How to Change or Create Your Meta Description

The Meta Description mostly placed in the HTML tag where you can find below <head> tag. If you view page source you found it as below sample one.

<meta content="This is my Sample Page Description for my Webpage" name="description"/>

You are a webmaster or administrator of a website, then you will be able to change or create for your blog or website page. You can use the above sample to place in your website HML if you do not add it yet.


Use Google Webmaster Tool To Improve Duplicate Meta Descriptions

Google webmaster tool is an SEO checking tool that your can use to analysis your website, especially meta description analysis tool. It will automatically check and address you to improve some pages description as well as to improve user experience and performance.

How to Find Duplicate Meta Descriptions in Google Webmaster Tool?

Use this Google Webmaster Tool tutorial to improve your website page descriptions in case they got duplication.

  1. Login To Google Webmaster Tool
  2. On the Google webmaster dashboard just go to Search Appearance
  3. Click in HTML Improvements
  4. In the Meta description navigation will tell you a number of duplicate meta descriptions. 
  5. You got pages that need to customize, then go to your website page and follow this tutorial for customizing its description.

Duplicate Meta Descriptions


Conclusion

Finally, you got to know a way to write a strong meta description and it is importation thing you should focus on your web page with meta description to improve SEO ranking.

If you would like to learn more about basic SEO, then do not forget to get in touch with  our Search Engine Checklist where you can review your SEO score.

July 2, 2016

Instant Articles
Facebook is best social media ever and it is a new world where you can create everything on it as same as you are on the human earth. This is a new of technology earth where you can you can create a teamwork, create a group, make friend with people around the world, make a business, promote your business, and make this world on your hands.

Another hand, we got that Facebook always find everything new for the publishers and especially, for people who are looking for help to make their business grow. 

A Newest feature that Facebook just launched in May 2015 to improving loading speed for article readers and this functional feature was met to the publishers and named "Instant Articles".

On June 29, 2016, Facebook announced a new Functionality that will be added and update for Instant Articles from July 14, 2016. Those feedback buttons are Like, Comment, and Share . They are will be updated automatically from mid of July 2016 to publishers' articles and to media assets embedded within their articles.

However, Facebook provides other functions that allow publishers to remove those buttons from either surface if they do not want to show all of them.

Update to Like, Comment, and Share Functionality


How to Manage Instant Articles Feedback Buttons?

Facebook announced that from 14 July, these feedback buttons such Like, Comment, and Share will be added to all articles, both new  and old. These functionalities are work default for people are using the Facebook App on iOS version 59 and news, the Android version 84 and newer. 

From now on, you can manage those buttons from your publishing tools, by using master controls in Instant Articles central admin. To manage those feedback button for your articles, please follow the steps below:

  1. Click "Publishing Tools" that located at the top of your Page.
  2. Click "Configuration" under Instant Articles on the left navigation bar.
  3. Scroll down a little bit to the "Tools" panel, select 'Feedback Settings,' and set your preferences on showing or not showing the feedback buttons.

Instant Articles Feedback Buttons

We do hope that this articles will help your to understand about Instant Articles helpful, if you do not yet create the helpful feature you should read about how to create Instant Articles for WordPress website.

Create Instant Articles For WordPress
In the previous article, I explained what the Facebook Instant Article is. So in this latest article, I will guide how to sign up the instant article for your blog or website because it will be interacting your visitor's' experience for reading your articles in the News Feed. The Instant Articles App is a new technology that is saving your time to improve speed loading of photos, images, and videos quickly in your mobile app.

Beyond providing a good experience for the article readers, you should create an Instant Articles App and while the Facebook approve your Instant Article Application, you can manage your articles from Content Management System (CMS). Thus, you can provide easier tool to your article readers

Today I would like to share you about how to create Instant Article for WorldPress Blog and Website. So you need to read this article clearly and following the guideline one by one.

How to Sing Up Instant Articles For WordPress Website?

To sign up Instant Articles for Blogger CMS, I would like to recommend you to use a custom domain name for your blog.

Step 1: Install Instant Articles Plugin For WordPress Website

To start creating an Instant Articles you need to download or install plugin Instant Articles for WP from your Wordpress Website dashboard.

Sign up Instant articles


Step 2: Connect the Plugin to Facebook

One you install the plugin, you need to create an Application (APP) on Facebook to contact your Instant Articles to your Facebook page. Then you just need App ID and Secret ID to connect it.

  • Create Instant Articles App

Now go to Facebook Developer Web Page then make sure that you log in your facebook account. Then click on "Add a New App" button and choose for "Website" and to continue please following these steps.

  1. Now click "Skip and Create App ID" button
  2. Provide your App name
  3. Provide Contact Email Address
  4. Choose "App for Page" category
  5. A final step, I suggest to getting in touch with "Create App ID" button.

Create Instant articles

  • Provide Web URL to Facebook App

To allow Facebook App quality your website, you have to provide specific URL to connect your website to your Facebook App.

  1. Go to "Settings"
  2. Click on "+Add Platform"
  3. Select for "Website"
  4. Provide URL in the form
  5. Click "Save Change" button.

Provide URL to Facebook App

  • Publish Your App

Now you are almost done, just go to "App Review" and then publish your App by select "Yes"

Publish Instant Articles App

  • Login Activation

Now it is time to connect your Instant Article plugin to your Facebook app as following steps.

  1. Copy your App ID from your Facebook App then paste it into your Plugin Activation that is on your WrodPress website dashboard.
  2. Click on "Show" button to show your App Secret and then copy it and paste into your Plugin Activation that is on your WrodPress website dashboard.
  3. Click on "Next" button.

Connect Instant Articles Plugin to App

Step 3: Connect Your Instant Article App to Facebook Page

After your click on Next button, you will get a blue button that allow you to login Facebook and select the Facebook Page where you will be published Instant Articles.

  • Select Your Facebook Page (Method 1)

  1. Click on "Login to Facebook" button.
  2. Click on "Continue as ...".
  3. In this step, click on "OK" button to reach to another step.

Completed Activation

Step 4: Claim Website URL

After you have selected the Facebook page, you will be asked to provide your website URL intend to use for articles. The URL your provided is the main one for example blogsupporter.com. To claim URL you need to add a meta tag provided from your registration to your HTML <head> tag.
  1. Go to Your Facebook Page, click on "Publishing Tools"
  2. Click on "Configuration"
  3. Copy meta tag and paste into your HTML <head> tag
  4. Provide your domain name in the URL form
  5. Click on "Claim URL" button to submit.

Claim Website URL for Instant Article

Step 5: Create Articles by RSS Feed

Facebook found that publishers need a tool to publish articles to the web and mobile application for readers. Thus Instant Articles will publish directly from your Content Management System (CMS). So you can sync your website and blog with Instant Article through Facebook's publishing tool, as RSS Feed or by and API and below are tutorial for Blogger and WordPress Management System (CMS).

Now please kind review from step 1 to step 4 and make sure that all steps are successfully completed, otherwise, you will bet get this step.

  1. Click on Production RSS Feed
  2. Provide feed/instant-articles after your web URL
  3. Click "Save" button.

Create Articles by RSS Feed

After your submit your RSS feed, it will under review for 3 to 5 days and then it will be a magic after they approve your application.

Step 6: Customize Styling

Everything is done from step 1 to step 5, and this is the another option that you can customize or create a new template style for your application. This style allows you to change font size, font color and upload your logo for your App.

Instant Articles Style

These are all results that I am sharing with you about how to create Instant Articles for WordPress website and I do hope that you will be acknowledged for these 6 steps to getting Instant Articles for your website.