When I try to view the template I created the development server shows the template html file as if it were plain text. Basically the web page shows what is in my template .html file. I know something is working because when I pass the render_to_response function the dictionary of arguments and try to display the variable I passed I it renders that part correctly. Here is an example of the problem.
This is the template file:
<b>Hello</b>
Then the output source code is the following:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>
<meta name="Generator" content="Cocoa HTML Writer">
<meta name="CocoaVersion" content="1038.35">
<style type="text/css">
p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Courier}
</style>
</head>
<body>
<p class="p1"><b>Hello</b></p>
</body>
</html>
And the screen just shows:
<b>Hello</b>
Any ideas on how to make my template render as if it were an html file would be appreciated.
I don't know how you're outputting the html file into your template, but, if you're doing something like this in your template
{{ my_template }}
to render the my_template string variable that you're passing to render_to_response
you just need to use the safe filter
{{ my_template|safe }}
this won't html-encode your string, and the html will render propery into your page
Related
Following this, I've created html to pdf converter and it works fine with english language, but I have some russian symbols that I cannot decode. Instead of normal russian words I get:
тут должен быть текÑ■Ñ
template:
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>MC-report</title>
</head>
<body>
<div style="align:center"> тут должен быть текст {{ today }}</div>
</body>
</html>
I have same code (plus some code just to get needed data) as in this manual, instead of playing with html.encode and template:
pdf = pisa.pisaDocument(BytesIO(html.encode("UTF-8")), result) #for decoding data, not template text
None of cp1251/2/866 and UTF-8 won't work
add to your html (Alice-Regular.ttf) is Russian fonts
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#font-face {
font-family: "Alice-Regular";
src: url("/fonts/Alice-Regular.ttf") format("truetype");
}
body {
font-family: "Alice-Regular";
font-size: 20px
}
</style>
I want to put an html in a string, NOT a file, like:
t = """
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>foo</title>
</head>
<body>
{{ script|safe }}
</body>
</html>
"""
script = ...
render_template_string(t, script=script)
However when I go to the actual webpage, I don't see an html page with a script, I see garbage:
"\n<!doctype html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n</head>\n\n<body>\n \n<script\n src=\"http://localhost:5006/bkapp/autoload.js?bokeh-autoload-element=ff639949-97c5-40b8-9cc2-28b78be802d1&bokeh-app-path=/bkapp&bokeh-absolute-url=http://localhost:5006/bkapp\"\n id=\"ff639949-97c5-40b8-9cc2-28b78be802d1\"\n data-bokeh-model-id=\"\"\n data-bokeh-doc-id=\"\"\n></script>\n</body>\n</html>"
How do I fix this?
EDIT: even a very simple
t = '{{ script|safe }}'
does not work, I get, in the browser:
"\n<script\n src=\"http://localhost:5006/bkapp/autoload.js?bokeh-autoload-element=07a43696-66af-4e54-a4e3-9a09ac242e38&bokeh-app-path=/bkapp&bokeh-absolute-url=http://localhost:5006/bkapp\"\n id=\"07a43696-66af-4e54-a4e3-9a09ac242e38\"\n data-bokeh-model-id=\"\"\n data-bokeh-doc-id=\"\"\n></script>"
EDIT 2: I have also tried
t = '{% autoescape false %}{{ script|safe }}{% endautoescape %}'
but that didn't work either.
I'm using Connexion if that matters.
I'm trying to embed a bokeh plot into a template (home.html), but nothing is displayed after executing the code.
here's the code.
views.py (all packages are imported)
def home(request):
s = [1,4,6,8]
h = [1,5,9,8]
p = figure(plot_width=600, plot_height=600)
p.vbar(x=s, width=0.5, bottom=0,
top=h, color="black")
script, div = components(p, CDN)
return render(request, 'home.html', {'div': div, 'script': script})
home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Experiment with Bokeh</title>
<script src="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.js"></script>
<link rel="stylesheet" href="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.css">
</head>
<body>
<h1>hello</h1>
{{ div|safe }}
{{ script|safe }}
</body>
</html>
it displays nothing at the end, there's no error message, but and the page is completely blank
Help, Please!!
You are loading an ancient version of BokehJS from CDN:
<script src="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.js"></script>
<link rel="stylesheet" href="http://cdn.bokeh.org/bokeh/release/bokeh-0.8.1.min.css">
The 0.8.1 release is now several years old. By contrast, the vbar glyph method that you are using was only added quite recently. You need to make sure that the version of the BokehJS resources that you load in your template actually match the version of the Bokeh library that you are using.
I want to separate html code from my laravel template (*.blade.php) file . I have following code in my dashboard.blade.php template :
<h1>Dashboard</h1>
<p>Welcome to your Dashboard. You rock!</p>
<div class="bubbletree-wrapper">
<div class="bubbletree"></div>
</div>
I want to separate this html code from here and want to move it to another file , with extension either *.html or *.tpl or any other except *.php .
Is it possible to do so ? Please help me on this .
Thanks.
I don't see anyone 100% decoupling HTML/CSS, but you can follow some Design Patterns, like Presenter, and use Laravel Blade so it be very little coupled.
Name a view home.blade.php and add your code to it and change your code to:
<h1>{{$pageTitle}}</h1>
<p>{{$welcomeMessage}}</p>
<div class="bubbletree-wrapper">
<div class="bubbletree"></div>
</div>
Create a route using:
<?php
Route::get('/', function() {
return View::make('home',
array(
'$pageTitle' => 'Dashboard',
'welcomeMessage' => 'Welcome to your Dashboard. You rock!'
)
);
});
See? It's almost 100% decoupled, but you cannot decouple 100% or you'll not be able to show your dynamic data in your final HTML.
Also, Blade helps you organize your code, so you can have a layout, let's call it layout.blade.php:
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<title> Your Application </title>
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css">
</head>
<body class="">
#yield('contentSection')
</body>
</html>
You have one single line of Blade in it, just to add your page contents, now you can create your home view as:
#extends('layout')
#section('contentSection')
<h1>{{$pageTitle}}</h1>
<p>{{$welcomeMessage}}</p>
<div class="bubbletree-wrapper">
<div class="bubbletree"></div>
</div>
#stop
And blade will render this HTML for you:
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<title> Your Application </title>
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css">
</head>
<body class="">
<h1>Dashboard</h1>
<p>Welcome to your Dashboard. You rock!</p>
<div class="bubbletree-wrapper">
<div class="bubbletree"></div>
</div>
</body>
</html>
When using the development server along with a view and template html file (which both seem to be formatted correctly), Django's server doesn't make the html from the template the source code to the web page like it should, but instead it seems to just render the template as if it were the thing that I wanted to show on the page. So it seems to create it's own html with my template file being the text that should be printed. For example, here is the view and template and resulting source code from the web page when run on the development server.
View:
def start(request, ampCode):
t = get_template('code_user.html')
c = Context({'user_code': ampCode})
html = t.render(c)
return HttpResponse(html)
Template:
{% extends "base_code_user.html" %}
{% block title %} This is the title {% endblock %}
{% block body %}
<b> {{user_code}} </b>
{% endblock %}
Other template that other one extends:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> {% block title %} {% endblock %} </title>
</head>
<body>
{% block body %} {% endblock %}
</body>
</html>
Resulting source code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>
<meta name="Generator" content="Cocoa HTML Writer">
<meta name="CocoaVersion" content="1038.35">
<style type="text/css">
p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Courier}
p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Courier; min-height: 14.0px}
span.Apple-tab-span {white-space:pre}
</style>
</head>
<body>
<p class="p1"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<title></title>
<meta name="Generator" content="Cocoa HTML Writer">
<meta name="CocoaVersion" content="1038.35">
<style type="text/css">
p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Courier}
p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Courier; min-height: 14.0px}
span.Apple-tab-span {white-space:pre}
</style>
</head>
<body>
<p class="p1"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"</p>
<p class="p1"><span class="Apple-converted-space"> </span>"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></p>
<p class="p1"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"></p>
<p class="p1"><span class="Apple-converted-space"> </span><head></p>
<p class="p1"><span class="Apple-tab-span"> </span><title> This is the title </title></p>
<p class="p1"><span class="Apple-converted-space"> </span></head></p>
<p class="p2"><br></p>
<p class="p1"><span class="Apple-tab-span"> </span><body></p>
<p class="p1"><span class="Apple-tab-span"> </span><span class="Apple-tab-span"> </span></p>
<p class="p2"><br></p>
<p class="p1"><span class="Apple-tab-span"> </span><b> AAAAAA </b></p>
<p class="p2"><br></p>
<p class="p1"></p>
<p class="p1"><span class="Apple-tab-span"> </span></body></p>
<p class="p2"><br></p>
<p class="p1"></html></p>
</body>
</html>
Maybe I'm just not understanding what the template system does and it may be working correctly, but I was under the impression that whatever was in the template would become the resulting source code for the page. Any help on what might be causing this would be helpful. Thanks
Edit:
When I try your exact example in a django project it works for me (same view names, same template names). Output (assuming ampCode is 3):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> This is the title </title>
</head>
<body>
<b> 3 </b>
</body>
</html>
My guess is your problem is somewhere else and not to find in your code samples. Maybe you have problem in your URL conf pointing to a totally different view?
Previous answer:
In your view add themimetype to your HttpResponse:
return HttpResponse(html, mimetype='text/html')
If not it will interpret it as text/plain by default and therefore not render the html correctly.
If you want to keep things shorter when rendering templates you can simply use the response shortcuts. Have a look at Django shortcut functions.