'Nothing showing on my webpage when I try to use render_template Flask
Im trying to create a webpage for displaying some statistics and information through VSCode. When I use the render_template function of an HTML file, the webpage is empty and displays nothing.
This is my main code:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
if __name__ == "__main__":
app.run(debug=True)
This is my HTML file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{{ url_for ('static', filename='css/main.css') }}">
<title> Document</title>>
</head>
<body>
Hello
</body>
</html>
Solution 1:[1]
This is probably because the folder that you have your HTML in is not named as templates I believe having a structure like this would make your life easier:
Flask App
templates
base.html
index.html
posts.html
app.py
I hope that this helps
Solution 2:[2]
I'm not familiar with VSCode but I'm not sure if the 'static' folder is named 'static /css' or if it's 'static' and 'css' is a subfolder of the first. It should be the latter, and that might be a reason that the css might not show up.
Regarding the HTML. While working with backend such as Flask, one common problem is with the chrome-cache. After you make a change in the HTML try to disable it before reloading the page, by pressing F12, going to the "Network" tab, and checking "Disable cache". Then reload (Without pressing F12 Again at first), and see if anything has changed
Oh, and I just noticed that it says that you didn't save your last changes to the HTML file, maybe you forgot to save after adding your content to the document.
Solution 3:[3]
Man I had got the same error. I searched so much everywhere about what is happening, but i didnt get it. Then by critical thinking i did understand that the render_template wasnt working. So i did later on understand that render template function is sensitive to what you keep the names of your directory, like you need to have the html file in folder named "templates" only. In case you dont, then it doesnt work. So i had everything right but still the site wasnt working. Then i tried changing the name of the folder in which i had all files, which in my case was named "website". Then i re-run the website by changing its name to "ksi"(basically random name). Thats when the render template function worked.
I dont know how for so many years nobody hadnt found a solution already to this problem. Some devices dont seem to have that problem, but anyways hope this solves your problem!
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Priyanshu |
| Solution 2 | Sami |
| Solution 3 | Rupesh Suryawanshi |
