Hub Hack: Bypass CTAs on Gated Items With a URL Parameter

Follow

Use this Custom Code snippet to automatically dismiss a Form CTA gating an Item when that Item is accessed using a special link.


Warning

Hub Hacks are not official Uberflip features.

Hub Hacks may not work on all Hubs, or may cause unexpected behavior. If you experience issues with a Hub Hack, available support is limited to helping you disable the Hub Hack only.

Details

  • Type: JavaScript
  • Placement: Body Bottom

This Hub Hack allows you to automatically dismiss the CTA gating an Item when it is accessed from a link that contains a certain URL parameter (which you can customize, if needed).

  • Determine which version of the Uberflip Hub Front End your Hub is using, then select the appropriate snippet below.
  • You can copy and paste the whole code snippet into a Custom Code Block without making any changes. By default, the parameter name that triggers the CTA bypass is set to bypassCta — we recommend changing this to a parameter name of your choice, but it can also be left as-is.
  • Once the Hub Hack is in place, you can bypass the CTA by adding ?bypassCta (or whatever parameter name you choose) to the end of the URL of a gated Item in your Hub. For example, if the Item My Book is gated with a CTA, the CTA would appear if you go to hub.mycompany.com/ebooks/my-book, but not if you visit hub.mycompany.com/ebooks/my-book?bypassCta.

 

Code

If your Hub uses Front End V1:

<script>
/* start bypass CTA function code */
$(window).on('load', bypassCTA ); //must fire the bypassCTA function after everything loads, including the CTA
function bypassCTA(){
var hideWithThisParam = 'bypassCta';
/*change bypassCta to the URL parameter value you want to use to hide the CTA */
var params = {};
$.each(location.search.substr(1).split('&'), $.proxy(function(idx, pair) {
if (pair === '') return;
var parts = pair.split('=');
this[parts[0]] = parts[1] && decodeURIComponent(parts[1].replace(/\+/g, ' '));
}, params));
$.each(params, function(idx, val){
if(idx == hideWithThisParam) {
$('.blocking-cta').removeClass('blocking-cta');
$('.hide-embed').removeClass('hide-embed');
$('.block-cta').remove();
$('.possible-block').removeClass('possible-block');
}
});}
/* end bypass CTA function code */
</script>

If your Hub uses Front End V2:

Important

This code snippet requires the Compatibility Pack app to be installed in your Uberflip account to function.

<script>
/* start bypass CTA function code */
const bypassCTA = () => {
console.log('event fired');
var hideWithThisParam = 'bypassCta';
/*change bypassCta to the URL parameter value you want to use to hide the CTA */
var params = {};
$.each(location.search.substr(1).split('&'), $.proxy(function(idx, pair) {
if (pair === '') return;
console.log(pair);
var parts = pair.split('=');
this[parts[0]] = parts[1] && decodeURIComponent(parts[1].replace(/\+/g, ' '));
}, params));
$.each(params, function(idx, val){
if(idx == hideWithThisParam) {
console.log('params match');
$('.uf-gated-content').removeClass('uf-gated-content');
$('.uf-is-gated').removeClass('uf-is-gated');
$('.uf-gated-cta-wrapper').remove();
}
});
}
window.addEventListener('uberflip.load', () => {
bypassCTA();
} ); //must fire the bypassCTA function after everything loads, including the CTA
/* end bypass CTA function code */
</script>
2 out of 2 found this helpful

Comments

0 comments

Please sign in to leave a comment.