When using the custom embed feature in sites, it is common to come across an error which says that a web address cannot be embedded because the X-Frame options do not allow it to be. This error is a security feature for web browsers which allows other websites to prevent people from placing their content within another site.

However, in a lot of those cases, those applications provide code to embed their content. Let's look at Twitter for example. If we read their guide at https://help.twitter.com/en/using-twitter/embed-twitter-feed we can see that the first thing to do is to visit https://publish.twitter.com/#.

We can then enter different information to get a timeline. For this example we are going to enter @zoomforth. When shown the options for embedding, we can select Embedded Timeline. We will now be given code to embed this timeline:

<a class="twitter-timeline" href="https://twitter.com/Zoomforth?ref_src=twsrc%5Etfw">Tweets by Zoomforth</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

This is great, but you'll notice pretty quickly that you cannot embed this as is. It is not a plain web address and if you do copy the web address for this snippet of code then it will not work.

However, this can be embedded as an HTML Package. HTML Packages are an advanced feature that require a certain level of coding experience. You will be able to copy the code you received from Twitter into an index.html file as explained in that guide and once you package it up it can be used just like the custom embed feature.

You can see an example site here.

Did this answer your question?