Friday, September 18, 2020
Home Blogging Tips & Tweaks Exit "Leave This Page" or "Stay on This Page" Pop-Up Using JQuery...

Exit “Leave This Page” or “Stay on This Page” Pop-Up Using JQuery for Blogger and Websites

Wondering why your website or blog’s bounce rate keeps increasing despite the fact that you have lots of interesting posts or articles? There are so many reasons why a website or blog’s bounce rate rate will keep increasing instead of decreasing but if your website or blog have rich contents, then you shouldn’t worry about its bounce rate increasing.

If you have rich contents on your webpage and you are still experiencing increase in bounce rate, then it is time you checked other factors that might be the cause. Besides having uninteresting contents, one of the major reasons of increase in bounce rate is un-expected clicking of the browser or browser’s tab close button by your visitors which automatically closes your web page. If this happens many times when visitors visit your website or blog then you should expect an increase in your website or blog’s bounce rate.

To make sure that doesn’t happen, you can implement a pop-up which will warn visitors anytime they want to close a browser tab or browser displaying your web page. This makes use of a script which you can apply to your page to automatically bring up the pop-up message which says “Are you sure you want to leave this page?” when ever visitors want to leave your website or blog. Here is how to apply the script to your Blogger blog.

For Blogger

  • Log on to your Blogger Dashboard.
  • Navigate to Template >>> Edit HTML.
  • Click inside the Edit HTML box and search for </head> using Ctrl + F.
  • Copy the below script and paste just above/before the </head> tag.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>


<script type='text/javascript'>

     function PopIt() { return &quot;Use the search button to check for related topics&quot;; }

     function UnPopIt()  { /* nothing to return */ }


     $(document).ready(function() {

      window.onbeforeunload = PopIt;

 $(&quot;a&quot;).click(function(){ window.onbeforeunload = UnPopIt; });

     });

</script>
  • Click on Save Template to apply the script to your Blogger page.

For other Platforms

To add this to other webpage and blogging platforms, simply copy the script above and paste just above/before your page’s </head> tag.

OPTIONAL: You can change the message that appears in the pop up by changing Use the search button to check for related topics, to your own.

Note: The page has to be done loading before the pop-up can come up when a visitor tries to leave your webpage. The pop-up will also come up when the visitor tries to reload any page in your blog or website with a message that says “Are you sure you want to reload this page?”

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -

Most Popular

List of All JavaScript Arithmetic Operators With Examples

JavaScript offers several operators to help us work with numbers. All these operators are binary operators, which means they operate on two operands. The operands...

How to Find a Website’s RSS Feed’s URL

Having access to the RSS feed of a website gives you the opportunity to stay up-to-date on everything that website publishes. Whether that’s a...

Laravel: String data, right truncated: 1406 Data too long for column (SOLVED)

I was working on a project today when i ran into the error message "String data, right truncated: 1406 Data too long for column...

How to Enable or Disable Chrome’s Autofill on Android Devices

Storing your login details and other information in Chrome and/or your Google Account isn’t as secure as using an encrypted password manager, but it’s...

Recent Comments