如何扩展Django CMS模板？

Question

我想使用基本模板，然后扩展部分视图。extends不工作，因为它根本没有显示基本标记。

base.html

<div class="container">
    {% block content %}
    {% endblock %}
</div>

_hello.html

    {% extends 'base.html' %}
   {% block content %}
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center"><h2>Survey About Computer Programming</h2></div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <h3>Programming</h3>
                <table class="table table-bordered table-striped table-responsive">
                    <thead>
                        <tr align="center">
                            <th>Main</th>
                            <th class="text-center">Option1</th>
                            <th class="text-center">Option2</th>
                            <th class="text-center">Option3</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Do you love Programming?</td>
                            <td class="text-center"><input type="radio" class=""></td>
                            <td class="text-center"><input type="radio" class=""></td>
                            <td class="text-center"><input type="radio" class=""></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>
    <script src="/static/survey/js/plugin.js"></script>
 {% endblock %}

Answer 1

您必须将代码放入块内容中。扩展模板覆盖基模板中的块。

<div class="container">
    {% block content %}
    {% endblock %}
</div>
    {% block js_bottom %}
    {% endblock %}

_hello.html

{% extends 'base.html' %}
{% block content %}
<div class="row">
    <div class="col-md-12 text-center"><h2>Survey About Computer Programming</h2></div>
</div>
<div class="row">
    <div class="col-md-12">
        <h3>Programming</h3>
        <table class="table table-bordered table-striped table-responsive">
            <thead>
                <tr align="center">
                    <th>Main</th>
                    <th class="text-center">Option1</th>
                    <th class="text-center">Option2</th>
                    <th class="text-center">Option3</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Do you love Programming?</td>
                    <td class="text-center"><input type="radio" class=""></td>
                    <td class="text-center"><input type="radio" class=""></td>
                    <td class="text-center"><input type="radio" class=""></td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
    {% endblock %}

{% block js_bottom %}
<script src="/static/survey/js/plugin.js"></script>
{% endblock %}

Answer 2

当我们创建这样的模板时，您忽略了重要的事情，我们必须确保每个块都像CSS、Content一样，JS必须在基本html文件中按比例定义。当您扩展这个基本模板时，您必须根据需要对内容进行框架化。就像您需要在html页面中添加一些内容一样，它扩展了基本的html调用，如下所示：{%阻止_block_name_should_be_here %} {% endblock %}

块名可能类似于需要使用html页面的css_part、content_part、js_part。