8_建立模板

模板保存在 blog/templates/blog 目录中。首先我们在 blog目录内创建一个 templates目录,还需要在templates目录下面创建一个 blog目录。

blog
└───templates
    └───blog

在 blog/templates/blog 目录创建一个文件 叫 post_list.html

重启服务器,然后再打开 http://127.0.0.1:8000/ 它现在就不会报错了,现在显示的是一个空白页面。

20170826150373706449607.png

现在尝试在模板文件 blog/templates/blog/post_list.html内添加以下内容:

<html>
    <head>
        <title>末伏的博客</title>
    </head>
    <body>
        <p>大家好!</p>
        <p>网站正常工作了!</p>
    </body>
</html>

然后再打开 http://127.0.0.1:8000/ 它现在就有内容了,而且网站标题也有了。

20170826150373741359077.png

现在我们来更加的完善以下网页的内容,如下。

<html>
    <head>
        <title>末伏的博客</title>
    </head>
    <body>
        <div>
            <h1><a href="">末伏的博客</a></h1>
        </div>
        <div>
            <p>发表时间:2017年8月26日16点55分</p>
            <h2><a href="">我的第一篇文章</a></h2>
            <p>文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1文章内容1
            </p>
        </div>

        <div>
            <p>发表时间:2017年8月26日16点55分</p>
            <h2><a href="">我的第二篇文章</a></h2>
            <p>这里是文章内容2 这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2这里是文章内容2
            </p>
        </div>

    </body>
</html>

现在网站看起来就是这样。有点基本的结构了。

20170826150373796147305.png

部署

现在把我们新的博客部署到PythonAnywhere

提交代码到 Github

确保你在 用户的根目录,然后

git status 查看有哪些更改,红色表示有更改的文件。

20170826150373825839290.png

1. git add —all .

git add --all . 其中 . 表示当前目录。这个意思是表示提交所有更改。

然后再使用 git status 会发现之前红色的变成绿色。绿色表示这些是会被上传的文件。

2017082615037385355804.png

2. git commit -m "Changed Inhalt"

简要说明下这次改动(改动说明)

git commit -m "Changed the HTML for the site."

20170826150373878977501.png

3. git push

提交代码, git push

20170826150373878977501.png

现在在 GitHub.com 也可以查看到这些改变的说明了。

20170826150373886864870.png

把你的新代码拉到 PythonAnywhere

然后重新加载你的 web 应用程序

  1. 打开 https://www.pythonanywhere.com/user/zfl420/consoles/
  2. 选择 Bash
  3. pull代码并且覆盖现有文件
$ cd ~/my-first-blog
$ source myvenv/bin/activate
(myvenv)$ git pull
[...]
(myvenv)$ python manage.py collectstatic
[...]

20170826150373916553803.png

  1. 然后要 Reload
  2. 查看 zfl420.pythonanywhere.com 效果如下

20170826150374804513681.png

Comments
Write a Comment