Remote Content -- Introduction

Article Contents


Internal versus External Remote Content (RC)

The Remote Content (RC) plugin extension for Popup Maker allows users to fill a popup with content from a remote source relative to the page on which the popup is triggered. Remote content can originate from any source that is not on the immediate page

Remote content called from within an existing site is categorized as internal RC, while content called from an different site is external RC.  The distinction is important in order to select the proper content load method within the plugin. 

Table 1. The Differences Between Internal and External Remote Content

Type Internal Remote Content External Remote Content
Source Content originates from the same site as the popup URL.  Content originates from a different site relative to the popup URL.
RC Load Method Load from URL,
Post Type (experimental),
AJAX
iFrame, 
iFrame -- Default IFrame URL
Content Loaded
  • Entire or part of a page or post (Load from URL method);
  • From an HTML template that targets a specific post type (Post Type method);
  • Dynamic customizations (AJAX).
  • From the entire page (iFrame method). 

The plugin extension allows users to open links, and remote pages, posts, images, or popups inside a popup. Plugin users have the option to create an AJAX call to dynamically customize popup content from an internal RC source based on the link selected within a popup.

[ Back to Top ]


Remote Content Load Methods

This plugin loads remote content sources by one of 4 methods: 

  • Load from URL
  • Post Type
  • iFrame
  • AJAX

Each of the these load methods targets an HTML 'href' attribute within a link on a page or post. The link URL in the example below refers to a remote content source (relative to the page or post on which the link appears). 

<a href=“https://www.example.com/my-awesome-remote-content”>
A Page Link</a>

The plugin's 'Load from URL' and 'iFrame' methods are the most common ways that remote content is displayed in a popup container. The selection of each method depends on the source of the remote content (internal versus external). 

When using the 'Load from URL' method to display part of a post or page, use the Remote Content Area shortcode 'Content CSS Selector' field to target the HTML element and/or attributes that  contains the intended content.  Some knowledge and understanding of HTML and CSS is necessary to identify and target the container markup.

The AJAX method uses jQuery and PHP to load and style content linked to a page element. Consult the related article below for details on the use of that method.

Related article:  Remote Content AJAX Type Introduction

[ Back to Top ]


Set a Trigger to Display a Popup with Remote Content

The RC plugin extension requires the use of a popup trigger to display remote content. The  'Click Open' trigger  is used with each of the plugin's 4 content load methods. 

For users unable to set a 'Click Open' trigger on a link, the 'iFrame -- Default iFrame URL' method now accepts a  'Time Delay / Auto Open' trigger. The iFrame method can only be used to display remote RC (relative to the popup site URL). 

Display RC with a 'Click Open' Trigger

Use the 'Click Open' trigger  'Extra Selectors' method (Method #2) to set a trigger on the page link as described in the following related article. 

Related article: Setting Up a Remote Content Popup.

Find CSS Selectors Within a Target Link

If using the 'Load from URL' method to display  part of a page or post inside a popup, users should know how to identify the containing HTML element and/or attributes within a page to properly target the remote content. 

When following the 'Extra Selectors' method for setting a 'Click Open' trigger, users have   3 options available to find the CSS selectors within a target link:
  • The Popup Maker CSS Selector tool (build into the WP Admin tool bar when logged in as an Admin user);
  • The Google Chrome extension ‘jQuery Unique Selector’ (for Chrome browser users), or
  • Manually by using developer tools (e.g. Chrome Dev Tools, Firefox Web Developer, or Safari Web Inspector). 

Display RC with a 'Time Delay / Auto Open' Trigger

The 'iFrame -- Default iFrame URL' method now accepts the use of an 'Auto Open' trigger as a replacement for a 'Click Open' trigger.  The 'Default IFrame URL' field must contain the remote source URL in order to display that content within a popup.  When the popup targeting conditions are met, and the 'Auto Open' trigger fires, the popup will display the contents of the entire remote URL

Table 2. Trigger and Page Link Requirements for Each RC Plugin Load Method

Load Method Trigger Page Link Required
Load from URL Click Open Yes
Post Type Click Open Yes
iFrame Click Open Yes
iFrame -- Default
iFrame URL field
Time Delay /
Auto Open
No
AJAX Click Open Yes

[ Back to Top ]


Remote Content Shortcode

The Remote Content plugin extension registers a shortcode with WordPress ( tag: [pum_remote_content] ) to set the plugin options. The plugin uses the Popup Editor shortcode button to easily set the shortcode in the content editor.

Once the shortcode is set, select the button labeled 'Dynamic/remote content area' to open the 'Remote Content Area' box. The option settings box provides an easy way to edit or update the shortcode attributes. 

Related article:  Remote Content -- Shortcode: Remote Content Area.

[ Back to Top ]


More Resources

For a guide on how to setup your Remote Content Popup or usage examples, check the related docs below: 

[ Back to Top ]