Im trying to use templatetags, but when i write {% load static %} on top of html document and run, it takes this as a text, and does not load the static.
I set the static config in settings.py but stills not working
{% load static%}
<!DOCTYPE html>
<html>
...
</html>
when i open the file on browser or when i send the template via email, as expected in the proyect, the css works, but the images doesnt. I realized i'd use the static dir, but the line: {% load static %} is shown in the browser as text.
Follow the steps below,
In "settings.py" set STATIC_URL = '/static/'
In your template ensure you type {% load static %}, do note that there should be a space between the percentage symbol "%" and the word "static". From your code snippet above this seems to be the source of the problem.
Ensure all your static files are stored in a folder named static as such "/static//example.jpg." then in the html file image tag should be "/example.jpg" %}" alt="My image">.
Do note that the method stated above is only suitable during the development stage. You can read the docs here for more information
Related
"Invalid block tag on line 2: 'endblock'. Did you forget to register or load this tag?"
This is the error I'm getting and the following is my code in my index.html file in vs code which for some reason keeps getting aligned into one line after saving despite saving each block as a different line after one another:
{% extends 'base.html' %} {% block body %} This is body block {% endblock body
%}
This is the image of the error I'm getting in my code
And this is the code I wrote and saved as it is
It somehow works after I save it, but after a few minutes it becomes like image 1 and gives me an error :(
Edit: I guess "prettier" extension was the culprit, as disabling it seems to work for now. Thanks for the help
I'm having some issues adding a custom footer to my Sphinx .html files. I'm using the sphinx_rtd_theme. I've checked this post and tried it (and some of the suggestions in the comments) but to no avail. I'm not sure what I'm missing. Apologies if I haven't posted enough here to actually indicate what is causing the problem. Any help or suggestions is appreciated!
My css theme file has been (poorly) modified by myself (I'm not an HTML/CSS person!) but I don't think that should matter? The only other thing I can think of is maybe I have to do something special when I re-compile the output files. I just use:
make clean html && make html
My conf.py is located at: root/source/conf.py. Here's some excerpts from my conf.py file:
import sphinx_rtd_theme
project = 'Project Name'
copyright = '2021, My Company'
author = 'My Name, Coworker Name'
master_doc = 'Home'
extensions = ["sphinx_rtd_theme", "sphinx.ext.todo"]
todo_include_todos = True
templates_path = ['_templates']
source_suffix = ['.rst']
html4_writer = True
html_theme = 'sphinx_rtd_theme'
# html_theme_path = ['_static']
html_static_path = ['_static']
# html_extra_path = []
html_show_sphinx = True
html_show_copyright = True
html_style = 'css/my_theme.css'
Here's my layout.html file that I have overridden. It's located in the path shown in the comment.
<!-- layout.html
* Place this file in root/source/_templates
* -->
{% extends "!layout.html" %}
{% block extrahead %}
{{super}}
<link href="{{ pathto("_static/my_theme.css", True) }}" rel="stylesheet" type="text/css">
{% endblock %}
{% block extrafooter %}
{{super}}
<div class="footer">
My custom footer just needs to add a single sentance to the existing footer.
</div>
{% endblock %}
Do you want to add a custom footer or replace the default one? in my case, I only need to override the footer.html file instead of layout.html.
Here's what I do that 100% worked for my Sphinx documentation:
create a footer.html in the _template folder of your Sphinx project.
then add this:
{% extends "!footer.html" %}
{%- block contentinfo %}
{{ super }}
<!-- your custom footer here-->
{% endblock %}
be mindful in which block your footer is actually contained within. In my case it's inside contentinfo
So I found a workaround.
1. Copy existing RTD html files
I copied the existing RTD .html files from my virtual environment folder. On my system it was located at the usual place:
.../Miniconda3/envs/my_env_name/Lib/site-packages/sphinx_rtd_theme/
I found the following files:
breadcrumbs.html
footer.html
Layout.html
search.html
searchbox.html
theme.conf
versions.html
I copied those to my working directory for my project:
.../Documentation-repo/Sphinx/root/source/_templates/
2. Edit conf.py file in working directory
I opened my conf.py file and changed the following:
# Add any paths that contain templates here, relative to this directory.
# Uncomment the line below to enable customized template #
#
# templates_path = ['_templates']
to this:
# Add any paths that contain templates here, relative to this directory.
# Uncomment the line below to enable customized template #
#
templates_path = ['_templates']
3. Add new content to footer.html file
I opened footer.html and edited it to add the content I wanted at the bottom. In my case it was as simple as adding my single sentence of changes below the {%- block extrafooter %} {% endblock %} line. Easy. Might not be the perfect solution but it works for what I need.
I am very new to html, jinja2, templates, and making websites in general, but my employer asked me to do this job, commissioned externally, so I am trying my best.
I am building a website in the CKAN framework, which uses Jinja2 for templating.
On some pages our customer asks to include a static .html file (provided by them). The file has to be rendered, i.e. not show the raw code.
The final page will have to look like this:
The "outer part" is handled by Jinja2 and follows a predefined layout and template equal for all pages. The "internal box" must instead render the custom .html file provided by the customer (different file for each page).
With the idea of fetching the correct name for the custom .html file in some way in the future, I am for now trying just to have an .html file appear.
I have already tried with adding a block to the template like
{% block static_html_desc %}
<script type="text/html", src="my_file.html">>/script>
{% endblock %}
but this produces nothing (i.e. there is just white space in the spot where this is supposed to render).
Then I have tried with
{% block static_html_desc %}
{# include 'my_file.html' %}
{% endblock %}
which sorta works, meaning that my_file.html gets rendered only if the file itself is inside the /templates/ folder, otherwise jinja crashes with "no template found" error.
Given that this file is not dynamic, it feels wrong to put it in the templates folder; there will be several such files, so it's also more logical to keep them in the public folder and have my jinja2 template pull from there.
As said, I am quit a beginner in this so any help and details are greatly appreciated with either Jinja2 or CKAN.
Found a good answer myself, posting here in case others are wondering the same.
The following is based on the excellent tutorial at W3School: https://www.w3schools.com/howto/howto_html_include.asp
I created a javascript file custom_include_html.js, and placed it in the /templates folder of my CKAN plugin. (I reckon it is not a template file, but it relates directly to templates and at current I am not bothered with changing the jinja2 loader path, so I am fine with it staying in that folder).
The content of the file is the following, copied from the W3School tutorial but posted here for your own reference:
function includeHTML() {
var x, i, elem, file, xhttp;
z = document.getElementByTagName("*");
for (i=0; i<z.length; i++) {
elem = z[i];
file = elem.getAttribute("custom-include-html");
if (file) {
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readystate == 4) {
if (this.status == 200) {elem.innerHTML = this.responseText;}
if (this.status == 400) {elem.innerHTML = "Page not found, sorry."}
elem.removeAttribute("custom-include-html");
includeHTML();
}
}
xhttp.open("GET", file, true);
xhttp.send();
return;
}
}
};
Then, in the Jinja2 template defining the page I have to insert the my_file.html file into, I made a block as
{% block static_html_desc %}
<div custom-include-html="/my_file.html"></div>
{% endblock %}
Note that this file is placed in CKAN's public folder, exactly as I wanted in my question above.
At the bottom of the template, I call the javascript script as:
{% block custom_javascript %}
<script type="text/javascript">
{% include custom_include_html.js" %}
includeHTML();
</script>
{% endblock %}
The file my_file.html gets then rendered in the {% block static_html_desc %} block.
At this point, one only has to substitute the call to my_file.html with something not hardcoded, so that different pages load the corresponding *.html files. This is easly done with the templates helper functions.
I'm writing a web app that requires a template to load an HTML file in a block that has been uploaded by a user and stored somewhere in the media directory, along with any images or other media referenced by the HTML file using relative paths. Is there some way to do this given the HTML file path is unknown?
I want something like....
{% extends 'parent.html' %}
{% block content %}
{% include {{ htmlpath }} %}
{% block content %}
to fill the parents content block with a loaded version of the HTML file.
I'm developing a web portal using
- Django 1.2
- Apache
- Mod WSGI
I've several HTML files which are being served by apache.
I want to render those static HTML pages under my base template in order to keep my header / footer and dynamic menus intact.
One way I could thought its using iframes. Another way is to do read HTML files and return string while rendering but in that case I'm loosing advantage of apache, so I want to know if there would be any better way of doing it, is there any existing solution provided by django stuff ?
I'm not sure if this is exactly what you're asking for, but you can insert an html file (or even another template) in a template with the ssi and include tags, depending on your needs:
{% ssi '/path/to/file.html' %}
{% include 'relative/path/to/template.html' %}
yes, it's the include tag
Loads a template and renders it with the current context. This is a way of "including" other templates within a template.
it's as simple as
{% include "templates/static_template_1.html" %}
or, if you create a variable in the view side:
{% include template_name_variable %}
it shares the context with the base template (the one including them)
Edit:
Perhaps you ment to load html-files outside the template-system. Then my way will not suffice.
An option is to extend your base template.
Your base template should not be aware of the sub templates as that would be logically wrong.
Example:
base_template.html:
<html>
<div id='header'></div>
{% block content %}
This text can be left out else it it will shown when nothing is loaded here
{% endblock %}
sub_template.html:
{% extends "base_template.html" %}
{% block content %}
<h1>This is my subpage</h1>
{% endblock %}
You can read more here:
https://docs.djangoproject.com/en/1.2/topics/templates/