Adding pop-ups to WordPress site

Last updated: October 20, 2021 Written by: Avatar Marta Szeliga
share
Table of contents
share
Table of contents

Adding pop-ups created in Landingi to your WordPress site can be done in few simple steps. 

With Landingi dedicated WordPress plugin

If you use one of our plugins (Landing Pages App or Landingi Landing Pages) and you have your landing page imported thanks to it, you do not have to do anything else – the code enabling the display of the pop-up will be added automatically in the final stage of creating the pop-up:

popup landingi

Add a pop-up to another page powered by WordPress

If you want your pop-up to be added to your own site (outside Landingi) powered by WordPress, take the steps indicated below.

1. On the final stage of creating the pop-up in Landingi, copy the automatically generated HTML code.

pop up code landingi

2. Go to your WordPress dashboard. In the menu on the left, navigate to the Appearance (1) tab and click Theme Editor (2).

3. You will see the window with the option to edit the theme in a source code. On the right side, click on Theme Header file (header.php).

add code to wordpress header

4. After that, you will see the window with the <!doctype html> code. Paste the code generated in Landingi to the section, preferably at its end. Remember to do so before the closing tag!

5. Click Update File.

IMPORTANT: After pasting the code into the header.php file, it will be installed automatically for the whole page together with all its subpages.

Define where exactly the pop-up will display

I want my pop-up to display only on one or chosen subpages

1. Copy the code:

<?php if (is_page(['subpage_name'])) : ?> 
<script src="https://popups.landingi.com/api/website/install-code?apikey=XXX"></script> 
<?php endif; ?> 

In the first function (first line), define on which subpage (or more subpages) the pop-up should display, e.g., [‘contact’], [‘about_us’], ['contact', 'our_products'].

In the second line, replace our example with the code from the last step of pop-up publication.

2. Paste the whole code at the end of the HTML section in WordPress.

3. Click Update File.

I want my pop-up to display on all of the pages except the selected ones

1. Analogously, as shown above, copy the code, this time containing negation (!):

<?php if !(is_page(['subpage_name'])) : ?> 
<script src="https://popups.landingi.com/api/website/install-code?apikey=XXX"></script> 
<?php endif; ?> 

In the first function (first line), define on which subpage (or more subpages) the pop-up should not display, e.g., [‘contact’], [‘about_us’], ['contact', 'our_products'].

In the second line, replace our example with the code from the last step of pop-up publication.

2. Paste the whole code at the end of the HTML section in WordPress.

3. Click Update File.

Choose where to display your pop-up on the publishing stage

You can choose where to display your pop-up when you are still on the publishing stage in the Landingi platform: 

where to display popup landingi

share

Was this manual helpful?