Pull in html code from Github pages

Updated to add the solution I located:

I added the following custom code (sourced from here) to an embed element to pull from the html code I had hosted in Github so I could add html code that far surpassed the 10,000 character limit.

You’ll need to just add a class name to your embed element and then make sure that’s referenced properly within the code. And, of course, you’ll need to link to the code you have hosted elsewhere (I indicated these in all caps in the code below). Hope this helps someone! :slight_smile:

</script>

<html>
<script>
function includeHTML() {
  var z, i, elmnt, file, xhttp;
  /*loop through a collection of all HTML elements:*/
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    elmnt = z[i];
    /*search for elements with a certain atrribute:*/
    file = elmnt.getAttribute("YOUR-EMBED-ELEMENT-CLASS-NAME-HERE");
    if (file) {
      /*make an HTTP request using the attribute value as the file name:*/
      xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4) {
          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
          /*remove the attribute, and call this function once more:*/
          elmnt.removeAttribute("YOUR-EMBED-ELEMENT-CLASS-NAME-HERE");
          includeHTML();
        }
      }      
      xhttp.open("GET", file, true);
      xhttp.send();
      /*exit the function:*/
      return;
    }
  }
};
</script>

<body>

<div YOUR-EMBED-ELEMENT-CLASS-NAME-HERE="DIRECT LINK TO YOUR HTML CODE HERE"></div> 

<script>
includeHTML();
</script>

</body>
</html>

------ Original question below:

Hi there,

I ran into an issue where I have some html code I need to embed into my site, but it’s over the 10,000 character limit. I’ve read multiple forum posts that say you can host the html code within Github and then pull that into the embed element via some script.

However, the resources I’m able to find on the forum appear to be outdated and, being someone who doesn’t know much about code at all, I have no idea what kind of script I need to pull the html file into my site, and render the html correctly. (I was able to pull in the actual html text and commands and such, but I don’t know how to get the html to display properly.)

This is the code that pulled in the html text - but I don’t know what to do now with it:

<div id="ajaxContent"></div>
<script>
var Webflow = Webflow || [];
Webflow.push(function() {
$.get('https://cdn.jsdelivr.net/gh/MyRepositoryInfo/Nameofmyfile.html', 
function(data) {
  $('#ajaxContent').append(data);
});
});
</script>

Anyone have any advice they can share? Thank you!


Site needs to remain private, so I can’t share the read-only link.