YouTube Autoplay Unmute Restart :: CF Pro Tools Add-On Features For ClickFunnels Pages



Description and Best Use Case For This Add-On:

You may have seen this add-on debuted with the Traffic Secrets funnel by ClickFunnels. Guess what?  Now it works with YOUTUBE!


This add-on works best with a single video placed at the top of the page, and is built to overcome a lot of the browser updates that started blocking autoplaying videos with audio. 


This won't completely overcome the issue, BUT, it will prompt the user to click the play button and when they do click the play button to begin watching your video, then the video will UNMUTE and RESTART from the beginning.   


It will also autoplay so the the customer knows, "oh hey there's a video playing here" and they will avert their attention to see what's happening.   


This is how you get the attention where you need it.  



OVERVIEW (For Advanced Users)


For those of you ready to jump in and are familiar with CFProTools, you can use this checklist:


  • Add Your Domain To CFProTools DOMAINS TAB

  • Create Any Page

  • Add Video Element (For YouTube)

  • Set CSS TITLE for Video Element:  cf-yt-video

  • Create and Install Add-On Script

  • No Known Conflicts



Step 1:   Add Your Domain To CF Pro Tools DOMAINS TAB


Your first step will be to add your domain to the CFPT Domains Tab.

Here's a guide on how to do that:


https://cfprotools.freshdesk.com/support/solutions/articles/29000041078-how-to-add-a-domain-to-cf-pro-tools-online-installation-guides



Step 2:  Create Your Funnel Step


You can set this add-on up on ANY funnel type page.


Here's a quick tutorial on how to create funnel pages using ClickFunnels:


https://help.clickfunnels.com/hc/en-us/articles/360060380833-Creating-A-New-Funnel-Step


Please Note:  Only use this add-on with ONE Youtube Video per page as it may create unusual behavior when setting it up on more than a single video.




Step 3:  Insert Video Element


On any page, add the Video Element from the ClickFunnels list of native elements.




Set your video settings like this, but add your own YouTube Video URL in so your video plays:



Click the "#" ICON at the bottom of your settings window to update the CSS TITLE.   It should read:   cf-yt-video



CSS TITLE should of cf-yt-video should be lower case or it will not work



Click UPDATE button when finished.


Once Finished, SAVE your page settings.




Step 4:  Create Your YouTube Unmute Unpause Restart Script


Please note:  A Premium Account Is NOT Required To Use This Add-on



For most add-on installations of the YOUTUBE AUTOPLAY UNMUTE script, you can simply click the CREATE NEW button:



Please note:  You can use this script over and over for other order pages without having to create a new and unique script.



... now do a keyword search for YT AUTOPLAY UNMUTE


Once you have located the YT AUTOPLAY UNMUTE script, click the thumbnail image and create the add-on per the installation instructions.



You will need to name your script.   We recommend a naming convention like this:

YT AUTOPLAY (Test Funnel) or
YouTube AUTOPLAY (Book Funnel)

It's best to name it with the name of the add-on AND in parentheses, make sure to name which funnel it belongs to so you can easily identify later.



Once you have completed this area, click the red button below to create your add-on script.




Step 5:  Install Your Add-on Script


You can now copy your newly generated script out by clicking the blue button where your script is located.

The button says, "COPY CODE", this will copy the script to your virtual clipboard.



You are now ready to paste the script into your FOOTER TRACKING CODE AREA.


Please navigate to your funnel step where you wish to use YOUTUBE AUTOPLAY UNMUTE.


Click SETTINGS --> TRACKING CODE




Now click the FOOTER CODE TAB, and paste your code in:



Now SAVE your page, you are ready to preview and test your new add-on!



Known Conflicts:


No Known Conflicts



What To Do Next:


Here Are A Few Other Help Docs You May Wish To Check Out:


Chances are you already have a CF Pro Tools account and you can find all available resoureces, there: app.cfprotools.com


However, if you have do not yet have a CF Pro Tools account, you will need one in order to take the actions in this help doc.   You can sign up at any time here:   www.cfprotools.com


If you have questions, you can also hit us up in support at support@cfprotools.com