How to render a template with dynamic CSS?

I want to create a dynamic CSS file in a view and then render a template which loads that CSS file. Depending on the arguments given to the view, the CSS may have different values at certain places every time the view is called. How would I go about doing that? (I should add that I have no experience with writing files in Python/Django.)

Here is a simplified example of how I think it should work:

# urls.py
urlpatterns = patterns('',
    (r'^myview/(?P<color>[0-9a-f]{6})/$', create_css_file),
)

# views.py
def create_css_file(request, color):
    raw = "@charset 'UTF-8';\n\n"
    raw += "body {\n"
    raw += "  color: #" + color + ";\n"
    raw += "}\n\n"

    f = open('mydynamic.css', 'r+')
    f.write(raw)

    return render_to_response('mytemplate.html', locals())

# mytemplate.html
{% extends "base.html" %}
{% block head %}
    <link rel="stylesheet" media="screen" href="{{ f.name }}" />
{% endblock %}

For some reason, that doesn't work, although in the resulting HTML page's source code, it looks like the CSS file is loaded correctly. The f even arrives at the template correctly, because I can see its contents when I change the <link>... line to

<link rel="stylesheet" media="screen" href="{{ f }}" />

(finstead of f.name). But the HTML is rendered without the desired color setting. Can anybody tell my why that is?

I suspected some path issue, and I toyed around quite a bit with different paths, but to no avail.

Please do not advise me to prepare several hardcoded CSS files (as I have found in answers to similar questions), because there will be several hundred possibilities.

标签： django django-templates dynamic-css

3条回答

Rolldiameter

2楼-- · 2019-04-28 20:19

If you absolutely need to you can just create a css file dynamically.

You can create an entry in your urls.py. You can name urls anything you want this could look like a static .css file to the outside world but would be created dynamically.

(r'^(?P<color>[0-9a-f]{6})/dynamic.css$', dynamic_css)


def dynamic_css(request, color):
   """
   Create a css file based on a color criteria,
   or any other complicated calculations necessary
   """
   # do custom element positionting.
   return render_to_response('dynamic.css', {'color': color})


# dynamic.css    
body {
  background-color: {{ color }}
}

There is no reason to write css files for this. Now you can just include

<link rel="styleshee" type="text/css" href="/purple/dymamic.css" />

In your template.

As mentioned this shouldn't be used just for changing one color. That could be done in your template. If you had to do something like this it would probably be a good idea to implement cacheing as every time a page is requested it has to dynamically generate .css that could be performance overhead. This is more of an example to show you can name urls.py entries anything you want. And include them in any way you want in html ie. if you needed a custom javascript file dynamically created you could create an entry in urls.py and then create a view that generates a .js file.

0人赞添加讨论(0) 举报

时光不老，我们不散

3楼-- · 2019-04-28 20:26

I went with @CatPlusPlus's suggestion: Calculating the necessary values in a view and passing the template a very long string (raw) which contains the entire CSS. In the template, I include it like so:

<style media="screen">{{ raw|safe }}</style>

Thanks everyone for your efforts!

0人赞添加讨论(0) 举报

闹够了就滚

4楼-- · 2019-04-28 20:31

views.py:

def create_css_file(request, color):
    f = color
    return render_to_response('mytemplate.html', locals())

template:

<body style = "color:{{f}}!important;">

Don't create css file on the fly it is unnecessary.

0人赞添加讨论(0) 举报

How to render a template with dynamic CSS?

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间