与其余网站页面不同的主页 django cms
Different home page from rest of site pages django cms
我是 django CMS 的新手(2 天前开始),我已经按照 Divio 提供的教程进行操作。
我的主页完全可用,非常棒。我现在正在尝试创建其余页面,但我很困惑。
在我的模板目录中,我有一个 base.html
,其中包含网站的总体布局和一个内容块。
然后我 content.html
将主页代码放入内容块。
page-content.html
是我网站上所有其他页面的内容块中的代码。
我的问题是,每当我使用 django CMS 工具栏在我的网站上添加新页面时,它总是使用 content.html
页面。基本上,当我单击 Add a Page
按钮时,它只会添加一个看起来与主页完全一样的页面。我想让我的主页成为一种布局,然后那里的每一页都有不同的布局,这样当我单击 Add a Page
时,它可以让我添加第二种布局。这可能吗?
注意:主页和其他布局都可以用作页面。它们并不是真正的新闻博客页面或类似内容。我可以在上面放置不同的 CMS 插件的常规页面是完美的。
如果您需要更多信息才能正确回答,请告诉我! :)
base.html
{% load staticfiles i18n cms_tags sekizai_tags menu_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>
{% block title %}
{% page_attribute "page_title" %} - {{ request.site.name }}
{% endblock title %}
</title>
<!-- Bootstrap Core CSS -->
<link href="{% static 'vendor/bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="{% static 'css/ie10-viewport-bug-workaround.css' %}" rel="stylesheet">
<!-- Custom Fonts -->
<link href="{% static 'vendor/font-awesome/css/font-awesome.min.css' %}" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<!-- Custom CSS -->
<link href="{% static 'css/ce3.css' %}" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- django CMS -->
{% render_block "css" %}
<!-- Divio Cloud -->
{{ ALDRYN_SNAKE.render_head }}
<!-- django CMS toolbar adjustment -->
{% if request.toolbar %}
<style>
.cms-toolbar-expanded .navbar-custom {
margin-top: 45px;
}
</style>
{% endif %}
</head>
<body>
<!-- django CMS Toolbar -->
{% cms_toolbar %}
<!-- Navigation -->
<nav class="navbar navbar-default navbar-custom navbar-fixed-top navbar-ce3">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
Menu <i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">{{ request.site.name }}</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">About</a></li>
<li><a href="#">News & Updates</a></li>
<li><a href="#">Contact Us</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Kristina <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Account</a></li>
<li><a href="index-logged-out.html">Sign Out</a></li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Main Content -->
{% block content %}
{% endblock %}
<hr>
<!-- Footer -->
<div class="container footer-container">
<div class="row">
<footer class="footer">
<div class="foot-1">
{% placeholder "address" %}
</div>
<div class="foot-2">
<ul>
<li><a href="">About</a></li>
<li>|</li>
<li><a href="">Terms of Use</a></li>
<li>|</li>
<li><a href="">Contact Us</a></li>
</ul>
</div>
</footer> <!-- end footer -->
</div> <!-- end row -->
</div> <!-- end container -->
<!-- jQuery -->
<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
<!-- Bootstrap Core JavaScript -->
<script src="{% static 'vendor/bootstrap/js/bootstrap.min.js' %}"></script>
<!-- Contact Form JavaScript -->
<script src="{% static 'js/jqBootstrapValidation.js' %}"></script>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="js/ie10-viewport-bug-workaround.js"></script>
<!-- django CMS -->
{% render_block "js" %}
<!-- Divio Cloud -->
{{ ALDRYN_SNAKE.render_tail }}
</body>
</html>
content.html
{% extends "base.html" %}
{% load cms_tags %}
{% block content %}
<div class="container">
<div class="banner-zone">
<div class="container">
<div class="row">
<div class="col-md-7">
<div class="title-box">
<h1>{% placeholder "banner title" %}</h1>
<h2>{% placeholder "banner subtitle" %}</h2>
</div>
</div>
<div class="col-md-5">
<div class="black-box">
<p>{% placeholder "banner introduction" %}</p>
</div>
</div>
</div><!-- row -->
</div><!-- container -->
</div><!-- banner-zone -->
<div class="container">
<div class="row text-block">
<a id="nav-anchor"></a>
<p class="emphasis"><span>The Cookbook.</span> The links below lay out the steps along the CE3 roadmap, from Research and Analysis, to Deployment and Operations. Within each chevron, you will find information, tools and resources to help you complete that step.</p>
</div>
<div class="row" style="margin-top:70px">
<div class="col-sm-5">
{% placeholder "CE3 Pilot Image" %}
</div>
<div class="col-sm-7">
<h3>The CE3 Pilot</h3>
<p>{% placeholder "project introduction" %}</p>
</div>
</div>
</div> <!-- /container -->
</div>
{% endblock content %}
页面-content.html
{% extends "base.html" %}
{% load cms_tags %}
{% block content %}
<div class="container">
<div class="row">
<div class="col-sm-4">
<!-- Secondary left-side navbar -->
<div class="navbar navbar-default sidenav-ce3">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#side-nav">
Phase Menu
</button>
</div>
<div id="side-nav" class="collapse navbar-collapse main-nav">
<ul class="nav navbar-nav">
<li class="step-through-nav"><a href="index.html#nav-anchor"><span
class="glyphicon glyphicon-chevron-left"></span> Back to Cookbook</a></li>
<li class="active"><a href="prelim-sol-des.html">Preliminary Solution Design Summary</a>
</li>
<li><a href="psd_pull-tog-des.html">1. Pulling Together The Design</a></li>
<li><a href="psd_asbl-tech-req.html">2. Assemble Technical Requirements</a></li>
<li><a href="">3. Develop and Post Competitive Tender</a></li>
<li><a href="">4. Shortlist Selections</a></li>
<li><a href="">5. Reconcile Submission CAPEX with Business Model</a></li>
<li><a href="">6. Iterate Solution Design With Selected Vendors</a></li>
<li><a href="">7. Select Final Design & Finalize Business Model</a></li>
<li class="step-through-nav"><span class="descriptor">up next:</span><a
class="chevron-in-line" href="proj-finance.html">Project Finance</a></li>
</ul>
</div>
</div>
</div><!-- col-sm-4 left-nav -->
<div class="col-sm-8 main-content">
<h1>{% placeholder "page title" %}</h1>
<h4>{% placeholder "page subtitle" %}</h4>
<h3>Purpose</h3>
{% placeholder "purpose" %}
<div class="row">
{% include "page-elements/tools_templates.html" %}
</div>
<div class="row">
{% include "page-elements/helpful_resources.html" %}
</div>
<div class="row">
{% include "page-elements/publications.html" %}
</div>
</div>
</div>
</div> <!-- /container -->
{% endblock content %}
我的项目结构如下:
问题实际上出在 settings.py
文件中。
根据文档,需要在 settings.py
内的 CMS_TEMPLATES
中指定模板
(http://docs.django-cms.org/en/release-3.4.x/introduction/templates_placeholders.html#templates)
我的原始 settings.py
文件中没有任何 CMS_TEMPLATES
。
原始settings.py文件:
INSTALLED_ADDONS = [
# <INSTALLED_ADDONS> # Warning: text inside the INSTALLED_ADDONS tags is auto-generated. Manual changes will be overwritten.
'aldryn-addons',
'aldryn-django',
'aldryn-sso',
'aldryn-django-cms',
'aldryn-devsync',
'aldryn-bootstrap3',
'djangocms-googlemap',
'djangocms-history',
'djangocms-snippet',
'djangocms-style',
'djangocms-text-ckeditor',
'djangocms-video',
'django-filer',
# </INSTALLED_ADDONS>
]
import aldryn_addons.settings
aldryn_addons.settings.load(locals())
# all django settings can be altered here
INSTALLED_APPS.extend([
# add your project specific apps here
])
MIDDLEWARE_CLASSES.extend([
# add your own middlewares here
])
已编辑 settings.py 文件:
INSTALLED_ADDONS = [
# <INSTALLED_ADDONS> # Warning: text inside the INSTALLED_ADDONS tags is auto-generated. Manual changes will be overwritten.
'aldryn-addons',
'aldryn-django',
'aldryn-sso',
'aldryn-django-cms',
'aldryn-devsync',
'aldryn-bootstrap3',
'djangocms-googlemap',
'djangocms-history',
'djangocms-snippet',
'djangocms-style',
'djangocms-text-ckeditor',
'djangocms-video',
'django-filer',
# </INSTALLED_ADDONS>
]
import aldryn_addons.settings
aldryn_addons.settings.load(locals())
# all django settings can be altered here
INSTALLED_APPS.extend([
# add your project specific apps here
])
MIDDLEWARE_CLASSES.extend([
# add your own middlewares here
])
CMS_TEMPLATES = (
('content.html', 'Home Page'),
('page-content.html', 'Section Page'),
('sub-section-page.html', 'Sub Section Page'),
)
一旦在 settings.py
文件中指定了模板,它们就可以在 CMS 工具栏中的“页面”>“模板”中使用。
我是 django CMS 的新手(2 天前开始),我已经按照 Divio 提供的教程进行操作。
我的主页完全可用,非常棒。我现在正在尝试创建其余页面,但我很困惑。
在我的模板目录中,我有一个 base.html
,其中包含网站的总体布局和一个内容块。
然后我 content.html
将主页代码放入内容块。
page-content.html
是我网站上所有其他页面的内容块中的代码。
我的问题是,每当我使用 django CMS 工具栏在我的网站上添加新页面时,它总是使用 content.html
页面。基本上,当我单击 Add a Page
按钮时,它只会添加一个看起来与主页完全一样的页面。我想让我的主页成为一种布局,然后那里的每一页都有不同的布局,这样当我单击 Add a Page
时,它可以让我添加第二种布局。这可能吗?
注意:主页和其他布局都可以用作页面。它们并不是真正的新闻博客页面或类似内容。我可以在上面放置不同的 CMS 插件的常规页面是完美的。
如果您需要更多信息才能正确回答,请告诉我! :)
base.html
{% load staticfiles i18n cms_tags sekizai_tags menu_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>
{% block title %}
{% page_attribute "page_title" %} - {{ request.site.name }}
{% endblock title %}
</title>
<!-- Bootstrap Core CSS -->
<link href="{% static 'vendor/bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="{% static 'css/ie10-viewport-bug-workaround.css' %}" rel="stylesheet">
<!-- Custom Fonts -->
<link href="{% static 'vendor/font-awesome/css/font-awesome.min.css' %}" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<!-- Custom CSS -->
<link href="{% static 'css/ce3.css' %}" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- django CMS -->
{% render_block "css" %}
<!-- Divio Cloud -->
{{ ALDRYN_SNAKE.render_head }}
<!-- django CMS toolbar adjustment -->
{% if request.toolbar %}
<style>
.cms-toolbar-expanded .navbar-custom {
margin-top: 45px;
}
</style>
{% endif %}
</head>
<body>
<!-- django CMS Toolbar -->
{% cms_toolbar %}
<!-- Navigation -->
<nav class="navbar navbar-default navbar-custom navbar-fixed-top navbar-ce3">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
Menu <i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">{{ request.site.name }}</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">About</a></li>
<li><a href="#">News & Updates</a></li>
<li><a href="#">Contact Us</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Kristina <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Account</a></li>
<li><a href="index-logged-out.html">Sign Out</a></li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Main Content -->
{% block content %}
{% endblock %}
<hr>
<!-- Footer -->
<div class="container footer-container">
<div class="row">
<footer class="footer">
<div class="foot-1">
{% placeholder "address" %}
</div>
<div class="foot-2">
<ul>
<li><a href="">About</a></li>
<li>|</li>
<li><a href="">Terms of Use</a></li>
<li>|</li>
<li><a href="">Contact Us</a></li>
</ul>
</div>
</footer> <!-- end footer -->
</div> <!-- end row -->
</div> <!-- end container -->
<!-- jQuery -->
<script src="{% static 'vendor/jquery/jquery.min.js' %}"></script>
<!-- Bootstrap Core JavaScript -->
<script src="{% static 'vendor/bootstrap/js/bootstrap.min.js' %}"></script>
<!-- Contact Form JavaScript -->
<script src="{% static 'js/jqBootstrapValidation.js' %}"></script>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="js/ie10-viewport-bug-workaround.js"></script>
<!-- django CMS -->
{% render_block "js" %}
<!-- Divio Cloud -->
{{ ALDRYN_SNAKE.render_tail }}
</body>
</html>
content.html
{% extends "base.html" %}
{% load cms_tags %}
{% block content %}
<div class="container">
<div class="banner-zone">
<div class="container">
<div class="row">
<div class="col-md-7">
<div class="title-box">
<h1>{% placeholder "banner title" %}</h1>
<h2>{% placeholder "banner subtitle" %}</h2>
</div>
</div>
<div class="col-md-5">
<div class="black-box">
<p>{% placeholder "banner introduction" %}</p>
</div>
</div>
</div><!-- row -->
</div><!-- container -->
</div><!-- banner-zone -->
<div class="container">
<div class="row text-block">
<a id="nav-anchor"></a>
<p class="emphasis"><span>The Cookbook.</span> The links below lay out the steps along the CE3 roadmap, from Research and Analysis, to Deployment and Operations. Within each chevron, you will find information, tools and resources to help you complete that step.</p>
</div>
<div class="row" style="margin-top:70px">
<div class="col-sm-5">
{% placeholder "CE3 Pilot Image" %}
</div>
<div class="col-sm-7">
<h3>The CE3 Pilot</h3>
<p>{% placeholder "project introduction" %}</p>
</div>
</div>
</div> <!-- /container -->
</div>
{% endblock content %}
页面-content.html
{% extends "base.html" %}
{% load cms_tags %}
{% block content %}
<div class="container">
<div class="row">
<div class="col-sm-4">
<!-- Secondary left-side navbar -->
<div class="navbar navbar-default sidenav-ce3">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#side-nav">
Phase Menu
</button>
</div>
<div id="side-nav" class="collapse navbar-collapse main-nav">
<ul class="nav navbar-nav">
<li class="step-through-nav"><a href="index.html#nav-anchor"><span
class="glyphicon glyphicon-chevron-left"></span> Back to Cookbook</a></li>
<li class="active"><a href="prelim-sol-des.html">Preliminary Solution Design Summary</a>
</li>
<li><a href="psd_pull-tog-des.html">1. Pulling Together The Design</a></li>
<li><a href="psd_asbl-tech-req.html">2. Assemble Technical Requirements</a></li>
<li><a href="">3. Develop and Post Competitive Tender</a></li>
<li><a href="">4. Shortlist Selections</a></li>
<li><a href="">5. Reconcile Submission CAPEX with Business Model</a></li>
<li><a href="">6. Iterate Solution Design With Selected Vendors</a></li>
<li><a href="">7. Select Final Design & Finalize Business Model</a></li>
<li class="step-through-nav"><span class="descriptor">up next:</span><a
class="chevron-in-line" href="proj-finance.html">Project Finance</a></li>
</ul>
</div>
</div>
</div><!-- col-sm-4 left-nav -->
<div class="col-sm-8 main-content">
<h1>{% placeholder "page title" %}</h1>
<h4>{% placeholder "page subtitle" %}</h4>
<h3>Purpose</h3>
{% placeholder "purpose" %}
<div class="row">
{% include "page-elements/tools_templates.html" %}
</div>
<div class="row">
{% include "page-elements/helpful_resources.html" %}
</div>
<div class="row">
{% include "page-elements/publications.html" %}
</div>
</div>
</div>
</div> <!-- /container -->
{% endblock content %}
我的项目结构如下:
问题实际上出在 settings.py
文件中。
根据文档,需要在 settings.py
内的 CMS_TEMPLATES
中指定模板
(http://docs.django-cms.org/en/release-3.4.x/introduction/templates_placeholders.html#templates)
我的原始 settings.py
文件中没有任何 CMS_TEMPLATES
。
原始settings.py文件:
INSTALLED_ADDONS = [
# <INSTALLED_ADDONS> # Warning: text inside the INSTALLED_ADDONS tags is auto-generated. Manual changes will be overwritten.
'aldryn-addons',
'aldryn-django',
'aldryn-sso',
'aldryn-django-cms',
'aldryn-devsync',
'aldryn-bootstrap3',
'djangocms-googlemap',
'djangocms-history',
'djangocms-snippet',
'djangocms-style',
'djangocms-text-ckeditor',
'djangocms-video',
'django-filer',
# </INSTALLED_ADDONS>
]
import aldryn_addons.settings
aldryn_addons.settings.load(locals())
# all django settings can be altered here
INSTALLED_APPS.extend([
# add your project specific apps here
])
MIDDLEWARE_CLASSES.extend([
# add your own middlewares here
])
已编辑 settings.py 文件:
INSTALLED_ADDONS = [
# <INSTALLED_ADDONS> # Warning: text inside the INSTALLED_ADDONS tags is auto-generated. Manual changes will be overwritten.
'aldryn-addons',
'aldryn-django',
'aldryn-sso',
'aldryn-django-cms',
'aldryn-devsync',
'aldryn-bootstrap3',
'djangocms-googlemap',
'djangocms-history',
'djangocms-snippet',
'djangocms-style',
'djangocms-text-ckeditor',
'djangocms-video',
'django-filer',
# </INSTALLED_ADDONS>
]
import aldryn_addons.settings
aldryn_addons.settings.load(locals())
# all django settings can be altered here
INSTALLED_APPS.extend([
# add your project specific apps here
])
MIDDLEWARE_CLASSES.extend([
# add your own middlewares here
])
CMS_TEMPLATES = (
('content.html', 'Home Page'),
('page-content.html', 'Section Page'),
('sub-section-page.html', 'Sub Section Page'),
)
一旦在 settings.py
文件中指定了模板,它们就可以在 CMS 工具栏中的“页面”>“模板”中使用。