Brand Assets

Thanks for your interest in affiliating with Popup Maker

Below are a few guidelines for using Popup Maker’s brand resources, please take a moment to familiarize yourself with them. You can download individual assets in each section, or you can download everything all at once below.

Download All Assets

Our Name is Popup Maker

Popup Maker is two words. Always capitalize the P and the M.

Brand Name

PopupMaker

Not like this.

popup maker

Not like this.

POPUP MAKER

Not like this.

popupmaker

Not like this.

Popup Maker Colors

These are Popup Maker’s brand colors – copy the color codes below.

Brand Colors

Primary

#1dbe61

Light

#21db6f

Base

#1dbe61

Popup Maker Logo

These are Popup Maker’s marks & logos – copy or download in PNG/SVG format.

Logos & Marks

Not yet an affiliate?

Become an Affiliate
Earn commission when you recommend Popup Maker to your friends, fans & clients.
Sign Up

Popup Maker Historical Branding

These are Popup Maker’s past marks, logos & colors. Here for fun and archives.

Historical Marks, Logos & Colors
Popup Maker Logo - Archived
Popup Maker Logo - Archived
Popup Maker - Mark - Archived
Popup Maker - Mark - Archived

Primary

#9ab927

Light

#a8cb29

Base

#2d2d2d

Gray 1

#626262

Gray 2

#cacaca

Gray 3

#dfdfdf
View Categories

Use Inline JavaScript and jQuery to Trigger a Popup With a Click

Turn On Support for Inline JavaScript #

WordPress automatically strips out JavaScript any time you add it directly in the classic and block editors. 

To allow support for adding JavaScript in the editor, add the following WordPress PHP filter. You can add the PHP code snippet to your child theme’s  functions.php file or with a third-party plugin such as My Custom Functions

<?php

// Copy everything below this line //
add_filter( 'kses_allowed_protocols', 'my_allowed_protocols' );
/**
 *  Description
 *
 *  @since 1.0.0
 *
 *  @param $protocols
 *
 *  @return array
 */
function my_allowed_protocols ( $protocols ) {
	$protocols[] = "javascript";
	return $protocols;
}

View the source on GitHub.

3 Ways to Use Inline JavaScript to Launch Your Popup #

PUM.open() in the href attribute #

Method #1: Use the global function ‘PUM.open()’ as described in the Popup Maker jQuery API.

// The parameter '123' refers to a generic popup ID.
// Substitute the actual ID number generated for your popup.
<a href="javascript:PUM.open(123);">Sign Up For Our Newsletter!</a>

View the source on GitHub.

PUM.open() in the onclick attribute #

Method #2: Use the ‘PUM.open()’ function assigned to an ‘onclick’ link attribute. 

// The parameter '123' refers to a generic popup ID.
// Substitute the actual ID number generated for your popup.
<a href="#" onclick="PUM.open(123);">Sign Up For Our Newsletter!</a>

View the source on GitHub.

Use CSS Selectors and jQuery #

Method #3: Target one or more CSS selectors with jQuery to open a specific popup with the .on( ‘click’ ) method. 

<button id="my-button">Click Me</button>
// Replace the CSS selector '#my-button' with the selector(s) to be targeted by
//    the .on( 'click' ) method.
// The parameter '123' in the .open() method refers to a generic popup ID number.
// Substitute the actual ID number generated for your popup.
<script type="type/javascript">jQuery('#my-button').on('click', function () {
    PUM.open(123);
    });
</script>

View the source on GitHub.

Leave the first comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.