Joel Deleep
Joel Deleep

Reputation: 1398

Iframe an HTML file in a hugo post

I have a hugo post with the following front matter and content

---
title : "Hello World"
summary : "Simple program"
url : "program/helloworld"
--- 
<iframe width="100%" height="150" name="iframe" src="dashboard.html"></iframe>

The requirement is to render the HTML file as an iframe, and this is not for one post but for many posts, and the HTML file to render in the post will vary depending on the post. For example, it will be similar to the below front matter and content for another post,

---
title : "Hello Calc"
summary : "Simple program"
url : "program/calc"
--- 
<iframe width="100%" height="150" name="iframe" src="operations.html"></iframe>

The location of the HTML file to iframe is located at myblog/content/posts/helloworld/dashboard.html. The problem is, the HTML file is not rendered in the post.

Upvotes: 0

Views: 1250

Answers (1)

Joel Deleep
Joel Deleep

Reputation: 1398

The only thing that needed a change was the config.toml/config.yml. Since it is an unsafe operation it has to be defined in config file. index.md

+++
title = "Helloworld"
date = 2021-03-11T21:43:30-08:00
draft = false
url = "program/helloworld"
+++

<iframe width="100%" height="150" name="iframe" src="dashboard.html"></iframe>

content/posts/helloworld/dashboard.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0">
  <title>Dashboard</title>
</head>
<body>
  <p>This is content/posts/helloworld/dashboard.html.</p>
</body>
</html>

config.toml.

[markup.goldmark.renderer]
unsafe = true

Upvotes: 1

Related Questions