Setting Up Website Campaigns

Once you have set up the connection between your website and PathFactory, you are ready to add and configure Website Campaigns!

By default all clicks to Website Campaigns open as a Content Track in a new tab. Some customers have requested the ability to open clicks to Website Campaigns as overlays embeds. While that functionality is not a part of the current PathFactory platform, our solutions team has developed external code that can be added to your website which can change the behaviour of clicks to Website Campaigns, causing them to open as overlay embeds. For more on how to implement this see Open as an Overlay Embed below.

The Card promoter appears on the right side of a webpage after the visitor has scrolled a certain distance.

The Exit promoter appears once the visitor shows an intent to leave. As soon as their mouse leaves the browser window, the exit promoter will appear.

The Inactivity promoter appears within the browser tab if the visitor leaves the content track tab open while viewing other tabs. This acts as an eye-catching alert to get the visitor back on your content track and consuming more content.

The In-Page promoter allows you to promote your content directly within your webpage. In the example below, clicking on any of the image tiles opens up a Content Track.

Example of what a DIV Element looks like on the HTML Editor:

This overlay embed option allows you to take the Website Campaigns outlined above and open the resulting Content Track as an overlay embed instead of opening in a new tab. When the visitor clicks on a link in a Website Campaign they’ll see the Content Track in the same tab over top of the webpage.

To use this, start by implementing the web promoter you wish as previously documented above. The additional scripts shown below should be inserted into your webpage HTML, sitting immediately after your PathFactory Website Script Tag inside of the  tags. Add whichever scripts below you require for the corresponding Website Campaign you’re using.

Card promoter script:

<link href="https://app.cdn.lookbookhq.com/libraries/overlay/overlay.css"" rel="stylesheet" type="text/css" />
<script>
	var runtimes = 0
handleJukeboxDispatchedEventsCAOverlay=function(event){
	switch(event.detail.eventName){
		case"click_show":
			if(event.detail.promoter=='card'&&runtimes == 0) {
		var links = document.querySelectorAll("div#qa-card-promoter-carousel a");
		links.forEach(function(l){
		var newhref=l.getAttribute("href");
		newhref=newhref+(newhref.indexOf("?")>-1?"&":"?")+"lb-mode=overlay&lb-width=95%25&lb-height=95%25"
					l.setAttribute("href",newhref);
				});
				var overlayjs=document.createElement('script');
				overlayjs.setAttribute('type','text/javascript');
				overlayjs.setAttribute('async',true);
				overlayjs.setAttribute('src','https://app.cdn.lookbookhq.com/libraries/overlay/overlay.js';);
				document.getElementsByTagName('head')[0].appendChild(overlayjs);}
			runtimes = 1
break;
	};
}
;window.addEventListener("pf_event",
this.handleJukeboxDispatchedEventsCAOverlay,false); </script>

Bottom Bar promoter script:

<link href="https://app.cdn.lookbookhq.com/libraries/overlay/overlay.css"" rel="stylesheet" type="text/css" />
<script>
	var runtimes = 0
handleJukeboxDispatchedEventsBBOverlay=function(event){
	switch(event.detail.eventName){
		case"click_show":
			if(event.detail.promoter=='bottom_bar'&&runtimes == 0) {
				var links = document.querySelectorAll("div#bottom-bar-carousel a");
				links.forEach(function(l){
					var newhref=l.getAttribute("href");
					newhref=newhref+(newhref.indexOf("?")>-1?"&":"?")+"lb-mode=overlay&lb-width=95%25&lb-height=95%25"
					l.setAttribute("href",newhref);
				});
				var overlayjs=document.createElement('script');
				overlayjs.setAttribute('type','text/javascript');
				overlayjs.setAttribute('async',true);
				overlayjs.setAttribute('src','https://app.cdn.lookbookhq.com/libraries/overlay/overlay.js';);
				document.getElementsByTagName('head')[0].appendChild(overlayjs);}
			runtimes = 1
break;
	};
}
;window.addEventListener("pf_event",
this.handleJukeboxDispatchedEventsBBOverlay,false);
</script>

In-Page promoter script:
Make sure to replace the highlighted text with your website’s domain.

<link href="https://app.cdn.lookbookhq.com/libraries/overlay/overlay.css"" rel="stylesheet" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/arrive/2.4.1/arrive.min.js"" integrity="sha256-WXHeZwrvHW+Qpj5u2NCVyiL5XEVf/AzrYL5i4w4aRHM=" crossorigin="anonymous"></script>
<script>
   document.arrive("#qa-website-inject-items", function () {
       var links = document.querySelectorAll('div#qa-website-inject-items a[href^="INSERT WEBSITE DOMAIN in https:// format"]');
       links.forEach(function (l) {
           var newhref = l.getAttribute("href")
           newhref = newhref + (newhref.indexOf("?") > -1 ? "&" : "?") + "lb-mode=overlay&lb-width=95%25&lb-height=95%25"; //update width and height for desktop
           l.setAttribute("href", newhref);
       });
   });
   var overlayjs = document.createElement('script');
       overlayjs.setAttribute('type', 'text/javascript');
       overlayjs.setAttribute('async', true);
       overlayjs.setAttribute('src', 'https://app.cdn.lookbookhq.com/libraries/overlay/overlay.js';);
   document.getElementsByTagName('head')[0].appendChild(overlayjs);
</script>

If the above In-Page promoter Overlay script doesn’t work, the following script is an alternative:

<link href="https://app.cdn.lookbookhq.com/libraries/overlay/overlay.css"" rel="stylesheet" type="text/css" />
<script>
handleJukeboxDispatchedEventsIPoverlay=function(event){switch(event.detail.eventName){case"load_show":if(event.detail.promoter=='in_page')
{var links=document.querySelectorAll("div#qa-website-inject-items a");links.forEach(function(l){var newhref=l.getAttribute("href");newhref=newhref+(newhref.indexOf("?")>-1?"&":"?")+"lb-mode=overlay&lb-width=95%25&lb-height=95%25"
l.setAttribute("href",newhref);});var overlayjs=document.createElement('script');overlayjs.setAttribute
('type','text/javascript');overlayjs.setAttribute('async',true);
overlayjs.setAttribute('src','https://app.cdn.lookbookhq.com/libraries/overlay/overlay.js';);document.getElementsByTagName('head')[0].appendChild(overlayjs);}
break;}}
;window.addEventListener("pf_event",
this.handleJukeboxDispatchedEventsIPoverlay,false);
</script>