Member Avatar for rimfirelive

I am having horrible formatting issues on the displayed page. I am trying to develop a template page that can be lunched from a link. This template page will contain the automated formatting to display the entire contents, of a "suppliers" website; while keeping the user within our site. I would like this page to be able to recall data from the link's id to replace the url each time... so that the tempate is reusable for any domain. I have tried to make the "Home" link take user back to default page... with no luck... it just sits there. The url to th main page is and the page i am attempting to develop is

I am thinking a CSS will work along with JS. Just need help on all of it ;)

THank you in advance for any asistance!

  • 2 Contributors
  • 3 Replies
  • 231 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by rimfirelive

Dani AI

Generated

Short summary and recommended pattern: build a single template (vendor.php) that receives either a vendor id (preferred) or an encoded supplier URL in the query string, validates that input server‑side, and then places it into an iframe. As pointed out, malformed hrefs will stop the link from launching; confirm links use a proper protocol (http:// or https://) or correct relative paths. Note that renamed vendor.html to vendor.php — use that filename consistently.

Example link pattern (index page):

<!-- index.html -->
<a href="vendor.php?src=https%3A%2F%2Fsupplier.example.com%2Fpage">Open supplier</a>

Server-side: validate or map the incoming value (avoid blindly embedding arbitrary URLs). Mapping by id is safest — it prevents open redirects and allows whitelisting:

<?php
$map = ['kuriyama' => 'https://supplier.example.com/page'];
$id  = $_GET['id'] ?? '';
$src = $map[$id] ?? '';
?>
<iframe id="vendorFrame" src="<?php echo htmlspecialchars($src,ENT_QUOTES); ?>" style="width:100%;border:0;"></iframe>

Auto-height and cross-origin constraints: if the supplier page is same-origin you can read its document and set iframe height on load. If it is cross-origin you cannot access content height directly. Two practical options:

  • Ask the supplier to postMessage its height to the parent (requires cooperation). Parent listener example:
    window.addEventListener('message', e=>{
if (e.data && e.data.type==='height') {
  document.getElementById('vendorFrame').style.height = e.data.value + 'px';
}
});
  • Or serve the supplier page through a server-side proxy (same-origin) — be aware of legal, caching and security implications.

Debug checklist: check browser console/network for “Refused to display … in a frame” (X-Frame-Options or CSP frame-ancestors), confirm your hrefs include the protocol, verify vendor.php receives the expected query string, and test the iframe load event in devtools.

Recommended Answers

All 3 Replies

Member Avatar for rimfirelive

I appreciate the effort. I am still having problems. I have tried so many different ways to make this link happen. No Luck! It appears to be pointing in the right direction... but will not "launch" or "initiate". Also, I need to find a way to replace the "iFRAME" src on this page dynamically to match the "link to" from which this page is launched on the index.html page, so that it (vendor.html) displays the appropriate, correct url, source html. Then finally, how to make the "height" of this iFRAME automatically adjust to the src height. I know, i don't ask much right ;)

Member Avatar for rimfirelive

the "vendor.html" file has changed to "vendor.php"

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.