1.apps文件集成
- 第一步 添加路径
# 在settings.py中添加
sys.path.insert(0, BASE_DIR)
sys.path.insert(1, os.path.join(BASE_DIR, 'apps'))
-
第二步 将apps文件夹设置为Sources Root
Sources.png -
第三步 注册app
注册app.png
2.Templates文件集成
Templates文件集成.png
3.static文件集成
static文件集成.png
4.base.html
<!-- 挖坑 越多越好 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
{% block title %}
{% endblock %}
</title>
<link rel="stylesheet" href="{% static 'css/base/reset.css' %}">
<link rel="stylesheet" href="{% static 'css/base/common.css' %}">
<link rel="stylesheet" href="{% static 'css/base/side.css' %}">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_684044_un7umbuwwfp.css">
<!-- css link start -->
{% block link %}
{% endblock %}
<!-- css link end -->
</head>
<body>
<!-- header start -->
<header id="header">
<div class="mw1200 header-contain clearfix">
<!-- logo start -->
<h1 class="logo">
<a href="javascript:void(0);" class="logo-title">Python</a>
</h1>
<!-- logo end -->
<!-- nav start -->
<nav class="nav">
<ul class="menu">
<li class="active"><a href="{% url 'news:news_index' %}">首页</a></li>
<li><a href="{% url 'courses:courses_index' %}">在线课堂</a></li>
<li><a href="{% url 'docs:docs_download' %}">下载文档</a></li>
<li><a href="{% url 'news:news_search' %}">搜索</a></li>
</ul>
</nav>
<!-- nav end -->
<!-- login start -->
<div class="login-box">
<div>
<i class="PyWhich py-user"></i>
<span>
<a href="{% url 'users:user_login' %}" class="login">登录</a> / <a href="{% url 'users:user_register' %}"
class="reg" >注册</a>
</span>
</div>
<div class="author hide">
<i class="PyWhich py-user"></i>
<span>qwertyui</span>
<ul class="author-menu">
<li><a href="javascript:void(0);">后台管理</a></li>
<li><a href="javascript:void(0);">退出登录</a></li>
</ul>
</div>
</div>
<!-- login end -->
</div>
</header>
<!-- header end -->
<!-- main start -->
{% block main_start %}
<main id="main">
<div class="w1200 clearfix">
<!-- main-contain start -->
{% block main_contain %}
{% endblock %}
<!-- main-contain end -->
{% block side %}
<!-- side start -->
<aside class="side">
<div class="side-activities">
<h3 class="activities-title">在线课堂<a href="javascript:void(0)">更多</a></h3>
<div class="activities-img">
<a href="javascript:void(0);" target="_blank">
<img src="{% static 'images/english.jpg' %}" alt="title">
</a>
<p class="activities-tips">对话国外小姐姐</p>
</div>
<ul class="activities-list">
<li>
<a href="javascript:void(0);" target="_blank">
<span class="active-status active-start">报名中</span>
<span class="active-title"><a
href=""> Django 项目班</a></span>
</a>
</li>
<li>
<a href="javascript:void(0);" target="_blank">
<span class="active-status active-end">已结束</span>
<span class="active-title"><a
href="">Python入门基础班</a></span>
</a>
</li>
</ul>
</div>
<div class="side-attention clearfix">
<h3 class="attention-title">关注我</h3>
<ul class="side-attention-address">
<li>
<a href="javascript:void(0);" target="_blank"><i class="PyWhich py-GitHub"></i>Youkou</a>
</li>
<li>
<a href="javascript:void(0);" target="_blank"><i class="PyWhich py-zhihu"
style="color:rgb(0, 108, 226);"></i>Youkou</a>
</li>
<li>
<a href="javascript:void(0);" target="_blank"><i class="PyWhich py-weibo"
style="color:rgb(245,92,110);"></i>Youkou</a>
</li>
</ul>
<div class="side-attention-qr">
<p>扫码关注</p>
</div>
</div>
{% block hot_recommend %}
<div class="side-hot-recommend">
<h3 class="hot-recommend">热门推荐</h3>
<ul class="hot-news-list">
<li>
<a href="javascript:void(0)" class="hot-news-contain clearfix">
<div class="hot-news-thumbnail">
<img src="{% static 'images/python_web.jpg' %}"
alt="">
</div>
<div class="hot-news-content">
<p class="hot-news-title">Django调试工具django-debug-toolbar安装使用教程</p>
<div class="hot-news-other clearfix">
<span class="news-type">python框架</span>
<!-- 自带的 -->
<time class="news-pub-time">11月11日</time>
<span class="news-author">python</span>
</div>
</div>
</a>
</li>
</ul>
</div>
{% endblock %}
</aside>
<!-- side end -->
{% endblock %}
</div>
</main>
<!-- main end -->
{% endblock %}
<!-- footer start -->
<footer id="footer">
<div class="footer-box">
<div class="footer-content">
<p class="top-content">
<span class="link">
<a href="javascript:void(0)">关于Python</a> |
<a href="javascript:void(0)">我就是我</a> |
<a href="javascript:void(0)">人生苦短</a> |
<a href="javascript:void(0)">我用Python</a>
</span>
<span class="about-me">关于我: <i class="PyWhich py-wechat"></i> Youkou</span>
</p>
<p class="bottom-content">
<span>地址： xxxx</span>
<span>联系方式: <a href="tel:400-1567-315">400-1567-315</a> (24小时在线)</span>
</p>
</div>
<p class="copyright-desc">
Copyright © 2008 - 2018 xxx有限公司. All Rights Reserved
</p>
</div>
</footer>
<!-- footer end -->
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script src="{% static 'js/base/common.js' %}"></script>
{% block script %}
{% endblock %}
</body>
</html>
5.引用语法
# 继承base模板
{% extends 'base/base.html' %}
# 填坑
{% block title %}
IndexPag
{% endblock %}
# 引入static 文件（settings有配置，所以不用load）
"{% static 'js/index.js' %}"
<!-- news/index.html -->
{% extends 'base/base.html' %}
{% block title %}
IndexPag
{% endblock %}
<!-- css link start -->
{% block link %}
<link rel="stylesheet" href="{% static 'css/news/index.css' %}">
{% endblock %}
<!-- css link end -->
<!-- main-contain start -->
{% block main_contain %}
<div class="main-contain">
<!-- banner start -->
<div class="banner">
<ul class="pic">
<!--淡入淡出banner-->
<li><a href="javascript:void(0);"><img src="{% static 'images/linux.jpg' %}" alt="test"></a></li>
</ul>
<a href="javascript:void(0);" class="btn prev">
<i class="PyWhich py-arrow-left"></i></a>
<a href="javascript:void(0);" class="btn next">
<i class="PyWhich py-arrow-right"></i></a>
<ul class="tab">
<!-- 按钮数量必须和图片一致 -->
<li></li>
</ul>
</div>
<!-- banner end -->
<!-- content start -->
<div class="content">
<!-- recommend-news start -->
<ul class="recommend-news">
<li>
<a href="https://www.shiguangkey.com/course/2432" target="_blank">
<div class="recommend-thumbnail">
<img src="{% static 'images/python_gui.jpg' %}" alt="title">
</div>
<p class="info">Python GUI 教程 25行代码写一个小闹钟</p>
</a>
</li>
</ul>
<!-- recommend-news end -->
<!-- news-nav start-->
<nav class="news-nav">
<ul class="clearfix">
<li class="active"><a href="javascript:void(0)">最新资讯</a></li>
<li><a href="javascript:void(0)" data-id="1">python框架</a>
</li>
</ul>
</nav>
<!-- news-nav end -->
<!-- news-contain start -->
<div class="news-contain">
<ul class="news-list">
<li class="news-item">
<a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
target="_blank">
<img src="{% static 'images/python_gui.jpg' %}" alt="linux查找文件或目录命令"
title="linux查找文件或目录命令">
</a>
<div class="news-content">
<h4 class="news-title"><a
href="#">linux查找文件或目录命令</a>
</h4>
<p class="news-details">linux查找文件或目录命令，前提：知道文件或者目录的具体名字，例如：sphinx.conffind 查找find / -name
dirname 查找目录find -name...</p>
<div class="news-other">
<span class="news-type">Linux教程</span>
<span class="news-time">11/11 18:24</span>
<span class="news-author">python</span>
</div>
</div>
</li>
</ul>
</div>
<!-- news-contain end -->
<!-- btn-more start -->
<a href="javascript:void(0);" class="btn-more">加载更多</a>
<!-- btn-more end -->
</div>
<!-- content end -->
</div>
{% endblock %}
<!-- main-contain end -->
{% block script %}
<script src="{% static 'js/index.js' %}"></script>
{% endblock %}
6.访问
# urls.py
urlpatterns = [
path('news/', include('news.urls')),
path('docs/', include('docs.urls')),
path('courses/', include('courses.urls')),
path('users/', include('users.urls')),
]
# news\urls.py
from django.urls import path
from . import views
app_name = 'news'
urlpatterns = [
path('index/', views.News.as_view(), name='news_index'),
path('detail/', views.NewsDetail.as_view(), name='news_detail'),
path('search/', views.NewsSearch.as_view(), name='news_search'),
]
# news\views.py
from django.views import View
from django.shortcuts import render
class News(View):
"""
"""
def get(self, request):
"""
:param request:
:return:
"""
return render(request, 'news/index.html')
class NewsDetail(View):
"""
"""
def get(self, request):
"""
:param request:
:return:
"""
return render(request, 'news/news_detail.html')
class NewsSearch(View):
"""
"""
def get(self, request):
"""
:param request:
:return:
"""
return render(request, 'news/search.html')
