Find How Many Visitors Are Not Seeing Ads on your Website

Adblocking software like AdBlock Plus have become mainstream and now pose a significant threat to web businesses that are dependent on online advertisements. The problem is so severe that Google and Amazon are paying the writers of AdBlock Plus to whitelist their ads. This may be seen as some kind ofextortion but with billions of dollars at stake, the advertising companies have chosen to take the more profitable route. It is estimated that ~5% of website visitors are blocking ads (PDF report) and the situation could be far worse for websites that have a more tech-savvy audience. If you are curious to know how many people visiting your own site are blocking AdSense and other ads, here’s a little trick.

Track Adblock Users with Google Analytics

Open your website template and copy-paste the snippet below before the closingbody. This code will detect the presence of adblocking software on the visitor’s browser and, if found, an event gets logged into your Google Analytics account.

<script> 
  
  window.onload = function() { 
  
    // Delay to allow the async Google Ads to load
    setTimeout(function() { 
      
      // Get the first AdSense ad unit on the page
      var ad = document.querySelector("ins.adsbygoogle");
      
      // If the ads are not loaded, track the event
      if (ad && ad.innerHTML.replace(/\s/g, "").length == 0) {
 
        if (typeof ga !== 'undefined') {
 
            // Log an event in Universal Analytics
            // but without affecting overall bounce rate
            ga('send', 'event', 'Adblock', 'Yes', {'nonInteraction': 1}); 
 
        } else if (typeof _gaq !== 'undefined') {
 
            // Log a non-interactive event in old Google Analytics
            _gaq.push(['_trackEvent', 'Adblock', 'Yes', undefined, undefined, true]);
 
        }
      }
    }, 2000); // Run ad block detection 2 seconds after page load
  }; 
  
</script>

The snippet works for both Universal Analytics and the older version of Google Analytics tracker that used the _gaq object. As a web publisher, your only option is to serve alternate content to AdBlock users so the visitors at least see some content in place of the ads.

One big caveat though – it will fail if the ad blocking extension installed on the visitor’s computer has blocked Google Analytics as well. Some of the popular choices like μBlock, NoScript and Ghostery do block Google Analytics so the approach won’t work and you may have to build your own in-house solution – like downloading an image hosted on your own server and then counting the hits to that image through the Apache server logs.

Also see: Use Google Analytics without JavaScript

(source) 

Read More

How to Remove Password from PDF Files with Google Chrome

The bank sends me monthly credit card statements as password-protected PDF files mostly because they contain personal information. I archive these PDFs into Google Drive but, because these files are protected with a password, the text isn’t searchable inside Drive. Also, each PDF file has a different password so it’s impossible to remember them and takes just too much to find these PDFs later.

Removing Password from a PDF File

Since the Google Drive is already protected with 2 layers of security – password and 2-factor authentication – it should be OK if we remove the password protection from PDF files before uploading them to Drive.

Is there any software program available that can remove password protection from PDF files? One that doesn’t cost a dime and works on both Mac and Windows? Well the answer is yes and that too is already installed on your computer. It’s called Google Chrome.

Google Chrome has a built-in PDF reader* and a PDF writer and we can combine the two features to remove the password from any PDF document. Let’s see how:

1. Drag any password protected PDF file into your Google Chrome browser. If you can’t find one, use this sample PDF file – the open password is “labnol” without the quotes.
2. Google Chrome will now prompt you to enter the password of the file. Enter the password and hit Enter to open the file.
3. Now go to the File menu in Google Chrome and choose Print (or press Ctrl+P on Windows or Cmd+P on Mac). Choose the destination printer as “Save as PDF” and click the Save button.

Google Chrome will now save the PDF to your desktop but without the password protection. If you re-open this PDF in Chrome, it would no longer require a password to open. Thank you Ivan Sunga for the tip.

Alternatively, if you have enabled Google Cloud Print, you can choose the destination as “Save to Google Drive” in the print dialog and the unprotected version of the PDF will be sent straight to your Google Drive from Chrome.

[*] Open the special page chrome://plugins and enable the option that says “Chrome PDF Viewer” to let Chrome natively handle PDF files.

Remove PDF Passwords without Chrome

If you are not a Google Chrome user, download this free Windows utility calledBeCyPDFMetaEdit to remove passwords from PDF files.

First launch the program and it will ask your for the location of the PDF file. Before you select and open the PDF, change the mode to “Complete Rewrite,” then switch to the Security tab and set the “Security System” to “No encryption.” Click the Save button and your PDF will no longer require a password to open.

See more tools for editing PDF files.

(source) 

Read More

How to Fake your Location in Google Chrome

Some websites may request access to your location so that they can serve more relevant information. For instance, if you are looking for a gas station, a maps website may use your current geographic location to display stations that are near your place without you having to type your co-ordinates.

Google Chrome will only share your location if you click Allow.

How Browsers Determine your Location

Earlier, websites would use the IP address to determine your approximate location but with the HTML5 Geolocation API, web browsers can more accurately detect your location using data from GPS, Wi-Fi networks, cell towers, Bluetooth and the computer’s IP address. If you agree to share your location with the browser, it will send these details to Google Location Services for estimating your location which is then shared with the requesting website.

To give you an example, open the Where am I app in your browser, allow it to use your location information and the app should be able to display your latitude and longitude coordinates (it is more accurate on mobile browsers as those devices have built-in GPS).

How to Fake your Geolocation Coordinates

When you happen to visit a location-aware website, the browser will always ask for a confirmation before sharing your location. If you aren’t keen to share your geographic coordinates, you can always deny that request or, if you are using Google Chrome, you can even send a fake location to the website.

Here’s how. While in Google Chrome, press Ctrl+Shift+I on Windows, or Cmd+Opt+I on Mac, to open the Chrome Developer Tools. Now press the Esc (escape) key to open the Console window. Switch to the Emulation tab and choose the Sensors option in the left sidebar.

Here check the setting that says “Emulate Geolocation coordinates” and specify the exact latitude and longitude coordinates* that you want to share with that website. You can use the Postal Address finder to know the latitude and location of a place.

Now refresh the current web page and it will take your fake location. Make sure that the developer tools panel is visible always else Chrome will not override your geolocation.

Related tip: Geotag your Tweets with any Location

The option to fake your geolocation is not available in the DevTools of Mozilla Firefox but you can use the Geolocator addon to send any preferred location to the HTML5 Location API.

(source)

Read More

Download WhatsApp Photos via Dropbox

A friend has a book publishing business and have customers across the country who sell these books. They are old-school businesses that always relied on paper-based forms and fax for sending orders but now that they have WhatsApp on their mobile phones, they write their requirements on paper, snap an image and send it via WhatsApp. On this side, the received WhatsApp images are saved to the computer, printed and sent to the respective departments for processing

The problem with the workflow is that there are quite a few steps involved after the WhatsApp image is received. Since WhatsApp neither offers a desktop client and nor does it allow integration with services like IFTTT or Zapier, the incoming images have to manually transferred from the phone to computer for sending to the printer. Is there a way to automate these steps? Yes.

When a photograph, or any media file, is received inside WhatsApp, it is automatically saved to the phone’s physical memory. The media is downloaded without you having to open the corresponding message (we are dealing with Android here, the iPhone version of WhatsApp may work differently).

Now that we know that the incoming image file is on the phone’s SD card, all we need is way to automatically transfer the file to our computer. That’s where Dropbox or Google Drive can help.

Download WhatsApp Photos to Computer

We can watch the Media folder of WhatsApp and as soon as a new file is added to that folder, it is automatically synced with Dropbox. MetaCtrl has Android apps for Dropbox, Google Drive and Box that can help here.

1. Open your Dropbox and create a folder, say WhatsApp.
2. Launch the DropSync app and authorize it to access your Dropbox account.
3. Set the Local (watch) folder as /storage/emulated/0/WhatsApp/Media/WhatsApp Images and set the Dropbox folder as the one that you created in Step #1.
4. Set the sync method as “Upload only” so that it is not a 2-way sync and only WhatsApp images are sent to Dropbox but not the other way.
5. Go to the app settings and change the Autosync Interval to 5 minutes (the default is an hour).

That’s it. Within minutes of you getting an image on WhatsApp, it will be sent to your Dropbox account in the cloud and since you have Dropbox running on your desktop too, the image will be downloaded on the computer as well.

Automatically Printing the WhatsApp Photos

The next step is to send these images from the Dropbox folder to your printer connected to the computer.

This isn’t difficult either. You can open this Windows Printing script on the computer and it will automatically send images from the Dropbox folder to the printer. A similar remote printing option is available for Mac and Linux as well.

Please do however note that this will download and print all WhatsApp images so you want to have a human layer that discards the non-essential ones.

(source)

Read More

Create an Apple ID without using a Credit Card

Some apps, Google Earth for example, are available as free downloads in the iTunes Apps store but you need a UK or US based Apple ID to install them on to your iPad or Phone. Similarly, some iBooks and podcasts have geo restrictions and may only be available to iTunes users who are logged in with an Apple ID for one of the available countries.

The workaround is simple. You can create multiple Apple IDs – like one for UK and another one for US Apps Store – and easily switch between them inside iTunes. So if you are signed-in from India, you can switch to the US store, login with your US based Apple ID and download the app that is otherwise not available in the Indian Apps Store.

There’s however a problem. When you create a new Apple ID, iTunes will require you to enter your credit card and the billing address of your card should be in that country. In other words, you need a US based credit card or PayPal account to create a Apple ID for the US iTunes Store. Apple will not let you create an Apple ID without entering valid payment information (see screenshot above).

That said, you can take an alternate not-so-obvious route in iTunes to create an Apple ID for any country without requiring a credit card. Here’s how:

Create Apple ID in iTunes without your Credit Card

1. Launch the iTunes software on your computer and sign-out of your existing Apple ID. Choose Store in the menu and select Sign-out.
2. Next scroll to the bottom of the iTunes page, click Change Country and select one from the list for which you need an Apple ID. Alternatively, you may click the country’s flag to switch to the iTunes store of another region.
3. Now open the Apps Store inside iTunes, select any app that is free and click the Getbutton to download that App.
4. iTunes will now prompt you to enter your Apple ID and password. Do not enter your existing Apple ID. Instead, click the Create Apple ID button, agree to the terms & conditions, enter your email address &amp password and minimum age.
5. Proceed to the Payments screen and here you’ll see a new option that says NONE (see screenshot below). Select the None option, enter a dummy postal address and submit to create your new Apple ID that will be valid in the iTunes store of that country.

If you have kids at home, you can use this trick to create a separate Apple ID for the iPads, one that is not associated with your credit card and so they’ll never be able to make any accidental purchases.

An Easier Way to Create a New Apple ID

If you need another Apple ID but do not intend to use it with the iTunes store for download apps, there’s an easier way. Go to icloud.com, click the Create Apple IDlink and choose a different country from the dropdown. Your Apple ID will be created instantly but if you decide to use it for downloading iTunes content later, you’d still need to supply the credit card.

You Cannot Create An Apple ID Because You Do Not Meet The Minimum Age Requirement

You need to be at least 13+ years old to create an Apple ID inside iTunes. However, if you enter an incorrect date, iTunes will refuse to create your Apple ID and no matter how many times you try the process, you will keep getting an error saying “you cannot create an Apple ID because you do not meet the minimum age requirements.”

This is most like a caching related bug in the iTune software but can be easily. Open Preferences inside iTunes, switch to the Advanced tab and choose Reset Cache. Quit iTunes and launch the Safari browser. Go to Preferences and under Privacy, choose the option “Remove all Website date” to clear the cache.

Open iTunes again, try downloading an app and it should not allow you to create an Apple ID without issues. Thanks Mahendra for the tip.

(source)

Read More

A More Efficient Method for Embedding YouTube Videos

When you embed any YouTube video on your website using standardIFRAME tags, you’ll be surprised to know how much extra weight that YouTube video will add to your page. The web page has to download ~0.5 MB of extra resources (CSS, JavaScript and images) for rendering the YouTube video player and the files will download even if the visitor on your website has chosen not to watch the embedded YouTube video.

The embedded video is making your page heavy and the visitor’s browser will also need to make multiple HTTP requests to render the video player. This increases the overall loading time of your page and thus affects the page speed score. The other drawback with the default YouTube embed code is that it isn’t responsive. If people view your website on a mobile phone, the video player would not resize itself accordingly.

Load YouTube Video Player On-Demand

Google Plus uses a clever workaround to reduce the time it takes to initially load the YouTube video player and we can incorporate a similar approach approach for our websites as well.

Instead of embedding the full Youtube video player, Google+ displays just the thumbnail images of a YouTube video and a “play” icon is placed over the video so that it looks like a video player. The following video is embedded using the same technique:

When the user hits the play button, the video thumbnail is replaced with the standard YouTube video player with autoplay set to 1 so it plays the video instantly. The extra player-specific resources are thus loaded only when the user has decided to play the embedded video and not otherwise.

The regular embed code for YouTube looks something like this. You specify the height of the player (in pixels), the width and the unique ID of the YouTube video.

<iframe width="320" height="180" 
     src="http://www.youtube.com/embed/LcIytqkbdlo">
</iframe>

Embed YouTube Videos Responsively without Increasing Load Time

The on-demand embed code for YouTube is slightly different since we are now embedding the video responsively and also because the IFRAME embed code is added only then user clicks the play button.

Copy-paste the following snippet anywhere in your web page where you would like the video to appear. Remember to replace VIDEOID with the actual ID of the YouTube video. The CSS and JavaScript codes are added to the template separately. Also, there’s no need to add the height and width parameter since the video will automatically occupy the width of the parent while the height is auto-calculated.

<div class="youtube-container">
   <div class="youtube-player" data-id="VIDEOID"></div>
</div>

You can copy-paste multiple blocks on the same page incase you need to embed multiple videos on the same page. The code will stay the same except that you need to change the VIDEOID for each of the blocks.

The JavaScript

The JavaScript function will scan your pages for embedded YouTube videos. If found, it will add the corresponding thumbnail image and also add the onclick event listener that will do the actual magic – replace the image with the actual YouTube video in autoplay mode.

<script>
(function() {
    var v = document.getElementsByClassName("youtube-player");
    for (var n = 0; n < v.length; n++) {
        var p = document.createElement("div");
        p.innerHTML = labnolThumb(v[n].dataset.id);
        p.onclick = labnolIframe;
        v[n].appendChild(p);
    }
})();
 
function labnolThumb(id) {
    return '<img class="youtube-thumb" src="//i.ytimg.com/vi/' + id + '/hqdefault.jpg"><div class="play-button"></div>';
}
 
function labnolIframe() {
    var iframe = document.createElement("iframe");
    iframe.setAttribute("src", "//www.youtube.com/embed/" + this.parentNode.dataset.id + "?autoplay=1&autohide=2&border=0&wmode=opaque&enablejsapi=1&controls=0&showinfo=0");
    iframe.setAttribute("frameborder", "0");
    iframe.setAttribute("id", "youtube-iframe");
    this.parentNode.replaceChild(iframe, this);
}
</script>

The CSS

Open the CSS file of your website and paste the following snippet. If you don’t have a separate CSS file, you can also place it before the closing head tag of your web template.

<style>
.youtube-container { display: block; margin: 20px auto; width: 100%; max-width: 600px; }
.youtube-player { display: block; width: 100%; /* assuming that the video has a 16:9 ratio */ padding-bottom: 56.25%; overflow: hidden; position: relative; width: 100%; height: 100%; cursor: hand; cursor: pointer; display: block; }
img.youtube-thumb { bottom: 0; display: block; left: 0; margin: auto; max-width: 100%; width: 100%; position: absolute; right: 0; top: 0; height: auto }
div.play-button { height: 72px; width: 72px; left: 50%; top: 50%; margin-left: -36px; margin-top: -36px; position: absolute; background: url("http://i.imgur.com/TxzC70f.png") no-repeat; }
#youtube-iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
</style>

This method will reduce the size of your webpages by 300-400 KB while making your site mobile friendly. You may refer to the annotated code to understanding how on-demand embedding works.

Also see: Embed Google Maps Responsively

 (source)

Read More