Django Build blog site (iii)

Source: Internet
Author: User

Django Build blog site (iii)

The third chapter mainly records the logic and template of the view layer.

Django Build blog site (i)

Django Build blog site (ii)

Structure

The structure of the website determines what view I want to achieve.

I mainly use the View Display home page, the tab page, the webmaster (that is, i) information pages, as well as the article details page.

settings.py

Because it is necessary to write HTML files at this stage, but each page of each line of code on their own to write, all kinds of rendering on their own to write, too cumbersome, Django provides HTML template functionality, can be settings.py configured inside.

# settings.py= [    {        ‘BACKEND‘‘django.template.backends.django.DjangoTemplates‘,        ‘DIRS‘: [],        ‘APP_DIRS‘True,        ‘OPTIONS‘: {            ‘context_processors‘: [                ‘django.template.context_processors.debug‘,                ‘django.template.context_processors.request‘,                ‘django.contrib.auth.context_processors.auth‘,                ‘django.contrib.messages.context_processors.messages‘,            ],        },    },]

In fact, many of the Python package contains a module called JINJA2, but also the implementation of HTML template function, but here I do not feel the need to change to the Jinja2,django itself provided template function is enough.

First create a parent template base.html , but before you create the template you also need to create a folder under Post to templates put the HTML template, this is necessary to operate, because in the view method in the face of template reference, Django will only in this call templates Folder below to find the template. Then templates create a folder under the folder post , post the app template is put in here.

<!--post/base.html --{% load static%}    <linkrel="stylesheet"type="Text/css"href="{% static ' bootstrap/css/bootstrap.min.css '%}"integrity="Sha384-bvyiisifek1dgmjrakycuhahrg32omucww7on3rydg4va+pmstsz/k68vbdejh4u"crossorigin="Anonymous">{% block title%}<title></title>{% Endblock%}{% block body%} {% block NavBar%}<navclass="NavBar navbar-inverse">            <divclass="Container-fluid">                <!--Brand and toggle get grouped for better mobile display --                <divclass="Navbar-header">                    <buttontype="button"class="Navbar-toggle collapsed"data-toggle="Collapse"data-target="#bs-example-navbar-collapse-1"aria-expanded="false">                        <spanclass="Sr-only">Toggle Navigation</span>                        <spanclass="Icon-bar"></span>                        <spanclass="Icon-bar"></span>                        <spanclass="Icon-bar"></span>                    </button>                    <aclass="Navbar-brand"href="{% url ' post:index '%}">Chain</a>                </div>                <!--Collect the Nav links, forms, and other content for toggling                <divclass="Collapse Navbar-collapse"id="Bs-example-navbar-collapse-1">                    <ulclass="Nav Navbar-nav">                        <liclass="Active"><ahref="{% url ' post:index '%}">Home<spanclass="Sr-only">(current)</span></a></li>                        <li><ahref="{% url ' post:user ' chain '%}">Profile</a></li>                    </ul>                </div>            </div>        </nav>{% Endblock%}    {% block content%} {% Endblock%} {% Endblock%}

Yes, base.html using Bootstrap , in the first article to prepare the work has put bootstrap resources static under the folder, so you first loaded the static folder, and then the bootstrap to import.

base.htmlJust fixed the site to implement a navigation bar, each subsequent to inherit the template HTML template will have this template, and no need to rewrite the navigation bar code again.

As you can see, base.html there are two definitions block in it, and the sub-template we write behind is what content we want to show in this block.

Again, there are some clickable links in the code of the navigation bar, the href properties are generated dynamically using the method of the template url , the concrete how to generate it does not say, take an url ‘post:user‘ ‘chain‘ example to illustrate:

    • urlis a method of handling URLs provided by the template feature
    • post:userCan be found in the post of the urls.py corresponding, post is in urls.py the inside of the app_name property, it user must be inside the urls.py registered URL address when the name property set.
    • chain, this is just a parameter to the view layer.

Specific. When implementing the view logic, it's clear.

View Home

The main page is a list of display articles and a list of historical tags.

Get all the articles from the database into a list and upload them to HTML for display. Again, it's the same way to get a list of tags.

# post/views.pyclassIndexview (Generic. Templateview): Template_name= ' post/index.html '    defGet_context_data ( Self,**Kwargs): Context=Super(). Get_context_data (**Kwargs) context[' posts ']=Post.objects. All()[:3] Context[' tags ']=Posttag.objects. All()returnContextdefTag (request,tag_name): Tags=Posttag.objects.Filter(tag_name=Tag_name) posts=tags[0].post_set. All()returnRender (Request,' post/tag_index.html ',{' posts ':p OSTs,' tag_name ': tag_name})

For the implementation of view logic, you can define a method or define a class, which is much better than defining a class, but because you are not familiar with the various base classes of view, most of them are in the way of defining methods.

Under templates/post folders, create index.html and tag_index.html :

<!--index.html --{% extends ' post/base.html '%} {% block title%}<title>Chain ' s Blog</title>{% Endblock%}    {% block content%} {% if not posts%}<divclass="Container">        <divclass="Page-header"align="Center">            Welcome to Chain Blog website!!!        </div>        <divalign="Center">            Chain don ' t have blog .... Sorry ...        </div>        </div>{% Else%}<divclass="Container">        <divclass="Page-header"align="Center">            Welcome to Chain Blog website!!!        </div>        <divclass="Col-md-6">            <ulclass="List-group">{% for post in posts%}<liclass="List-group-item"style="box-shadow:5px 5px 5px #3c3c3c">                        <div>                            <ahref="{% url ' post:post ' post.id%}"style="Color:black;text-decoration:none">                                {{Post.post_title}}                        </div>                                                <div>                            {{Post.post_description}}                        </div>                        <br>                        <aclass="Btn btn-success"href="{% url ' post:post ' post.id%}">View Full text</a>                    </li>                    <br>{% ENDFOR%}</ul>        </div>        <divclass="Col-md-6">            <divclass="Col-md-4">            </div>{% If tags%}<divclass="Col-md-4"style="box-shadow:5px 5px 5px #3c3c3c">                History Tags                <ulclass="List-group">{% for tag in tags%}<ahref="{% url ' post:tag ' tag.tag_name%}"style="Text-decoration:none">                            <liclass="List-group-item"># {{Tag.tag_name}}</li>                        </a>{% ENDFOR%}</ul>            </div>{% ENDIF%}</div>        <divclass="Col-md-4"></div>    </div>{% ENDIF%} {% Endblock%}
<!--tag_index.html --{% extends ' post/base.html '%} {% block title%}<title>tag:{{Tag_name}}</title>{% Endblock%} {% block content%}<divclass="Col-md-3"></div>    <divclass="Container col-md-6">        <divclass="Page-header">align="Center"># {{tag_name}}        <ulclass="List-group">{% for post in posts%}<liclass="List-group-item"style="box-shadow:5px 5px 5px #3c3c3c">                    <div>                        <ahref="{% url ' post:post ' post.id%}"style="Color:black;text-decoration:none">                            {{Post.post_title}}                    </div>                                        <div>                        {{Post.post_description}}                    </div>                    <br>                    <aclass="Btn btn-success"href="{% url ' post:post ' post.id%}">View Full text</a>                </li>                <br>{% ENDFOR%}</ul>    </div>    <divclass="Col-md-3"></div>{% Endblock%}

You can see that two templates have been inherited base.html because they base.html have been introduced inside Bootstrap , so you can use bootstrap to render the page directly.

Other pages of the implementation, and the home page is similar, but in the article details page in order to join markdown some small details to note, the next article to do a detailed explanation.

The completion of the project has been push to my github.

Django Build blog site (iii)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.