Remote Content

Embedded iFrame

Embed an external page (full content, style, javascript...) in a boxed iFrame in your page.

Removing the border, it will work like an original content.


Web Scraping

Extract contents from other websites to integrate yours.

Set the URL page you want to scrap and enable "Incorporate in page".

Your server will automatically fetch the entire Body of the external page and put it into Widget body.
If you only need a single element of the page, you can filter it setting a "Tag, ID or Class" related to the element you would like to use

 jQuery selector syntax

Here we have some examples of selector that you can use:

  • Tags: for example "quote", "header";
  • ID: for example "#my-content" , #footer;
  • Class: for example ".block", ".site-body > .title".

Read more about selector syntax:
https://www.w3schools.com/jquery/jquery_ref_selectors.asp

If there are several elements selected with setted selector, you can define how many elements to display:

  • only the first one;
  • all of them;
  • the first ten results.

EXAMPLE

Check here, a scrap from Wordpress site and Elementor website:
https://www.dynamic.ooo/demo/remote-content/

NOTE

  • Some sites do not allow this technique.
  • Pay attention to the original site data credits.

Rest API

Fetch JSON data result from remote service and print formatted contents.

First of all, set the URL of Endpoint you want to query, then enable "Incorporate in page" and enable the JSON format for return data.

You can manage return data as:

  •  a Single structure;
  • a repetitive block of an Archive with a initial structure;
The HTML representation of data is extreamly malleable, you can build the main block with dynamic contents using Tokens.
EXAMPLE
{"id":3798,"date":"2018-08-17T09:06:05","date_gmt":"2018-08-17T07:06:05","guid":{"rendered":"https:\/\/www.dynamic.ooo\/?post_type=dynamic_widgets&#038;p=3798"},"modified":"2019-03-16T20:18:46","modified_gmt":"2019-03-16T19:18:46","slug":"remote-content","status":"publish","type":"dynamic_widgets","link":"https:\/\/www.dynamic.ooo\/widget\/remote-content\/","title":{"rendered":"Remote Content"},"excerpt":{"rendered":"<p>View DEMO<\/p>\n","protected":false},"author":3,"featured_media":3718,"parent":0,"menu_order":32,"template":"","_links":{"self":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/dynamic_widgets\/3798"}],"collection":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/dynamic_widgets"}],"about":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/types\/dynamic_widgets"}],"author":[{"embeddable":true,"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/users\/3"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/media\/3718"}],"wp:attachment":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/media?parent=3798"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
  • Representative HTML code demo:
<div>
	<h3>[DATA:title:rendered]</h3>
	<div>[DATA:excerpt:rendered]</div>
	<a href="[DATA:link]">Read more</a>
</div>

See the example of an API call:
https://www.dynamic.ooo/demo/remote-content/


HTML Manipulation


  • Fix Relative Links, If scraped html code has a relative link this setting that will fix them transforming it in an absolute link.
  • Target Blank Links, if links are external, it adds automatically a target _blank attribute to the link tag;
  • Fix Lazy Images src, if remote site uses data-scr lazy load method then it converts to normal src on images tag.

Cache

In order to perform a better page load is important to enable Cache, so your server will not fetch remote contents on every page load (summing time of remote page load + local page load) but will respond quickly with cached results that will refresh on every a set time expire limit.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us