[WordPress] Put your own HTML page on WordPress

Last Updated on 2021-06-27 by Clay

Recently, I have been looking for a long time how to display the HTML page I wrote in the WordPress blog, and actually tested a few methods. At present, I have recorded the simpler method so that I can use this method in the tuture.

This method is not complicated at all, basically just copy the HTML code written by yourself into the main path of WordPress. As long as the file is in HTML format, it should be able to open normally.

I will record my personal process once below. Maybe it is not the same as others but it's basically the same way of thinking.

Perpare your HTML file

Assume I have a file named test.html.

<!DOCTYPE html>
<html lang="en">
<head>
     <meta charset="UTF-8">
     <title>ClayAtlas-HTML</title>
</head>
<body>
     <input id="text">
     <input type="button" value="Enter" onclick="showButtonEvent()">
     <p id="changeText">NULL</p>
</body>
<script>
     function showButtonEvent()
     {
         var content = document.getElementById("text");
         document.getElementById("changeText").textContent=content.value;
     }
</script>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
     <meta charset="UTF-8">
     <title>ClayAtlas-HTML</title>
</head>
<body>
     <input id="text">
     <input type="button" value="Enter" onclick="showButtonEvent()">
     <p id="changeText">NULL</p>
</body>
<script>
     function showButtonEvent()
     {
         var content = document.getElementById("text");
         document.getElementById("changeText").textContent=content.value;
     }
</script>
</html>

Output:

ClayAtlas-HTML

NULL

Its function is that the text in the input box will be displayed on the NULL text component when the Enter button is presswed.