Google Calendar Events in Google Maps

The latest version of the Google Maps app for Android adds more integration with Google Calendar. There's a new upcoming tab in "Your places", which shows a list of upcoming events, including your bookings and reservations from Gmail. Click an event to quickly see the location on the map.

There's also a new "personal content" section in the settings, which lets you disable the integration with Google Contacts, Google Photos, disable location, location history and search history.

Read More

The Keyword: Google's New Unified Blog

Google has a new blog that merges 19 of its most popular blogs, including the Official Google Blog, Gmail's blog, Google Drive blog, Chrome's blog, Android's blog and more. You can find it at blog.google and it's called The Keyword.

"We wanted to make it easier for people to find news from Google about what we're up to. With that in mind, today we're launching the Keyword — a new destination for the latest news from inside Google, from Android to Translate. The Keyword is all the stuff we had across 19 blogs, in one place — so you don't have to hop from one blog to another to find the latest update. If you're looking for something from Google from now on, chances are it's here," mentions Emily Wood.

The most interesting thing about this change is that Google abandoned Blogger and uses a completely new blogging platform. There's a section that showcases the latest tweets from Google's main Twitter accounts, a list of the latest stories and news. You can filter blog posts by Google product or by topic and you can use the same filters for search results too.

Read More

Mobile Google Tests Trending Searches

Bing has a cool feature: just click the search box and you get a list of trending searches. Google has been testing a similar feature this year in the mobile search interface. It started as an experiment in the Google Search app for Android back in January and now I noticed the same experiment when visiting Google.com in Chrome.

Google shows 5 searches that are currently popular and most of them seem to be related to recent news. Obviously, Google's results include a lot of news articles.

"The difference between trending and normal auto-complete is basically the difference of showing search suggestions based on years of query history vs the past 48 hours of search query history (in the most simplistic way)," says Barry Schwartz, who reported about this last month.

Read More

How to Hide Posts from Blogger Homepage

The point of blogging is to make your blog posts visible to your target audience as well as to search engines. However, there are times when you need to hide certain blog posts from homepage. For instance, one post may contain outdated information, so you don't want it to be seen by your audience but you also want to keep it on your site for records purposes. Or perhaps you want a certain post to still be seen on your blog, but you don't want it to show in the home page.

Either way, you have to find ways to hide certain blog posts. Fortunately, if you're using Blogger, you can easily do so by taking a few simple steps. You can use this guide to get started.

Backdate Blogger Posts

Let's discuss this technique first since it's simple and doesn't require you to deal with any lines of code. Basically, the only thing you need to do is to change the publishing date of the post you want to hide; specifically, you need to backdate it to the oldest possible date. Doing this is effective if your Blogger site is configured to show the latest posts first (as most blogs are); once a post is backdated, it will no longer be shown in the home page.

How do you do this? If you're publishing a new post and want to hide it, look for the "Schedule" option on the right side of the post editor and click on "Set date and time". Choose a previous date on the calendar, click 'Done' and Save the post, then go back to your blog's home page to check if the post has disappeared.

The same process applies if you want to hide an older post; the only difference is that you need to click on the post's title in the dashboard to open it in the editor. Backdate the post using the steps above and save it, then open your blog to verify that the post is indeed hidden from view.

Please note that this process will only hide your posts from the homepage. People will still be able to see them if they'd take the time to go through your blog posts from the previous years. This is also the case for those who'd come across your hidden blog post through search engines.

Hide Blog Posts in Blogger Using Code

Another thing you can do to hide a blog post is to edit its code. This is a bit complicated since one small mistake can affect the post structure and make it unreadable. This, in turn, can affect your readers' experience as they browse through your site and even have a negative effect on your search engine optimization techniques. With this in mind, it's important to be careful when dealing with code.

Method 1: Hide Blogger Post Using the Post's label

There are two techniques to choose from, and one of them involves the label of the blog post you want to hide. If you're ready to go ahead with this method, you'll first need to make a backup of your template. Having a backup is important since it ensures you'll have a copy to fall back on in case something goes wrong.

Once you've backed up the template, go to "Templates", click on "Edit HTML" and then click anywhere inside the code area -> press CTRL + F keys and search for this line:

<b:include data='post' name='post'/>

Once you've found it, replace it with this code:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:loop values='data:post.labels' var='label'>
        <b:if cond='data:label.isLast == "true"'>
            <b:if cond='data:label.name != "add label here"'>
                <b:include data='post' name='post' />
            </b:if>
        </b:if>
    </b:loop>
<b:else/>
    <b:include data='post' name='post' />
</b:if>

Note: replace the text "add label here" with the label (case sensitive) of the blog post that you want to hide in Blogger homepage. Keep in mind that above code won't work if you have multiple labels on that post, so please make sure the post has only 1 label.

Important: every post that you want to show on the homepage should have at least one label otherwise they will not be visible because the b:loop statement won't be executed for them.

Finally, Save the changes by pressing the 'Save template' button on the upper left side of the editor, then view your blog to check if the blog post has been hidden.

Method 2: Hide Blogger Post Using the Post's ID Number

Aside from the method above, you can use another technique that involves the post ID number of the blog post you'd like to hide. To know the ID number, you must go to the dashboard area, find the title of the post you want to hide, and click the "Edit" text link below it. Doing this will open the post in the Blogger editor.

Once you're in the editor, click on the address bar above and go to the end part of the URL. Here, you'll see a line of text that looks like this: postID==, followed by a long string of numbers. This is your post's ID number. The ID number usually contains 19 numbers, so it will look somehow like this: postID==1234567890123456789. Copy this ID since you'll need it for the next step.

When you have your blog post's ID, open the Blogger dashboard, go to Template, and click "Edit HTML". Search for this line:

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

Replace it with this one:

<div class='post hentry uncustomized-post-template' expr:id='&quot;post-&quot; + data:post.id' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

Note: if you found two occurrences of it, replace both of them.

Now search for this tag:

</head>

Once you find it, paste the following code above it:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
#post-1234567890123456789{display:none;}
</style>
</b:if>

Don't forget to replace "1234567890123456789" with the 19-digit ID number of the blog post you'd like to hide. Once you're done, make sure to save the template. You can open your blog in another tab or browser to check if the post has indeed been hidden.

That's it!

Whether you backdate your post or opt for the post ID method, you have to remember that the blog post you've hidden is still on your website. This means that it will still be indexed by search engines, show up on search engine results, and get found by people who are searching for the keywords that are present in the post. If you really want this blog post to be seen by no one, you'll need to use robots.txt (for Google) to remove it from search results. Better yet, completely delete the post from your Blogger dashboard and just keep a soft copy of it in your computer.

Read More

Google Destinations, Now for Desktop

Google launched the "plan a trip" feature for mobile phones back in March and now it's available in the regular desktop interface, as well. "Destinations on Google helps you discover and plan your next vacation, right from Google Search," informed Google.

Search for a continent, a country or state you'd like to visit and the Knowledge Graph card has a "plan a trip" section which includes a travel guide, information about hotels and upcoming events.

The travel guide link sends you to a new Google Destinations site which shows beautiful photos, a short description of the place, links to Google Flights, Google Hotel Finder, a trip planning feature, a list of suggested itineraries, top sights, videos, related places, information about climate and the most popular months to visit the place you picked.

Google displays a list of popular itineraries which are generated from the historic visits of other travelers.

The trip planning feature is quite clever. Google shows "highs and lows for the next six months, so you can find the right price tag for you. And as you slide left or right, the results instantly update with real-time fares and rates, pulling from the trillions of flight itineraries and hotels we price every day on Google Flights and Hotel search. You can also customize results further with flight and hotel preferences, including number of stops, hotel class, and number of travelers."

Google Destinations also works for queries like [asia destinations], which shows popular destinations and lets you filter them by interest: beach, culture, golf, hiking, nature, scuba diving, shopping, skiing, wildlife.

{ Thanks, Mukil Elango. }

Read More

New Original Message UI in Gmail

Gmail has a new interface for displaying the raw version of a message. If you click the arrow icon next to "reply" and then "show original", you'll see a list of headers like "message ID", "from", "to", "subject", "SPF", "DKIM", a link for downloading the message and then the actual text of the message. Until now, Gmail only displayed the text of the message.

The new interface also displays help center links with additional information about SPF records, DKIM signatures and the DMARC standard. All of these values are useful for identifying spoofed email messages, which forge the sender address.

{ Thanks, Dirk Zaal. }

Read More

Add Load More Posts or Infinite Scrolling to Blogger

You might have seen the implementation of infinite scrolling at Facebook, Twitter or Google+. Instead of showing Older / Newer posts links, we can load posts dynamically whenever a "Load more posts" button is clicked, or by scrolling down the page. This tutorial will show you how to implement Ajax based loading script that will add Load More Posts or Infinite Scrolling to Blogger, so that visitors can easily navigate without reloading the page.

How it works?

- You have the option to add a 'Load More Posts' button or load automatically the older posts as visitors scroll down the page.
- Once implemented, Load More Posts / Infinite Scrolling applies to all Blogger posts on index pages (homepage, archive, label pages). It can't be added on individual posts.

Demo

To see it live, check out the demo below. When you scroll down to the bottom of the page, you will see the "Load More Posts" button. Once you click it, the next 3 posts set to display will load below.

Demo

Adding Load More Posts or Infinite Scrolling to Blogger

1. Log into your Blogger account and click on your blog where you want to add it.
2. Go to 'Theme' and click the 'Edit HTML' button to open the Template editor > click anywhere in the code area and press CTRL + F keys (or Command + F) to open the search box.

3. Type the tag below in the search box and press ENTER to find it:

</body>

4. Just above the </body> tag, add the script below:

a. If you want to load posts with 'Load More Posts' button like in the demo blog, add this script:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js'/>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'><b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(e,n){for(var t=document.getElementById(e).getElementsByTagName("img"),a=0;a<t.length;a++)t[a].src=t[a].src.replace(/\/s72\-c/,"/s"+n+"-c")}window.labelfx=function(){var e=function(e){var n=e||{},t=n.url_blog||window.location.host,a=n.id_labelcontent||"#labelfxn";$.ajax({url:"http://"+t+"/feeds/posts/summary?max-results=0&alt=json-in-script",type:"get",dataType:"jsonp",success:function(e){var n=e.feed.category,t="";if(void 0!==n){t="<ul class='labelx'>";for(var i=0;i<n.length;i++)t+='<li><a href="/search/label/'+encodeURIComponent(n[i].term)+'" target="_blank">'+n[i].term+"</a></li>";t+="</ul>",$(a).html(t)}else $(a).html("<span>No Label!</span>")},error:function(){$(a).html("<strong>Error Loading Feed!</strong>")}})};return function(n){e(n)}}(),resizeThumb("main",250),labelfx(),function(e){function n(n){e.getScript("http://"+n+".disqus.com/blogger_index.js")}function t(){s||(s=!0,o?(r.find("a").hide(),r.find("img").show(),e.ajax(o,{dataType:"html"}).done(function(t){var a=e("<div></div>").append(t.replace(l,"")),i=a.find("a.blog-pager-older-link");i?o=i.attr("href"):(o="",r.hide());var p=a.find(d).children(".date-outer");e(d).append(p),resizeThumb("main",250),window._gaq&&window._gaq.push(["_trackPageview",o]),window.gapi&&window.gapi.plusone&&window.gapi.plusone.go&&window.gapi.plusone.go(),window.disqus_shortname&&n(window.disqus_shortname),window.FB&&window.FB.XFBML&&window.FB.XFBML.parse&&window.FB.XFBML.parse(),window.twttr&&window.twttr.widgets&&window.twttr.widgets.load&&window.twttr.widgets.load(),r.find("img").hide(),r.find("a").show(),s=!1})):r.hide())}function a(){if("item"!=_WidgetManager._GetAllData().blog.pageType&&(o=e("a.blog-pager-older-link").attr("href"))){var n=e('<a class="loadpost" href="javascript:;" style="text-decoration:none;font:11px Open Sans, sans-serif;letter-spacing:1px;padding:10px 20px;background:#000000;color:#ffffff;">LOAD MORE POSTS</a>');n.click(t);var a=e('<img src="'+i+'" style="display: none;">');(r=e('<div style="display:block;text-align:center;margin:20px auto;"></div>')).append(n),r.append(a),r.insertBefore(e("#blog-pager")),e("#blog-pager").hide()}}var i="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyfyFJqQFDvZikXevF1alLlMA7HutfoNS91uE4koFM2NNxbHhZsbDccakXwLkjaqJAOoiVrq6tooaJI38QnmVXaKvNPhCz1LXhYgXdRit1CIYSMGkXplv3H02MrSAweS3bE6U2i5afqysG/s1600/loader.gif",o="",r=null,d="div.blog-posts",s=!1,l=(e(window),e(document),/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi);e(document).ready(a)}(jQuery);
//]]>
</script>
</b:if></b:if>

b. If you want to add the infinite scrolling without button, paste this instead:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js'/>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'><b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type="text/css">.status-msg-wrap{display:none;}</style>
<script type='text/javascript'>
//<![CDATA[
!function(i){function e(e){i.getScript("http://"+e+".disqus.com/blogger_index.js")}function t(){g||(g=!0,r?(w.find("a").hide(),w.find("img").show(),i.ajax(r,{dataType:"html"}).done(function(t){var n=i("<div></div>").append(t.replace(c,"")),o=n.find("a.blog-pager-older-link"),d=n.find(s).children();i(s).append(d),window._gaq&&window._gaq.push(["_trackPageview",r]),window.gapi&&window.gapi.plusone&&window.gapi.plusone.go&&window.gapi.plusone.go(),window.disqus_shortname&&e(window.disqus_shortname),window.FB&&window.FB.XFBML&&window.FB.XFBML.parse&&window.FB.XFBML.parse(),window.twttr&&window.twttr.widgets&&window.twttr.widgets.load&&window.twttr.widgets.load(),o?r=o.attr("href"):(r="",w.hide()),w.find("img").hide(),w.find("a").show(),g=!1})):w.hide())}function n(){return Math.max(p.height(),l.height(),document.documentElement.clientHeight)}function o(){n()-(p.scrollTop()+p.height())<150&&t()}function d(){if("item"!=_WidgetManager._GetAllData().blog.pageType&&(r=i("a.blog-pager-older-link").attr("href"))){var e=i('<a href="javascript:;">Load more posts</a>');e.click(t);var n=i('<img src="'+a+'" style="display: none;">');p.scroll(o),(w=i('<div style="text-align: center; font-size: 150%;"></div>')).append(e),w.append(n),w.insertBefore(i("#blog-pager")),i("#blog-pager").hide()}}var a="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyfyFJqQFDvZikXevF1alLlMA7HutfoNS91uE4koFM2NNxbHhZsbDccakXwLkjaqJAOoiVrq6tooaJI38QnmVXaKvNPhCz1LXhYgXdRit1CIYSMGkXplv3H02MrSAweS3bE6U2i5afqysG/s1600/loader.gif",r="",w=null,s="div.blog-posts",g=!1,p=i(window),l=i(document),c=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;i(document).ready(d)}(jQuery);
//]]>
</script>
</b:if></b:if>

Note: This code uses jQuery library, so if you already have jQuery on your page, please remove the line in red highlighted above.

5. Click 'Save template' button and check the 'Load More Posts' button / Infinite Scrolling in your Blogger blog.

Conclusion

That's it! So this is how we can easily add Load More Posts / Infinite Scrolling to Blogger. From now on, our visitors can stay in same page and navigate through infinite number of posts on the fly!

Read More