Tampilkan postingan dengan label BloggerPages. Tampilkan semua postingan
Tampilkan postingan dengan label BloggerPages. Tampilkan semua postingan
8/31/2017

Brand your Blog's Social Media Presence: Top 5 Tips!

View Article
From a blogging perspective, social media traffic is one of the most targeted traffic available. Best News - It’s FREE!!! Internet marketers and bloggers now widely employ social media marketing strategies to tap into targeted traffic streams from social networks like Facebook, Twitter, and Google+.
As a blogger, it is absolutely necessary to have social media profiles. It is even more essential to make sure all your social media profiles look consistent. Your profile has to speak about what you offer your readers and why they should start following you.

When profiles match up, it helps cement a clear picture of you in the minds of readers. The fewer the variations in your profile, it becomes easily memorable. For this purpose, you should maintain the same name, bio, and avatar across all your social profiles.

Handle

All the sites, let you select a handle, make sure it’s unique, matches your brand name. Reserve your name on all social channels. You can enter your desired username into Knowem to see its availability on over 25 of the most popular social networks. If it isn’t possible for you to get the same username, come up with a standard variation to use in the case that your first choice is already taken.
  • Twitter: @randomtyms
  • Facebook: @randomtyms

Name

Choose a brandable name that is as close as possible to your blog’s name and clearly shows its personality. Use a consistent name on all social profiles - First name and Last name is the standard. Don't deviate too much from your blog’s name and don't pick a complicated replacement either. Do your best to avoid nicknames, shortened names, etc., unless you use the variation consistently.

URL

Match your social profiles' vanity URL with the title of your page to strengthen your brand recognition. Through personalized vanity URLs, you can establish your brand presence and forge a solid brand identity. Such personalization will hugely improve the findability of your blog profile in search engines. Adding vanity URLs to your social media accounts can help your brand to rank higher in organic search results. Make sure you mention your site URL or a landing page URL to let those profile viewers know more about you and your business.

Avatar

To help your readers create a memorable impression about your blog, your avatar image should be unique and same on all social profiles. Prefer to use your Logo and take care of color combination for better exposure. Make sure to keep a note of maximum allowed size for image in all social networks. As you build your personal brand, this will be a great way to influence a person's decision to interact with you

Tagline

A tagline adds insight into your blog’s personality and content that is integral to your brand. Come up with a catchy, unique tagline/bio. Your tagline/bio on your blog header is usually the first thing visitors see the moment they arrive at your blog. Here are 2 factors to consider before creating an outstanding tagline for your brand. Your blog’s keywords and it's focus.
  • Keyword Headline - Make an accurate & targeted description using Keywords for your blog.
  • Power Statement Headline - Pick one interesting fact / feature about your blog.
The basic goal is to be the blog whose content will be considered authoritative by the audience. Higher the brand visibility is, higher is the online presence of a blog. Follow these 5 tips to create an authentic social presence for your Blog. Build your online brand presence and authority.
8/07/2017

Facebook Instant Articles for Blogspot: Step-by-Step Instructions

View Article

Are you designing/managing blogs? Do You Know Google's alarming estimate - “53% of mobile site visits are abandoned by users, if the pages take longer than 3 seconds to load!”?
Major platforms have deviced their own ways to tackle the problem of mobile loading speed. Apple has deviced Apple News, Google has introduced Accelerated Mobile Pages and finally Facebook has made use of Instant Articles to solve this issue. How can Bloggers address this serious concern and benefit from the above mentioned solutions?
Blogger (Blogspot) users can rely on this article to convert your blog into an AMP one. While Accelerated Mobile Pages can speed up your website browsing experience, Instant Articles can drive referral traffic from Facebook.
Implenting both can be equally important, so start publishing Instant Articles immediately. Instant Articles are simply mobile versions of webpages, that load fast because of Facebook hosting. It makes use of the same technology used by the Facebook mobile app to quickly load images and videos. According to Facebook, Instant Articles loads mobile articles up to 10 times faster, increases readership by 20 percent, reduce bounce rates by 70 percent and increase sharing by 30 percent.
FIA = Facebook Instant Articles

Pros of Using Facebook Instant Articles:

  • The best thing about Instant articles by Facebook is that it's FREE.
  • FIA gives full freedom to design and brand your content.
  • FIA enjoys all the benefits of Facebook’s EdgeRank and improve the traffic.
  • FIA entices your site traffic by providing faster, seamless experience with interactive features.
  • FIA increases your social signal through boosted user sharing prompted by better user experience.
  • FIA's Content Monetization options - 100% of the ad revenue from direct-sold ads & 70% of the revenue generated from Audience Network.

Cons of Using Facebook Instant Articles:

  • Facebook limits the number of ads delivered through FIA.
  • Third-party advertisers are restricted and this may incur a drop in the revenue
  • Facebook might restrict the number of images & videos on your FIA to decrease the loading time of your content.
  • Any widgets within the article, will no longer appear on your FIA.
  • Any widgets, advertisements or information in your sidebar will not reach your audience.
  • Most shortcodes and custom fields will not be displayed in your articles.
Note: Facebook Instant Articles run only on mobile devices. Must-Have: Facebook for Iphone-version-30 (and IOS 7.0 or above) and Facebook for Android-version-57 (Jellybean or above).

How to get Instant Articles on Facebook?

  • Step 1: Go to this website to create Facebook Instant Articles - https://instantarticles.fb.com/.
  • Step 2: Click Sign Up.
  • Step 3: To enable Facebook Instant Articles, choose the appropriate Facebook page. If you don’t already have one, Create Page - https://www.facebook.com/pages/create.
  • Step 4: Check the box to agree to the Terms and Conditions of using Instant articles.
  • Step 5: Click the “Access Instant Articles Tools” button.
  • Step 6: There will be pop up there, all you have to do is click “Continue”.
Result: It will take you to your page that you selected in the previous step. You will notice that your Publishing Tools now has Facebook Instant Articles section. You now need to authorize your website to be able to import instant articles (ie) prove the ownership of your site.

How to get Facebook Instant Articles for Blogger?

Ever since Facebook opened up Instant Articles to publishers of any size, anywhere in the world, it has become one of the top referrers of traffic to news sites and blogs of all sizes. Traffic analytics company Parsely had revealed that Facebook had even overtaken Google as the number 1 referrer of traffic to news sites. Let us use it to the advantage of the Bloggers making use of Blogspot domain.
  • Step 1: Click on "Authorize your site" link. Facebook will scroll you to the Tools section.
  • Step 2: Click the “Connect Your Site” and copy the meta tag specific to your blog.
  • Step 3: Go to your Blogspot Dashboard and click Theme.
  • Step 4: Click Edit HTML and put the meta tag in the <head> section and click Save.
  • Step 5: Go back to Facebook Publishing Tools and enter your domain in URL.
  • Step 6: Click “Claim URL” button.

How to get Facebook Instant Articles RSS for Blogger?

Blogger provides a robust RSS feeds page by default for each blog that you create. This step is to add your blog's RSS Feed link to Instant Articles, so it can automatically fetch information about the articles when they are published on your site. All you have to check is whether RSS Feeds are turned on your Blogger site and are set to Full.
  • Step 1: Click the tab Production RSS Feed.
  • Step 2: Put this RSS Feed - https://yourblogname.blogspot.com/feeds/posts/default?alt=rss.
  • Step 3: Then Click Save.
  • Step 4: Go to Blogger Dashboard >> Your Blog >> Settings >> Others >> Site feed >>.
  • Step 5: Make sure "Allow Blog Feed" is set to Full.

How to Stylize your Instant Articles template?

FIA is centered around delivering a high-quality experience to the user—with fast load times and interactive visuals. Style templates allow you to customize the look and feel of your Instant Articles. These Article Templates can be used to mirror the look and feel of their blog brand.
  • Step 1: Click Styles and click default or click on "add styles" to create a complete design of your own.
  • Step 2: Decide what design of font and color you want and customize your style .
  • Step 3: Upload your blog's logo, which must be a transparent PNG file of minimum dimensions - 690px width & 132px height.
  • Step 4: Upon uploading the Logo and Completed customising your style, click Save, and then click Close.

How to Submit Your Instant Articles for Review?

Before you can submit your Instant Articles for review, make sure that there are at least 5 Instant articles in your Production library. An Instant Article is a streamlined copy of an existing blog post and is indexed with the blog post's canonical URL. You can create the sample articles either manually by using the provided examples as templates or automatically by connecting your blog's RSS feed.
  • Step 1: Go to your Facebook page and click on Publishing Tools.
  • Step 2: From your left menu, click on ‘Configuration’ under Instant Articles.
  • Step 3: If there are no Auto-generated errors, you will be able to Submit your Instant Articles for Review.
  • Step 4: Click on "Submit for Review" to send your feeds for reviewing.
Result: It will normally take 1-3 business days to get a reply from Facebook review team. Once the team fully approves your Instant Articles, you will be able to start publishing your Instant Articles.
1/30/2017

Blogger Conditional Tags: Make your Blog Dynamic

View Article
The XHTML of the Blogger blog lets us edit the Template and make it Dynamic. We have already seen the different pagetypes that blogger has and the various conditional tags that could be used with it accordingly in those pages in this post - 7 Blogger Pagetypes: The Most Used Conditional Tags.


We'll now check out some additional conditional tags.

1. Waiting to implement a functionality only in the Homepage?
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!--Homepage-->
</b:if>

2. Want to add buttons only in the Post pages & Static pages?
<b:if cond='data:blog.url == data:post.url'>
<!--Post and Static Pages->
</b:if>

3. Ready to do specific change only in one specific post/page?
<b:if cond='data:blog.url == "URL"'>
<!--Specific Page-->
</b:if>

4. Wish to have a job done in all-pages except post-listing-pages?
<b:if cond='data:blog.pageType != &quot;index&quot;'>
  <!-- all pages NOT index pages -->
</b:if>

5. Do you have any multi-conditional function to do?
    No problem. Blogger has its own special <b:if> and <b:else/> tags.
<b:if cond='CONDITION-CODE-1'>
<!--..Action-Code-1...-->
<b:elseif cond='CONDITION-CODE-2'/>
<!--..Action-Code-2...-->
<b:else/>
<!--..Default-Action-Code...-->
</b:if>

6. Would you like to perform AND/OR operations anywhere?
    Solution is here. Blogger makes use of AND/OR operators in the conditional tags.
<b: if  cond='CONDITION-CODE-1 && CONDITION-CODE-2'>
<!--..Action-Code...-->
</b: if >
<b: if  cond='CONDITION-CODE-1 || CONDITION-CODE-2'>
<!--..Action-Code...-->
</b: if >







7 Blogger Page Types & Most Used Blogger Conditional Tags

View Article
Identifying Blogger page types is very effective in designing, different Layouts for different Types of pages and placing Page-specific meta tags.

Below are some of the common Blogger conditional tags formats that can help make a blog Dynamic and Awesome. So,

What are the Blogger Page Types? 
Archive Pages,
Index Pages,
Item Pages,
Static Pages,
Error Pages,
Label Pages &
Search Pages.

Lets now checkout the use of conditional tags with each Blogger page type.

1. Archive Page

Blogger pages added by Archive widget that normally has “_archive.html” ending in its URL belong to Archive page type.
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
...CODE...
</b:if>

2. Index Page

Blogger pages with a list of posts are normally called Index pages. Eg - Homepage and Search result page.
<b:if cond='data:blog.pageType == &quot;index&quot;'>
...CODE...
</b:if>
Example - https://amprandom.blogspot.in/search/label/BloggerPages

3. Item Page

Blogger posts created by clicking new post button are called Item pages.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
...CODE...
</b:if>
Conditional Tag for First Blogger post alone
<b:if cond='data:post.isFirstPost'>
...CODE...
</b:if>
Example - https://amprandom.blogspot.in/2017/01/ban-jallikattu-ban-pongal-ban-tamil.html

4. Static Page

Blogger pages created by clicking new page button are called Static pages.
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
...CODE...
</b:if>
Example - Using one such conditional Tag, I've converted one of my Static Pages into Home Page.
HomePage URL: https://amprandom.blogspot.in/
Static Page URL: https://amprandom.blogspot.in/p/random-tyms.html

5. Error Page

Blogger pages can be redirected to Error pages when directed to non-existent URLs.
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
...CODE...
</b:if>
Example -
Correct Page: https://amprandom.blogspot.in/2017/01/ban-jallikattu-ban-pongal-ban-tamil.html
Error Page: https://amprandom.blogspot.in/20177/01/ban-jallikattu-ban-pongal-ban-tamil.html

6. Label Page

Blogger label-based pages contain similar or related posted articles.
<b:if cond='data:blog.searchLabel'>
...CODE for all Label Pages...
</b:if>
Specify Label Name in the conditional statement.
<b:if cond='data:blog.searchLabel== &quot;LABEL_NAME&quot;'>
...CODE for specific Label Page...
</b:if>
Example - Label Name: FunPages
https://amprandom.blogspot.in/search/label/FunPages

7. Search Page

Blogger pages that provides a list of posts that matches the given query terms.
<b:if cond='data:blog.searchQuery'>
...CODE for all Search Pages...
</b:if>
Specify Search Query in the conditional statement.
<b:if cond='data:blog.searchQuery == &quot;SEARCH_QUERY&quot;'>
...CODE for specific Search Page...
</b:if>
Example - Search Query: Indian
https://amprandom.blogspot.in/search?q=indian

Happy Blogging! Also check out - Blogger Conditional Tags: Make your Blog Dynamic
1/21/2017

AMP Social Share for Blogger - Updated (Twitter, Google, Facebook & Whatsapp)

View Article

Social Media & SEO

Why should you think about Social Media when designing your blog's SEO strategy? Social Media is the new SEO, an important part of a Brand’s online presence. Let me explain the how part?

SEARCH part- People nowadays use social media channels to find the latest news on the topic they're most interested in. For example, People active on Twitter can possibly discover their favorite blog's newest content just by searching for tweets with Twitter’s search engine.
SEO part - The number of times a blog's page has been retweeted on social media help search engines understand that the blog is credible and should be ranked for keyword phrases. This is how social link can boost your blog's search rank, when implemented properly.

Step 1: Create Social profiles to boost SEO

Social Media & Blogger

How to get the most out your blog posts on social media? Social media sharing is not as easy as everyone imagines it to be. It requires quite a bit of effort to do more than simply sharing every blog post on social media and implementing social sharing buttons on your blog..
Identify your target readers and then identify the social networks that your readers prefer.
  • Twitter: Identify relevant and popular hashtags for your blog post.
  • FaceBook: Blogs should have their own Facebook page and share posts with Groups.
  • Google+: Join relevant  Google+ communities and share your blog post.
Step 2: Implement Social sharing to get the most out of Blogging

SEO & AMP

How will Google AMP affect search results? A better, faster mobile web is better for both users and publishers.
Google says 40% of users will abandon any website that takes more than 3 seconds to load. Normal mobile pages often take at least 8 seconds to load.
AMP is Google's easy way for publishers to distribute content on the open web. AMP is still not a Google ranking factor(yet!) but it can still affect impressions, clicks, & user experience, this will in turn affect SEO.

Step 3: Consider AMP to stay in trend with the Blogging world.

AMP & BLOGGER

What makes your blog's mobile pages load slowly? Imagine this scenario -
Your blog gets pulled into a mobile browser → Several dozens of packets of information (Scripts for social shares, images, videos and more..) get called from different hosts → However costly the mobile device is, it may not have the processing power to load a desktop site in a blink → Mobile screen bounces as the browser sets and resets repeatedly → You need to redesign your blog specifically for mobile. 
Here comes AMP (Accelerated Mobile Pages) with all the required help.

Step 4: Implement Social share in your AMP Blogger and Increase pageviews dramatically.

Code for Social Media Buttons

Step 1: The amp-social-share component will have to be added in the header.
<script async='async' src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js" custom-element="amp-social-share" ></script>
Step 2: Add a Layout gadget element and introduce this code.
<div id='social-share'><br/>
<amp-social-share height='35' type='twitter' width='35'/>
<amp-social-share height='35' type='email' width='35'/>
<amp-social-share height='35' type='gplus' width='35'/>
<amp-social-share data-param-app_id='APP_ID' expr:data-param-href='data:blog.canonicalUrl' height='35' type='facebook' width='35'/>
      <b:if cond='data:blog.isMobileRequest'>
<amp-social-share height='35' type='whatsapp' width='35' data-share-endpoint='whatsapp://send' expr:data-param-text='&quot;Checkout - &quot; + data:blog.pageTitle +  data:blog.canonicalUrl'/>
      </b:if>
</div>
And it's DONE!

Parting Note - Be on social media — even when it's not driving traffic because Just spending time on social media platforms is great way to forge relationships. Keep up on Industry News and find Inspiration for your next blog post.
11/24/2016

AMP Whatsapp Share Button for Blogger - Working Code

View Article
Mobility has become the predominant medium today that's enabling global digitization transformation. The worldwide mobile phone penetration rate is estimated increase quickly and by 2020 almost 5.4 billion people will own handsets.

In the past (2015) worldwide mobile data traffic added to 3.7 exabytes/month, but by 2020 it is expected to reach 30.6 exabytes/month globally.

People are sharing stuffs with each other easily and frenzily, with the help of Social networking share buttons. Fast rendering, mobile friendly Accelerated Mobile Pages (AMP) are all craze now.
Since WhatsApp has witnessed the rise in its popularity as the most popular communicator, it is important for Bloggers to tap the potential of WhatsApp to improve their mobile traffic. Let us implement AMP Whatsapp share button in this tutorial.

Step 1: The amp-social-share component will have to be added in the header.
<script async='async' src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js" custom-element="amp-social-share" ></script>
Step 2: Add a Layout gadget element and introduce this code.
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<amp-social-share data-share-endpoint="whatsapp://send" expr:data-param-text="&quot;Check out - &quot; + data:blog.canonicalUrl" layout="container" type="whatsapp">
<amp-img alt="Share via Whatsapp" height="45" layout="fixed" src="https://4.bp.blogspot.com/-s01eXv7QD7c/WDbCtAgPNfI/AAAAAAAAANI/nhPCcHw7v1AsdocgpoNxl_86rTGOBKn7wCLcB/s1600/whatsapp-256.png" width="45">
</amp-img></amp-social-share>
</b:if>
Step 3: You'll get a whatsapp share button like this visible when the page is viewed through mobile -
11/21/2016

Easy Fix 1 - Blogger BlogId and PostId Structured Data Errors

View Article

Error:
 Page contains property "blogid" which is not part of the schema.
 Page contains property "postid" which is not part of the schema.

These are common errors returned when Bloggers test their markup with Google's Schema Testing Tool. These properties, blogId and postId are not recognized as schema properties. However these errors may not cause any issue for displaying Rich Snippets.


Bloggers can safely ignore any errors in connection with PostId and BlogId properties. But it is a little concerning when most Bloggers delete these attributes because they are more essential indexing items in Blogger. Values of blogID and postID are made use when a Post is edited/displayed and also in recovering a deleted Post. Can we not fix the postId and blogId errors without actually removing it?

Definitely Possible in just 3 Simple steps.

Step 1: Find the Keyword position -
Use the shortcut CTRL+F → data:blog.blogId . You may find this keyword in 2 places. Do the following change in both the places.

Step 2: Introduce and Comment the Existing Markup -
Existing markup to be commented -
<meta expr:content='data:blog.blogId' itemprop='blogId'/>
<meta expr:content='data:post.id' itemprop='postId'/>

Step 3: Paste the Proposed Markup below the commented code -
Proposed markup to be pasted -
<meta expr:content='data:blog.blogId'/>
<meta expr:content='data:post.id'/>

Now use the Structured Data Validator Tool to check the Error. It's Gone.
For 100% Fix to Structured Data Errors in Blogger refer the corresponding article.
Blog Google Friendly.
11/16/2016

Blogger Template: Add Twitter Cards

View Article
Want your Twitter audience to Click, Open and Read your blog post, Sign up for your Email list - Straight from a single Tweet? Give them rich media experiences, not just a tweet’s standard 140-character written message. Implement Twitter Cards in your Blogger Template.


What are Twitter Cards? 

Twitter Card = A Photo and Article Summary
They travel alongside your blog, automatically adding media and information about your blog or posts in tweets. This article should -

  • Give you an understanding about card type that best suits you 
  • Help you set up Twitter cards for your blog and verify them 
  • Make your Blog's Twitter cards stand out from the crowd 

1. Twitter Card Types 

  • Summary Card - Title and description, Image thumbnail, and Twitter attribution. 
  • Summary Card with Large Image: A Summary Card with image prominently featured. 
  • App Card: Details an mobile app with download feature. 
  • Player Card: This Card can provide video/audio/media. 

2. SetUp Twitter Cards 

A picture is always an eye-catching addition. Let us implement Summary Card with Large Image for our Blogger posts.

3. StandOut from Crowd

 Alas! We've reached the final important point. How to prepare your tweets stand out from the crowd and get the Clicks?

  • Write a Unique, Attention stealing tweet. 
  • Make your Title SEO Optimized. 
  • Choose an Attractive, Optimized Image. 

You are all set. Write, Post and Share. Go!