Google Chrome Ending Support for Windows XP and Vista, All You Need To Know

And also for Mac OSX 10.6 /7/8. Windows XP became the most used operating system during its run and why not, it was one of the first Windows OS with so much colors and new features, its legacy it such phenomenal that a big share of OS market still use XP.

What could go wrong suddenly? When you receive a notification saying "This computer will soon stop receiving Google Chrome Updates" you are devastated! But why? It's not that Chrome hates XP or old system, it's for reasons that are legit.

Why Can't Chrome Keep Supporting Windows XP

Many, many people still run on the legendary OS by Microsoft, that's Windows XP, then why all of a sudden Chrome is acting like they don't care about their users? Let's have a little background check on the case.

Microsft announce earlier in 2014 that they would end support for Windows XP later that year and then they did it. Support for Windows XP was subsequently ended on 8th April 2014, here is the release from Microsoft on the topic: https://www.microsoft.com/en-in/WindowsForBusiness/end-of-xp-support  

Basically that means Microsft would now no longer provide security updates and/or technical support for XP. Boom! What is there to do next? Just update your system to a newer OS they say but in the real World not everyone does what the companies says, so we kept using Windows XP, right? 

Well, that end of the support didn't only mean you would miss out on latest security updates on the Windows XP platform, but also on the programs that used those security features and updates to make it safer for you to browse the Internet, like Google Chrome. Google Chrome did manage to keep the support up for the browser for nearly 2 years, but the time has come, they can't keep the updates up any longer without the security updates from the vendor. 

What About Windows Vista

Microsoft hasn't apparently ended support for Windows Vista and would be doing that until 2017, but due to a very small user base Google decided to end the support for Windows Vista too. 

That's it, people tend to hate the flop platform. It's the Jar Jar Binks of Operating System, lousy and hated.

What If I don't Update?

I thought why would it be difficult for people to upgrade to even Windows 7 on their systems, and one of my Google+ post on the topic gave me some interesting and legitimate answers. Many of the older systems didn't support new OS like Windows 7/8.1/10, or either it was not a viable option for many people who just want to work and did not want the hassles of managing their systems. 

You can still use Chrome

The notification about the support ending didn't mean to force you to upgrade to a newer OS or was a team plan by the companies to have you buy them. As Microsoft ended support, it was obvious that programs that runs under that platform too would stop the update in the near future and with a program that keeps the updates coming at a regular rate like Chrome it was even more obvious. 

Though it is prompting you to upgrade to a new platform for future updates, it doesn't mean Chrome would stop working on your PC. Things would work just as fine as it used to, what you will miss would be security and feature updates from Chrome. For a web browser security is one of the major part of their infrastructure, no one wants their sensitive information to be stolen, and therefore it is recommended to upgrade. 

I use a good Anti-virus software, wouldn't that secure me?

"Without critical Windows XP security updates, your PC may become vulnerable to harmful viruses, spyware, and other malicious software which can steal or damage your business data and information. Anti-virus software will also not be able to fully protect you once Windows XP itself is unsupported."  - Microsoft official release page

Though that doesn't mean vulnerabilities and viruses would be coming all  your way, but that imposes a significant risk. If you keep using it, you are keeping like a a gold brick in the open air, until someone sees it everything is fine. 

What About Switching to Firefox Or Some Other Browser?

The major options are Mozilla Firefox and Opera. Opera itself is built over the Chromium source code, so its fate is the same the Chrome's. 

The one left is Mozilla Firefox, it is sure beautiful browser developed by the open-source organization Mozilla. There's a few things you must know before the decision of switching to Firefox on Windows XP.

• The current version of Firefox stable release is 44, note that after the version 12 Firefox doesn't work on Windows XP SP2 and prior. You need to upgrade to Service Pack 3.
• As it progresses it would become obvious to end the support for the SP3 too, and would ultimately require you to upgrade to a newer OS to keep using it too.
• If you don't upgrade, you will still be able to use the last supported version, but that would, again impose security risk.

Upgrading OS Problems and Solutions

In the Google+ post mentioned above, people came up with legitimate reasons why they do not want to upgrade to a newer version of the OS. 

1. Hardware wouldn't support Windows 7 or later. 
2. Budget not in the support of upgrading to a new Operating System like Windows 7/8.1/10
3. Not tech-savvy so upgrading to a new OS is not a great thing to start the day with.
4. I love Windows XP <3

Answers to these questions (opinion based):

1. Apparently Windows 7, or even 8 and 8.1 doesn't take much advanced hardware to run. I have been using Windows 7 on a 6 year old computer that came with the hardware cost me $500. You have to analyze to see what more would you need to upgrade with your hardware to be able to run Windows 7 or later. See this page to know the system requirements for Windows 7
   
   Or if that's not that option then see the other solutions.
2. Use Linux based operating system. Open Source, free and well-managed. Ubuntu is what I use and one of the most used distribution of Linux. 
3. In this age there are quite many technical experts almost in every locality on the planet, see if you can find one, ask your friends, families, the chances are high that you may find a tech expert among your own relatives!
4. Well, love for Windows XP is just phenomenal, I have seen people not upgrading to a new OS even if they can just because they love XP. If that's the case then nothing can be done instead of deciding to move on. As said earlier you can keep using Chrome, well only updates wouldn't come your way in the future. Full stop. 

There are many malicious activities carried on by people taking this situation as an opportunity to exploit the general users, I suggest you to not fall for those, before trying anything to help you with this do check the official documents and Google Chrome help forums to make sure it is not malicious. 

Thanks for reading. Drop your opinions in the comments, we would love to hear from you!

Disclaimer: We are not affiliated with Google, Apple or Microsoft in any ways and do not intend to market their products through this post. 

Background Images for Widgets in Blogger

In terms of customization the options that Blogger provides might be limited but with custom styles and codes you can do almost anything to the looks of your blog. With this tutorial you will learn how you can set background images to the widgets in the sidebar or anywhere.

Upgrade your blog's look by setting custom images (your choice!) as the background on widgets on your blog. We will guide you through setting background images on widgets on your blog, either on sidebar & footer or just the sidebar.

Before you make changes to the template I recommend you to take a backup of your blog template.

Set Background Image On All Widgets

If you want a image background on all of the widgets on your blog then follow the instructions below, the other section deals with adding a background image to particular widget(s) which goes a bit into technical stuffs.

First Get An Image

Before anything else we need an image somewhere on the web that you can use as  the background. Simplest way is to upload an image in a draft post on Blogger, then right click on it to get its direct URL.

For example I have this image:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRbyvldP5eJrx_heAusfssXVnV0tfteAR0x8rrGNd76UH3YpNWmi5AO_B8v-L_PgjCepihCNauujdZ32OebvKCr7uT48YpfpujRUM0akwypQ8ZcFtoJWKNildJsDXIFVLcw3ceQl78y44p/s1600/samle-image-001.jpg

Make sure your image wide enough to cover the width of the image, as for the height you may also keep it in accordance with height of the widgets but it is not in this case useful as some widgets might stretch more vertical which may require the image to be stretched too, but instead of stretching we can just tile it downward to fill in the blank area.

The CSS Snippet

To get the image applied as background we would use this small snippet that sets the image on every widget (including the widgets in footer, you can omit the line specified if you don't want it on footer)

.sidebar .widget .widget-content
,foooter .widget .widget-content {
    background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRbyvldP5eJrx_heAusfssXVnV0tfteAR0x8rrGNd76UH3YpNWmi5AO_B8v-L_PgjCepihCNauujdZ32OebvKCr7uT48YpfpujRUM0akwypQ8ZcFtoJWKNildJsDXIFVLcw3ceQl78y44p/s1600/samle-image-001.jpg');
    background-repeat: no-repeat repeat;
    background-position: top center;
    background-size: cover;
}

Replace Image URL:
The third line is basically the one you have to change. Currently the image pointed in the code is what I have set it, but for your images you have to enter your image's URL in the snippet.

background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRbyvldP5eJrx_heAusfssXVnV0tfteAR0x8rrGNd76UH3YpNWmi5AO_B8v-L_PgjCepihCNauujdZ32OebvKCr7uT48YpfpujRUM0akwypQ8ZcFtoJWKNildJsDXIFVLcw3ceQl78y44p/s1600/samle-image-001.jpg');

The highlighted area in the code is the URL of the background image, when you copy the code replace the highlighted area with your own image's URL and then apply the whole CSS code to your blog.

Don't Apply To Footer Widgets:
In case you intend to only apply the background image to sidebar widgets then omit the following piece of highlighted code from the snippet:

,foooter .widget .widget-content {

Do not remove the "{", only the highlighted area is supposed to be removed.

Now Apply The CSS

Here is a quick tutorial on adding CSS code to your Blogger blog with easy demo steps

Decorative Backgrounds for Holidays

Christmas and New Year's Eve is near, everything on the web has almost blended into the festive look so why not your blog? Use the steps provided above with these pre-made images that will give your blog an impressive look. Just right-click, copy the image URL and use it with the code in the previous section.

Moreover you can always select your own decorative background image from around the web or look at some very creative designs on Creative Market that you might find useful.

So have a great Christmas and happy new year! See you in 2016. 

Renaming "Older" and "Newer" Page Links in Blogger

Two years ago I wrote a post on hiding "Newer"/"Older" pagination links on Blogger and I was recently asked by a reader if it was possible to rename the links name, yes it is, and in this tutorial you are going to learn that the safe way.

Why is it the safe way, is there any side-effects? Not really, but this tutorial takes you into editing a few lines of code in your template so chances are that if you accidentally make any mistakes then the template might just broke and you have to fix that problem first to get your blog running again.

Back-up the Template

As a precautionary step make a backup of the template so that if anything goes wrong you can always revert it back to the current template: How To Backup Your Template

Two Ways To Do It

Before we start take note that we are presenting you two different ways to do this. The first method affects it from the root while the second one is like a layer, it renames it using JavaScript code when the page is loaded.

Difference? The first method internally changes the name to what you like, the JavaScript way is done on the front-end i.e when the page is loaded the text on the pagination links is internally still what it was but the JavaScript code executes and changes the document dynamically on the client-side to change the name.

#1 Method: By Replacing HTML/XML Codes

Note: We assume you are using not using a third-party template. Though this may work with third-party templates too but the naming convention is uncertain for them so we can't be sure if the code we are asking you to search exists in your template or not.

Follow the instructions carefully to rename the "Older" and "Newer" page links.

1. Go to your Blogger Dashboard -> Template -> Click on "Edit HTML" button to open the template code editor

2. Once the template editor opens put your cursor in the code area and then press CTRL+F/CMD+F and look for the following line by entering it in the search box

<b:includable id='nextprev'>

Searching for this line must bring up the matching line of code where we have to make the changes. If there is a triangle arrow on the left of the line in code editor then click on it to show the code inside it.



3. When you click on the triangle right arrow the code inside it will show up and it should be something like or may even be the exact.

<b:includable id='nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <span id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </span>
    </b:if>

    <b:if cond='data:olderPageUrl'>
      <span id='blog-pager-older-link'>
      <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
      </span>
    </b:if>

    <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>

    <b:if cond='data:mobileLinkUrl'>
      <div class='blog-mobile-link'>
        <a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
      </div>
    </b:if>
  </div>
  <div class='clear'/>
</b:includable>

4. Now look for <data:newerPageTitle/> and <data:olderPageTitle/> in the above code inside your Blogger template code editor. To make it easy we've highlighted the lines which contain these two codes.

<data:newerPageTitle/> - Generates the newer page link text, by default "Newer Post"/"Newer Posts" for post page and index/archive pages respectively.

<data:olderPageTitle/> - Generates the older page link text, by default "Older Post"/"Older Posts" for post page and index/archive pages respectively.

Replace each with the text you want in place of it. For example suppose I want "Previously Written!" & "Next For Read!" to replace the default text then my code would look something like this.

a. For "Older" page link I would replace the 2nd highlighted part with this:

<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>Previously Written!</a>

b. For "Newer" page link the edit on the 1st highlighted part in the main code above would be this

<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>Next for Read!</a>

Use your own text you want to replace the default pagination link text and then save the template. If you did it right then the changes must appear on the blog like this:

#2 Method: Using JavaScript

This doesn't require much edits and is also easily revertible. But this is just like a layer, while the actual text that was generated during the page was still the default one, this JavaScript changes the DOM to the change the text inside the specific page links.

<script type='text/javascript'>
function changePageLinkText(a, b) {
document.getElementById("blog-pager-older-link").children[0].innerText = b;
  document.getElementById("blog-pager-newer-link").children[0].innerText = a;
}
document.addEventListener("DOMContentLoaded", function() {
  var newerText = "Enter Newer Text"; // Replace [Enter Newer Text] with your own text
  var olderText = "Enter Older Text"; // Replace [Enter Older Text] with your own text
  changePageLinkText(newerText, olderText);
});
</script>

Replace the text "Enter Newer Text" and "Enter Older Text" with the text you want to appear in the corresponding links.

To place this code in the template, go to Blogger Dashboard -> Template -> Edit HTML -> Now press CTRL+F/CMD+F and search for </body> and place this immediately before it.

Now save the template and the text on the pagination links will change according to what you've set in the code. You can edit the variables in the JavaScript code anytime you like to change the text that appears.

Note: this may not work in some older browsers and also in browsers that turns off JavaScript.

Adding AdSense Ad Inline With Post in Blogger

There are numerous tutorials and tips on increasing revenue on AdSense by using different ad placement techniques and practices, many of them work great, but Ads in the main body content is one of the most vital place.

Ads placed in post body can make a significant difference in the revenue but you have to do it wisely, it is where the main focus of a site's visitor is for most of the time during their visit so it is important to make sure the experience is not obstructed for the visitor due to the ads.

In this tutorial you will learn a simple way to add AdSense ad in your post and have it display in a good manner that is by floating the ad to a direction and have the paragraphs wrap around it.

Set Things Up

You can simply paste an Ad code in the post editor and the ads will appear but that isn't always what you need. How about floating it to the left or the right so the text wraps around it? We are going to learn just that by using simple markup and CSS so you can selectively add the Ads to any post at the best position you like.

Add The CSS Styles

We will get onto the main part where you have to work with the ad codes later before that let's set a few lines of CSS that is going to complement the box which is going to contain your Ad. This tutorial is meant for square ads only.

/* By default it floats to left */
.ad-container {
    float: left;
    padding: 10px 0;
    padding-right: 10px;
}

/* For ads floating to the right */
.ad-container.right {
   float: right;
   padding-left: 10px;
   padding-right: 0;
}

/* Centered Box */
.ad-container.center {
    float: none;
    padding: 10px 10px;
    text-align: center;
}

/* Clearing floats */
.ad-container br {display: none;}
.ad-container:after, .ad-container:before {
    content: "";
    display: block;
    clear: both;
}

If you are not sure where to add this CSS code please check the guide on adding CSS to a Blogger blog

The HTML Container

What does this do? Well, you can, as I already mentioned, paste the Ad Unit's code provided by AdSense in the HTML mode in the post and the ad will start appearing but you get a very little and not-an-easy option to position the ad as you like. With this you can.

Copy the following code and have it saved in your favorite text editor so you can use it in the next steps easily.

<div class="ad-container">
  <!-- Paste your code here -->
</div>

The HTML markup is simple, just put your AdSense code between the first and the last line i.e where <!-- Paste your code --> is and that is it.

You need to know a small thing if you want to have the ad centered to floated to the right as by default it floats to the left. Check the following line of codes trimmed from the HTML markup provided above.

<div class="ad-container center">

We added the keyword "center" in side the class="" attribute. If you want the ad to appear centered then you have to add it too to your markup.

<div class="ad-container right">

In case you need it on the right just add "right" in there and that's it. Simple!

Once you have this markup ready with your AdSense Ad code you may proceed to the new steps that guides you through adding it to the post through post editor.

Put The Final Code In Post

By now we assume that you have finalized the code i.e edited the markup and included your ad unit code where described.

To put it into your post click on the "HTML" button when you are in the post editor

After switching to the HTML mode paste your code around the text where you want it to appear. Mostly ads are put at the start of the blog post but if you wish you can put anywhere for example at a position where you know the readers are going to spend most time reading or focusing. 

Make sure that when you paste the code anywhere in the post in HTML mode you paste it outside a <span> or <div> tag that may be there to contain some other text or paragraph/image.

For any further help on this you may use the comment box below to let me know. 

Now Drag & Drop Images in Post Editor in Blogger

Blogger has announced a new and very useful: Drag and Drop images in directly draft posts to upload them!

Credit: http://www.memegasms.com/

Blogger's post editor has been on a very slow improvement over the time, though it is now free of many bugs and errors that caused havoc among Blogger authors while even writing a simple post.

How Do I Know?

Open up a post in the editor and drag and drop an image from your computer in the post editor (in Compose mode) and the images will be uploaded and added to the post as you would've done with the "Insert Image" option in the toolbar.

When you click the "Insert Image" icon for the first time you will be presented with the notification letting you know about the new feature so that you can use it from next time instead of proceeding with a little lengthier process of selecting > uploading > again selecting and placing the image.

From the official Blogger Help Forum thread

It makes it easier for a blogger to place images in the post. A great relief for people who happen to upload a lot of images on their blogs.

Wasn't it possible already?

No. Before you could sure drag and drop images into the post editor and it would have even shown up but it' was not the same without the support it has implemented now. When you did that before the images were not uploaded to any server instead were added into the post as long series of text that encoded as the image's data.

It isn't the best practice for drag and dropping image though, so we said no to it.

Sign-in to Blogger using Non-Google Email Address

Recently there have been a lot of confusion for logging in among Blogger users who previously signed-up on it with a non-google email address i.e with a Yahoo or other service.


The confusion arises for one reason: Uniting all Google services under one Google account, so the login page for all your Google services like Gmail, Blogger, Webmaster Tools etc. looks the same.

Previously all the Google services had different login page if you remember, just a year or two ago but now which can be a called a good move by Google leads to a lot of confusion, at least for many Blogger users.

How to Login?

Your Google account doesn't have to be necessarily a @gmail.com address, Blogger is a Google product and falls under one Google account, but you can still use the email address you used to sign-up for Blogger with.

Just go to Blogger.com (in logged-out state) and log into it with your @yahoo, @hotmail or any other email address you sign-up with. 

Using the HTTPS Option in Blogger and Things to Know

Blogger has after a long time come up with a new option for technical settings of the blogs, and this time is is something that most Blogger's didn't generally expected: The option to serve their blogs over HTTPS.

This surely came as a surprised, and especially on a platform like Blogger. Most people use it for blogs, and generally blogs doesn't require so much protection against data theft. Do note that serving your blog over has nothing to do with the security of your Blogger account, but to ensure that the data  from your blog's domain that is being transferred to a visitor is more secure than the normal HTTP.

Other than the security of the data HTTPS do has some very interesting advantages, for an instance many advanced APIs in HTML5 allows sites to use features that requires advanced device or application access.  But that is generally insignificant for any regular or even advanced Blogger.

What is HTTPS and What Does it Do

HTTPS has no significant effect on your search rankings or such, or the content that is displayed or presented to the visitor, only the way it is done is affected, or to say improved and secured.

It stands for "HyperText Transfer Protocol Secure", which clarifies its true meaning, it is secure, yup, it makes difficult for a hacker to steal data between the user and your blog. But these are implemented mainly on sites that requires protection from potential data thefts, like a Banking Site, or many sites like Google, Facebook, Twitter etc. which has to protect a users data that is being transferred over the air from thefts. These are some examples, but you will see the use of HTTPS not only these poplar but more business and services websites. 

Why is encrypted data so important? It is important when you are transferring content that can be a subject of data theft. A website that asks for your credit card detail so that you can pay money mostly use HTTPS and advanced encryption to ensure that a hacker doesn't steal the data and decrypt it that might reveal the details to them. Credit card details is one example, other reasons are to protect the transfer of cookies, which might give away a way for the hackers to pretend to be you and log into a site with the use of those cookies and HTTPS just gives the data more protection. 

Should I use it?

Most people who when visit a site with HTTPS they sub-consciously get a assurance that the site is genuine and safe to use, probably even better than competitors with only HTTP. It does help a visitor to decide physiologically to either trust the site or not. Anyways that is not very similar with a blog, most people don't expect HTTPS being implemented on a blog they just want to read, though it doesn't harm the experience either. 

HTTPS can be prove to be helpful but at the same time can be an obstruction to small things that you might be doing. For example when your blog is on HTTPS and you suppose have linked an image from another site with only HTTP in its URL the browser may give out a "mixed content" warning which might confuse a visitor who doesn't know what's going on and might possibly lead them away.  Though those are not malicious but might give out a feeling of it, so when you use HTTPS you have to make sure the resources like assets files and images are also on HTTPS. 

On the other hand you might also note that you should not embed contents that are not on HTTPS, but this isn't a big issue if you mainly embed content from sites which already serves on the secure protocol i.e HTTPS like Google Docs, YouTube and many other well known site. 

Benefits

1. Visitors are ensured that the site they've opened is genuine and not a malicious site that they've been redirected to without their knowledge. 
2. Any person trying to manipulate the content that is being transfer from your blog to the visitor will find it more difficult, thus providing security to the data.
3. If you are tech-savvy then there are some more advantages of it that you can enjoy through latest web technologies eg. the notification API or the use of media devices through the site

Things to look out for

1. If you have third party gadgets that uses resources on the general HTTProtocol errors might come up as HTTPS suggests only resource on the same protocol be served.
2. Only for ".blogspot.com". Not available by blogger for custom domains, though HTTPS services might be available from your domain registrar. 
3. 'http://' doesn't redirect to the secure version if some types it in. Though when you have turned off "HTTPS Availability" your blog's URL would redirect to the HTTP even if a user types in "https://" 

If you are unsure about it then I would recommend you to research more about HTTPS and its technical aspects to make a decision, else there is no harm in staying with HTTP though.

It is though not for everyone. A blog anyways doesn't generally needs HTTPS but this has sure come as a breeze of hope for many folks who might have wanted to have this on Blogger. So if you know what you are doing then you are good to go.  

On a further note I would suggest you to visit this official forum thread to learn what the users have to say about this feature: https://productforums.google.com/forum/#!topic/blogger/AYiZ_QjkbxE