Recently I had to create a custom message that would warn users before they left the current website they were on. The user also had to have the option to cancel if they did not want to move forward with going to the outbound link. This is an awesome alternative if you don’t want to install a custom WordPress plugin.
Here is how I did it.
- I downloaded the LeaveNotice jQuery plugin by Andrew.
- I installed the js and css files into my child theme directory
- I enqueued the scripts required into the head of website
- I added the necessary code to display my message
1. Download Script and Follow Directions
Andrew creates very detailed and easy to read instructions on how to download the files and add the custom code needed to replicate it on your own website.
2. Install your scripts
I am a child theme nut. You will want to navigate via ftp to wp-content/themes/your-child-theme. Create the directory leavenotice and drop the files there. So you are dragging and dropping the 2 files (jquery.leaveNotice.css and jquery.leaveNotice.min.css) into wp-content/themes/your-child-theme/leavenotice.
3. Enqueue your scripts
There are a few ways to do this depending on what your comfortable with. There is the traditional way via functions.php. There is the genesis way via the head code in settings and you can install a plugin for head scripts. I’m going to show you how to do it the genesis way.
Inside that box that genesis gives you for custom code like google analytics and custom scripts, your going to add this code (make sure to replace “yourwebsite.com and your-child-theme with your actually website and child theme…
4. Call out your code!
You will also put this in the custom scripts section (head of your site or head of your page). In my particular case, I wanted all outbound links to open up this message, but this plugin allows you to target other behaviors too with lots of other functionalities and customizations.
- How to Use SSL Properly and Avoid the Yellow Lock Symbol - January 18, 2017
- How To Bulk Optimize Images for Faster Web Pages - September 28, 2016
- What You Should Know About Converting Website Visitors To Clients - September 6, 2016
- The Ultimate Guide to Moving A WordPress Website - August 1, 2016
- Review of Zero Bullshit CRM for WordPress Plugin - July 8, 2016
- So You Want To Provide Coaching Online? Here’s What You Need To Know. - May 19, 2016
- 12 Free Online Tools I Use As a Freelance Web Designer - May 9, 2016
- Siteground Hosting Review by a Freelance Web Designer - May 1, 2016
- How To Create Your Google Accounts - March 31, 2016
- Completely Remove Programs from a Mac - January 16, 2016