How to render differently markdown on Github repository vs GitHub pages to add an iframe?

Question

I'm using an <iframe> HTML tag to embed some content in a markdown file Github serves as a page (the GitHub Pages feature).

When seen in the repository (it's a documentation file that should be readable from the repo too) it looks very ugly as a non-rendered <iframe> tag.

Is there a way to show the iframe in the final page but hide it's HTML in the repo?

Better yet, is there a way of showing something else instead, like a nice replacement image and a link (and hide those in the final page)?

Answer 1

This goes inside the markdown file:

   <a id="iframeLink" href="https://...">Visible link text</a></p>
   <div id="iframeDiv"><img src="image_for_repository.png"></div>

This should go inside the repo's _layouts/default.htm

<script>function change(tagaid,tagdivid) {
let l=document.getElementById(tagaid);
document.getElementById(tagdivid).innerHTML = "<iframe src='"
+ l.href + "' frameborder=0 width=400 height=400></iframe>";
l.innerHTML = "";
}
change('iframeLink','iframeDiv');</script>