Search code examples
phpwordpresshtmljsonpembed

Embed div content from external site onto another site


I'm working on building a new website for a friend who runs a local business. He currently pays for a different website built on a proprietary CMS that gets updated regularly with news from his industry.

While his current website is functional, it looks bad, doesn't have a responsive template that's mobile-friendly, and doesn't rank very well in search results. I am helping him build a new website on Wordpress, but he wants to continue benefiting from the automatically updated news content on his current website.

On the current website (Site A), all the news content is contained in div id ='newscontent' and is updated every month by his service provider. How can I embed the content from that entire div into the Wordpress site I'm building (Site B) so that every month the Wordpress site also contains the auto-updated industry news content?

After searching various forums for a few hours, I've seen the following methods suggested, but I'm not exactly sure on how to implement them. Which one is my best bet, and how would I implement it?

  1. PHP CURL
  2. YQL and JSON
  3. JSONP
  4. Any other suggestions?

I believe I don't want to use AJAX or any type of "onclick" command -- in other words, I don't want the user to have to click a button in order to see the content. I want the content to automatically load, as if using an iFrame. I also don't want to use an iFrame, because then people will see the entire page, including the navigation menu on his current website. I don't want to use CSS "margin-left" or "height" to modify what the iFrame shows, because chances are it won't work well or look right on a mobile device. Lastly, I believe I can't use JQUERY/Javascript because I doubt his current website has CORS enabled and he and I have no control over that.

As you can probably tell, I'm pretty limited when it comes to coding, so your help is greatly appreciated. Thanks in advance!


Solution

  • If you dont have access to the data source which outputs that div's html, you would have to parse the whole output html of that page, which is possible but not very reliable. Another hacky method would be using an iframe with positioning. Also not nice.

    Best would be if you had access to the data source of that div and build a REST Service on Site A like so: http://net.tutsplus.com/tutorials/other/a-beginners-introduction-to-http-and-rest The data format does not matter as much, most prefer JSON nowadays, but you could also send html data if you wanted to.

    If you have your REST service in place on site A, a client service on Site B which retrieves the data could be called via a cron job for example.