0

I have a page that I want to include an external HTML page on. It will be located on my left column. It is an affiliate store column which lists their products from their page in an unstyled fashion. See [ http://store.vampirefreaks.com/?cat=collars&aff=synester_shadows&cols=1&numitems=5 ]. I am wondering how can I include that page with javascript and style it to where the links, images, background, and more match my pages CSS.

2 Answers2

0

I would recommend using includes within PHP, if you're application is running on a PHP server. It will simply include the desired script into the page right where you place it, like so:

body.php:

<p>This is a body page!</p>

index.php:

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8" />
<title>Home</title>
</head>

<body>
<?php include('body.php'); />
</body>
</html>

index.php after processing:

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8" />
<title>Home</title>
</head>

<body>
<p>This is a body page!</p>
</body>
</html>

Notice that body.php does not include a <!DOCTYPE>, <html>, or <body> tags. PHP will place the contents of body.php exactly as it sees it. You can include stylesheets and JavaScript within index.php which will style and manipulate the included content as desired.

Hope that helps.

EDIT:

Using jQuery to fetch a page and place it in a container:

$.ajax({
  'url' : '/path/to/page.html',
  'success' : function(data) {
    $('div#container').html(data); //Place the fetched content into a <div> with an ID of container
  }
});

Keep in mind that the above code will only work if you are fetching content from the same domain.

Oliver Spryn
  • 16,871
  • 33
  • 101
  • 195
  • Unfortunatly I use webs.com as a host (fail) so I am limited to javascript, JQuery, css, and html only. SSI doesnt even work. Have any AJAX suggestions? Im pretty new to Javascript so currently I fail alot. – Jesse Toxik Jul 23 '12 at 00:56
  • Ah, well the issue is it is separate domains. I on webs.com and the included page on store.vampirefreaks.com – Jesse Toxik Jul 23 '12 at 01:00
  • @JesseToxik Your best bet is to try setting the `dataType` parameter to `jsonp`, and fetching cross-domain from there. Otherwise, you'll have to use an iframe: `` – Oliver Spryn Jul 23 '12 at 01:04
0

You may have 3 options to do that:

  1. If you're using PHP, you can use include statement
  2. Use ajax to grab the content of the page and inject into the main page
  3. Use iframe
Davuth
  • 555
  • 3
  • 9
  • 16
  • I agree with your first two suggestions, but IMHO iframes and frames in general should be steered clear from. They never really were a great thing for the web. – Oliver Spryn Jul 23 '12 at 00:51
  • Unfortunatly I use webs.com as a host (fail) so I am limited to javascript, JQuery, css, and html only. SSI doesnt even work. Have any AJAX suggestions? Im pretty new to Javascript so currently I fail alot. – Jesse Toxik Jul 23 '12 at 00:55