做茶叶网站的目的和规划网站关键词检测

当前位置： 首页 > news >正文

做茶叶网站的目的和规划,网站关键词检测,做移动网站,房屋建筑设计师哪里找使用Python Django框架制作一个音乐网站#xff0c; 本篇主要是歌手页-全部歌手页功能开发。 目录 分出首页样式内容 创建首页样式文件 首页引入样式文件 全部歌手列表 创建路由 显示视图 引入分页实现库 视图方法 创建歌手首页 增加歌手跳转 导航条改活 首页增加… 使用Python Django框架制作一个音乐网站 本篇主要是歌手页-全部歌手页功能开发。 目录 分出首页样式内容 创建首页样式文件 首页引入样式文件 全部歌手列表 创建路由 显示视图 引入分页实现库 视图方法 创建歌手首页 增加歌手跳转 导航条改活 首页增加导航条 歌手页增加导航条 歌手首字母搜索 路由增加参数 视图字母搜索 模板字母搜索 筛选无数据处理 修改歌手跳转链接 总结 分出首页样式内容 创建首页样式文件 把首页样式内容从基础样式文件中移动出来独立创建index.css文件。 首页引入样式文件 在idnex.html引入index.css文件防止首页样式设置影响其他页面样式。 内容如下 {% extends common/base.html %} {% load static %}{% block title %}我的音乐{% endblock title %}{% block content %} link relstylesheet href{% static css/index.css %} link relstylesheet href{% static css/swiper-bundle.min.css %} 全部歌手列表 创建路由 在player/urls.py中在原有路由下增加新路由并设置分页参数page。 path(singer/int:page, views.singer, namesinger), 显示视图 在player/views.py中创建歌手模块首页视图方法。 引入分页实现库 from django.core.paginator import Paginator 视图方法 处理字母列表这个很简单。关键在于全部歌手列表先获取歌手列表数据然后通过分页组件处理成分页数据最后返回给模板。 内容如下 def singer(request, page): 歌手列表 # 字母列表letters [chr(i) for i in range(ord(A), ord(Z) 1)]# 所有歌手列表singlerList Singler.objects.all().order_by(-singe_num)# 实例化Paginator 每页显示24条paginator Paginator(singlerList, 24)# 获取当前页码数据res paginator.page(page)return render(request, singer/index.html, {letters: letters,singlerList: res}) 创建歌手首页 在templates中创建singer文件夹并在文件夹中创建index.html文件。 内容如下 {% extends common/base.html %} {% load static %}{% block title %}我的音乐-歌手{% endblock title %}{% block content %} link relstylesheet href{% static css/singer.css %} !–分类筛选列表开始– div classnav_listul classnav_1li classactivea href# classfirst热门/a/li{% for lname in letters %}lia href{% url player:singer 1 lname %}{{lname}}/a/li{% endfor %}lia href{% url player:singer 1 # %}#/a/li/ul /div !–分类筛选列表结束–!–歌手列表开始– div classsinger_listdiv classlist_max{% for item in singlerList %}{% if forloop.counter 6 %}div classitemdiv classcoverimg src/media/{{item.portrait}} alt/divp classnamea href{% url player:singer_detail item.id %}{{item.name}}/a/pp classnum{{item.singe_num}}首歌曲/p/div{% elif forloop.counter 7 %}/divdiv classlist_mindiv classitemdiv classcoverimg src/media/{{item.portrait}} alt/divp classnamea href{% url player:singer_detail item.id %}{{item.name}}/a/p/div{% else %}div classitemdiv classcoverimg src/media/{{item.portrait}} alt/divp classnamea href{% url player:singer_detail item.id %}{{item.name}}/a/p/div{% endif %}{% endfor %}/div /div{% if list_num 1 %} !–设置无数据内容– div classnodata flex_cdiv classinnerimg src{% static images/nodata.png %}alt classnodata_imgdiv classtipp暂无相关数据/p/div/div /div {% endif %}{% if list_num 1 %} !–设置分页页码– div classpagei classli-page glyphicon glyphicon-menu-left notPointer/iul{% for index in singlerList.paginator.page_range %}{% if singlerList.number index %}lia href# classnotCursor currentPage{{index}}/a/li{% else %}lia href{% url player:singer index %}{{index}}/a/li{% endif %}{% endfor %}/uli classglyphicon glyphicon-menu-right li-page/i /div {% endif %} !–歌手列表开始– {% endblock content %} 增加歌手跳转 修改header.html文件中歌手跳转超链接。 内容如下 lia hrefjavascript:void(0) classselected歌手/a/li 导航条改活 想了想还是把导航条改为每个页面而不是作为公共部分。 首页增加导航条 基础模板中去掉导航头并把导航条内容移动到首页原内容之上。 内容如下 {% extends common/base.html %} {% load static %}{% block title %}我的音乐{% endblock title %}{% block content %} link relstylesheet href{% static css/index.css %} link relstylesheet href{% static css/swiper-bundle.min.css %}!–导航条开始– div classheaderimg src{% static images/logo.png %} classlogo altullia hrefjavascript:void(0) classselected推荐/a/lilia hrefjavascript:void(0)排行榜/a/lilia href{% url player:singer 1 %}歌手/a/lilia hrefjavascript:void(0)单曲/a/lilia hrefjavascript:void(0)歌单/a/li/ul /div !–导航条结束– 歌手页增加导航条 在分类筛选列表模块之上增加导航条。 内容如下 !–导航条开始– div classheaderimg src{% static images/logo.png %} classlogo altullia href{% url player:index %}推荐/a/lilia hrefjavascript:void(0)排行榜/a/lilia hrefjavascript:void(0) classselected歌手/a/lilia hrefjavascript:void(0)单曲/a/lilia hrefjavascript:void(0)歌单/a/li/ul /div !–导航条结束– 歌手首字母搜索 全部歌手列表增加首字母筛选条件下面就开始实现。 路由增加参数 在原有分页参数后增加字母搜索参数。 path(singer/detail/int:id/str:name, views.singer_detail, namesinger_detail), 视图字母搜索 增加name参数接收字母值如果是#则获取所有歌手列表其他字母查询相应歌手列表。 def singer(request, page, name): 歌手列表 # 字母列表letters [chr(i) for i in range(ord(A), ord(Z) 1)]# 是否搜索首字母if name ! #:# 符合首字母的歌手列表singlerList Singler.objects.filter(first_lettername).order_by(-singe_num)else:# 所有歌手列表singlerList Singler.objects.all().order_by(-singe_num)# 实例化Paginator 每页显示24条paginator Paginator(singlerList, 24)# 获取当前页码数据res paginator.page(page)return render(request, singer/index.html, {letters: letters,singlerList: res,list_num: len(singlerList)}) 模板字母搜索 全部歌手页链接增加字母筛选条件。 div classnav_listul classnav_1li classactivea href# classfirst热门/a/li{% for lname in letters %}lia href{% url player:singer 1 lname %}{{lname}}/a/li{% endfor %}lia href{% url player:singer 1 # %}#/a/li/ul 筛选无数据处理 在首页条件筛选无数据的情况处理出现无数据提示隐藏分页列表。 {% if list_num 1 %} !–设置无数据内容– div classnodata flex_cdiv classinnerimg src{% static images/nodata.png %}alt classnodata_imgdiv classtipp暂无相关数据/p/div/div /div {% endif %}{% if list_num 1 %} !–设置分页页码– div classpagei classli-page glyphicon glyphicon-menu-left notPointer/iul{% for index in singlerList.paginator.page_range %}{% if singlerList.number index %}lia href# classnotCursor currentPage{{index}}/a/li{% else %}lia href{% url player:singer index %}{{index}}/a/li{% endif %}{% endfor %}/uli classglyphicon glyphicon-menu-right li-page/i /div {% endif %} 修改歌手跳转链接 原有跳转歌手的链接需要添加参数已经无法使用。 lia href{% url player:singer 1 # %}歌手/a/li 总结 又来更新django音乐网站项目了 最近一直比较忙零零碎碎往前推进一点。 本篇主要是歌手页-全部歌手展示页面的开发其中关键点在于分页和条件筛选的实现。