Django文章栏目前端模板

一编辑网页头部mysite/templates/article/header.html

{% load staticfiles %}
<div class="container">
    <nav class="navbar navbar-default" role="navigation">
        <div class="navbar-header">
            <img width="100px" src="{% static 'images/logo.png' %}">
        </div>
        <div>
            <ul class="nav navbar-nav" role="tablist">
                <li><a href="{% url 'article:article_column' %}">文章管理</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right" style="margin-right:10px">
                <li><a href="{% url 'blog:blog_title' %}">网站首页</a></li>
                <li>{{ user.username }}</li>
                <li><a href="{% url 'account:user_logout' %}">Logout</a></li>
            </ul>
        </div>
    </nav>
</div>

二编辑左侧网页mysite/templates/article/leftslider.html

<div class="bg-info">
    <div class="text-center" style="margin-top: 5px;">
        <p><h4>文章管理</h4></p>
        <p><a href="{% url 'article:article_column'%}">栏目管理</a></p>
    </div>
</div>

三编辑组装后的base页mysite/templates/article/base.html

{% load staticfiles %}
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{% block title %}{% endblock %}</title>
    <link rel="stylesheet" href="{% static 'css/bootstrap.css' %}">
</head>
<body>
<div class="container">
    {% include 'article/header.html' %}
    <div class="col-md-2">
    {% include 'article/leftslider.html' %}
    </div>
    <div class="col-md-10">
    {% block content %}
    {% endblock %}
    </div>
    <div>
    {% include 'footer.html' %}
    </div>
</div>
</body>
</html>

四编辑mysite/templates/article/column/article_column.html

{% extends "article/base.html" %}
{% load staticfiles %}
{% block title %}article column{% endblock %} {% block content %}
<div>
    <p class="text-right"><button class="btn btn-primary">add column</button>
    </p>
    <table class="table table-hover">
        <tr>
            <td>序号</td>
            <td>栏目名称</td>
            <td>操作</td>
        </tr>
        {% for column in columns %}
        <tr>
            <!--forloop.counter循环次数计数器，从1开始-->
            <td>{{ forloop.counter }}</td>
            <td>{{ column.column }}</td>
            <td>
            </td>
        </tr>
        {% empty %}
        <p>还没有设置栏目，太懒了。</p>
        {% endfor %}
    </table>
</div>

{% endblock %}

五测试一下效果

版权声明：本文来源CSDN，感谢博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/chengqiuming/article/details/85269325
站方申明：本站部分内容来自社区用户分享，若涉及侵权，请联系站方删除。

发表于 2019-09-05 13:22:27
阅读 ( 1145 )
分类：前端

Django文章栏目前端模板

你可能感兴趣的文章

精选的优质文章

0 条评论

官方社群

GO教程

推荐文章

猜你喜欢

随便看看