Skip to content

Instantly share code, notes, and snippets.

View johnnyopao's full-sized avatar
✌️

Johnny Opao johnnyopao

✌️
View GitHub Profile
@johnnyopao
johnnyopao / facebookformfill.md
Last active December 15, 2022 11:43
Fill your Unbounce Forms using Facebook data
@johnnyopao
johnnyopao / GA-Universal-Unbounce-Variants.md
Last active December 15, 2022 11:43
Track each variant with Universal Analytics

Tracking the different variants using Google analytics requires a slight modification of your tracking script

Replace the line below in your Google Analytics script

ga('send', 'pageview');

with this

@johnnyopao
johnnyopao / FixedHeaderOrFooterMenu.md
Last active December 15, 2022 11:43
Centered fixed header or footer menu on Unbounce (Set placement to 'before body end tag')
@johnnyopao
johnnyopao / HiddenFixedHeaderMenu.js
Last active December 15, 2022 11:43
Hidden from top Fixed Header Menu
<script>
//Hidden Fixed header v1.1
//Replace ID below with your box ID
var boxToFix = '#lp-pom-box-88';
//Set the number of pixels to scroll before showing the header
var scrollPositionToShowHeader = 50;
@johnnyopao
johnnyopao / ub-inline-content-lightbox.js
Last active December 15, 2022 11:43
Display your Unbounce form or any inline content in a lightbox without creating a new page (set placement to 'head')
<script>
//Unbounce inline content lightbox v2.0
//ubContentLightbox('boxContainingForm', 'buttonToTriggerLightbox');
ubContentLightbox('#lp-pom-box-113', '#lp-pom-button-29');
ubContentLightbox('#lp-pom-box-120', '#lp-pom-button-121');
document.write('<style type="text/css"> #fancybox-outer {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}</style>');
@johnnyopao
johnnyopao / ub-inline-content-lightbox-min.md
Last active December 15, 2022 11:43
Display your Unbounce form or any inline content in a lightbox without creating a new page (Two step opt-in form)

Display your Unbounce form or any inline content in a lightbox without creating a new page. This can be used to create a two step opt-in form

Example page:

http://unbouncepages.com/lightbox-form/

Steps:

  1. Drop in a button (if you haven’t already) which will act as the trigger that opens up your form lightbox. While this button is selected find it’s ID under the ‘advanced’ tag. Take note of this ID.
@johnnyopao
johnnyopao / left-align-root.css
Created October 14, 2014 23:50
Align Page content Left on Unbounce Pages
<style>
#lp-pom-root {
float:left;
}
</style>
@johnnyopao
johnnyopao / text-image-GA-events.js
Last active December 15, 2022 11:39
Triggering GA events for image/text links on Unbounce
<script>
// Replace #lp-pom-image-13 with the ID of your image or text box. Be sure to retain the trailing 'a'
$( '#lp-pom-image-13 a' ).click( function(event) {
event.preventDefault();
var buttonLink = $(this).attr("href");
if (typeof ga != 'function') {
window.location = buttonLink;
@johnnyopao
johnnyopao / StateValAbb.js
Last active December 15, 2022 11:43
Assign state abbreviations to your Unbounce 'State' dropdown field
<script>
$(function() {
// The dropdown's ID
var id = '#state';
var values = {
'Alabama': 'AL',
'Alaska': 'AK',
@johnnyopao
johnnyopao / youtube-vb.js
Last active December 15, 2022 11:43
Youtube Video Background for Unbounce pages
<script>
// Youtube Video Background for Unbounce. V1.3.5
// lpVideoBG('#SectionID', 'YoutubeVideoID', width, height, muted);
// Use '#lp-pom-root' for a full page video background
lpVideoBG('#lp-pom-block-9', 'vLUNWYt3q1w', 560, 315, 0);
function lpVideoBG(pageSectionID, youtubeVideoCode, videoWidth, videoHeight, muted) {
var onMobile = navigator.userAgent.match(/(Android|iPod|iPhone|iPad|iemobile|blackberry)/);