Remote Content -- Introduction
Article Contents
- Internal versus External Remote Content (RC)
- Remote Content Load Methods
- Set a Trigger to Display a Popup with Remote Content
- Remote Content Shortcode
- More Resources
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 |
|
|
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.
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
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.
- 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 |
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.
More Resources
For a guide on how to setup your Remote Content Popup or usage examples, check the related docs below: