Blog templates
This commit is contained in:
parent
17db5317f8
commit
d39f7cb726
4 changed files with 253 additions and 94 deletions
115
publichealth/home/templates/puput/base.html
Normal file
115
publichealth/home/templates/puput/base.html
Normal file
|
|
@ -0,0 +1,115 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static i18n wagtailcore_tags wagtailimages_tags wagtailroutablepage_tags wagtailuserbar puput_tags %}
|
||||
|
||||
{% block body_class %}blog{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
<meta name="title"
|
||||
content="{% block meta_title %}
|
||||
{% if blog_page.seo_title %}
|
||||
{{ blog_page.seo_title }}
|
||||
{% else %}
|
||||
{{ blog_page.title }}
|
||||
{% endif %}
|
||||
{% endblock meta_title %}"/>
|
||||
<meta name="description"
|
||||
content="{% block meta_description %}
|
||||
{{ blog_page.search_description }}
|
||||
{% endblock meta_description %}"/>
|
||||
{% block social_share %}{% endblock social_share %}
|
||||
<link rel="canonical" href="{% block canonical %}{% canonical_url %}{% endblock canonical %}"/>
|
||||
<style>
|
||||
body {
|
||||
--main-color: {{blog_page.main_color}};
|
||||
}
|
||||
.content-page.blog-header {
|
||||
background-color: {{blog_page.main_color}};
|
||||
}
|
||||
.content-page.blog-header h1 a { color: white; }
|
||||
.blog-page section { background-color: transparent !important; }
|
||||
.container .page-content, .blog_grid { background: white; }
|
||||
</style>
|
||||
<link rel="stylesheet" href="{% static 'puput/css/puput.css' %}"/>
|
||||
<script src="{% static 'puput/js/puput.js' %}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="content-page blog-header">
|
||||
{% if blog_page.header_image %}
|
||||
<span class="image featured">
|
||||
{% image blog_page.header_image fill-1500x120 as header_image %}
|
||||
<img alt="{{ blog_page.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
<section class="{% if blog_page.header_image %}title-section-image{% else %}title-section{% endif %}">
|
||||
<h1 class="title-header">
|
||||
<a href="{% pageurl blog_page %}">{{ blog_page.title }}</a>
|
||||
</h1>
|
||||
{% if not blog_page.header_image %}
|
||||
<h2>{{ blog_page.description }}</h2>
|
||||
{% endif %}
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="content-page blog-page">
|
||||
<div class="container container-blog">
|
||||
<div class="row">
|
||||
<div class="col-sm-8 col-md-9">
|
||||
{% block blog_content %}{% endblock blog_content %}
|
||||
{% block extra_content %}{% endblock extra_content %}
|
||||
</div>
|
||||
|
||||
<div class="col-sm-4 col-md-3">
|
||||
<div class="blog_sidebar">
|
||||
<div class="rss-sitemap">
|
||||
<a href="{% feeds_url blog_page %}" target="_blank" title="RSS">
|
||||
<i class="fa fa-rss-square"></i> <span>{% trans 'Feed RSS' %}</span>
|
||||
</a>
|
||||
</div>
|
||||
<form name="search_form" class="search_form" method="get" action="{% routablepageurl blog_page 'entries_search' %}">
|
||||
<div class="input-group">
|
||||
<input type="search" name="q" placeholder="{% trans 'Search' %}">
|
||||
<span class="input-group-btn">
|
||||
<button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% if blog_page.display_last_entries %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Last Entries' %}</h4>
|
||||
{% recent_entries blog_page.num_last_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_popular_entries %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Popular Entries' %}</h4>
|
||||
{% popular_entries blog_page.num_popular_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_categories %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Categories' %}</h4>
|
||||
{% categories_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_tags %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Tags' %}</h4>
|
||||
{% tags_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_archive %}
|
||||
<ul class="sidebar widget menu">
|
||||
<h4>{% trans 'Archive' %}</h4>
|
||||
{% archives_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
|
@ -1,30 +1,48 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static i18n wagtailcore_tags wagtailimages_tags puput_tags %}
|
||||
{% extends "puput/base.html" %}
|
||||
|
||||
{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}
|
||||
{% load static i18n wagtailcore_tags wagtailimages_tags puput_tags social_share %}
|
||||
|
||||
{% block title %}
|
||||
{% if search_term %}
|
||||
{{ search_term }} | {{ blog_page.title }}
|
||||
{% else %}
|
||||
{{ block.super }}
|
||||
{% endif %}
|
||||
{% endblock title %}
|
||||
|
||||
{% block meta_title %}
|
||||
{% if search_term %}
|
||||
{% trans 'Entries for' %} {{ search_type }} {{ search_term }}
|
||||
{% else %}
|
||||
{{ block.super }}
|
||||
{% endif %}
|
||||
{% endblock meta_title %}
|
||||
|
||||
{% block meta_description %}
|
||||
{% if search_term %}
|
||||
{% trans 'Entries for' %} {{ search_type }} {{ search_term }}
|
||||
{% else %}
|
||||
{{ block.super }}
|
||||
{% endif %}
|
||||
{% endblock meta_description %}
|
||||
|
||||
{% block title %}{% if search_term %}{{ search_term }} | {{ blog_page.title }}{% else %}{{ block.super }}{% endif %}{% endblock title %}
|
||||
{% block meta_title %}{% if search_term %}{% trans 'Entries for' %} {{ search_type }} {{ search_term }}{% else %}{{ block.super }}{% endif %}{% endblock meta_title %}
|
||||
{% block meta_description %}{% if search_term %}{% trans 'Entries for' %} {{ search_type }} {{ search_term }}{% else %}{{ block.super }}{% endif %}{% endblock meta_description %}
|
||||
{% block social_share %}
|
||||
{% image blog_page.header_image fill-800x450 as share_image %}
|
||||
<meta property="og:title" content="{{ blog_page.title }}" />
|
||||
<meta property="og:description" content="{{ blog_page.description }}" />
|
||||
<meta property="og:url" content="{% canonical_url %}" />
|
||||
{% if blog_page.header_image %}
|
||||
<meta property="og:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image:width" content="800" />
|
||||
<meta property="og:image:height" content="450" />
|
||||
<meta name="twitter:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image:width" content="800" />
|
||||
<meta property="og:image:height" content="450" />
|
||||
<meta name="twitter:image" content="{% image_url share_image.url %}" />
|
||||
{% endif %}
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content="{{ blog_page.title }}" />
|
||||
<meta name="twitter:description" content="{{ blog_page.description }}" />
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ blog_page.title }}" href="{% feeds_url blog_page %}" />
|
||||
{% endblock social_share %}
|
||||
|
||||
{% block content %}
|
||||
<section id="news-page">
|
||||
{% block blog_content %}
|
||||
{% with per_page=blog_page.num_entries_page %}
|
||||
{# 'paginate' tag cannot render dotted variables, so we need to create a context var #}
|
||||
{% paginate per_page entries %}
|
||||
|
|
@ -32,33 +50,51 @@
|
|||
<div class="searchTerm">{% trans 'Entries for' %} {{ search_type }} "{{ search_term }}"</div>
|
||||
{% endif %}
|
||||
{% for entry in entries %}
|
||||
<article class="container page-content">
|
||||
{% entry_url entry blog_page as post_url %}
|
||||
<article class="box page-content blog_grid">
|
||||
{% include 'puput/entry_page_header.html' %}
|
||||
{% if entry.header_image %}
|
||||
<span class="img-responsive">
|
||||
{% image entry.header_image fill-800x240 as header_image %}
|
||||
<img alt="{{ entry.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% endif %}
|
||||
<div class="article">
|
||||
<section>
|
||||
{% if entry.header_image %}
|
||||
<span class="img-responsive">
|
||||
{% image entry.header_image fill-800x240 as header_image %}
|
||||
<img alt="{{ entry.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% endif %}
|
||||
{% include 'puput/entry_links.html' %}
|
||||
</section>
|
||||
<section class="article">
|
||||
{% if entry.excerpt %}
|
||||
{{ entry.excerpt|richtext }}
|
||||
{% else %}
|
||||
{{ entry.body|richtext|truncatewords_html:70 }}
|
||||
{% endif %}
|
||||
<a class="blog_btn continue" href="{% pageurl entry %}">{% trans 'Continue reading' %} »</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<ul class="social-share col-md-9">
|
||||
<li class="social-item">
|
||||
{% post_to_facebook post_url '<span><i class="fa fa-facebook"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_twitter entry.title post_url '<span><i class="fa fa-twitter"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_linkendin post_url '<span><i class="fa fa-linkedin"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_gplus post_url '<span><i class="fa fa-google-plus"></i></span>' %}
|
||||
</li>
|
||||
</ul>
|
||||
<div class="col-md-3">
|
||||
<a class="blog_btn continue" href="{{ post_url }}">{% trans 'Continue reading' %} »</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
{% empty %}
|
||||
<span>{% trans 'No results found.' %}</span>
|
||||
{% endfor %}
|
||||
|
||||
<div class="pagination">
|
||||
{% show_paginator %}
|
||||
</div>
|
||||
{% endwith %}
|
||||
</section>
|
||||
|
||||
<a href="{% feeds_url blog_page %}" target="_blank" title="RSS">
|
||||
<i class="fa fa-rss-square"></i> <span>RSS Feed</span>
|
||||
</a>
|
||||
{% endblock content %}
|
||||
{% endblock blog_content %}
|
||||
|
|
|
|||
|
|
@ -1,50 +1,88 @@
|
|||
{% extends "base.html" %}
|
||||
{% load wagtailcore_tags wagtailimages_tags puput_tags %}
|
||||
{% extends "puput/base.html" %}
|
||||
{% load i18n wagtailcore_tags wagtailimages_tags puput_tags social_share %}
|
||||
|
||||
{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}
|
||||
{% block title %}
|
||||
{{ self.title }} | {{ blog_page.title }}
|
||||
{% endblock title %}
|
||||
|
||||
{% block meta_title %}
|
||||
{% if self.seo_title %}
|
||||
{{ self.seo_title }}
|
||||
{% else %}
|
||||
{{ self.title }}
|
||||
{% endif %}
|
||||
{% endblock meta_title %}
|
||||
|
||||
{% block meta_description %}
|
||||
{% if self.search_description %}
|
||||
{{ self.search_description }}
|
||||
{% else %}
|
||||
{{ self.body|striptags|truncatewords:20 }}
|
||||
{% endif %}
|
||||
{% endblock meta_description %}
|
||||
|
||||
{% block canonical %}
|
||||
{% canonical_url entry=self %}
|
||||
{% endblock canonical %}
|
||||
|
||||
{% block title %}{{ self.title }} | {{ blog_page.title }}{% endblock title %}
|
||||
{% block meta_title %}{% if self.seo_title %}{{ self.seo_title }}{% else %}{{ self.title }}{% endif %}{% endblock meta_title %}
|
||||
{% block meta_description %}{% if self.search_description %}{{ self.search_description }}{% else %}{{ self.body|striptags|truncatewords:20 }}{% endif %}{% endblock meta_description %}
|
||||
{% block canonical %}{% canonical_url entry=self %}{% endblock canonical %}
|
||||
{% block social_share %}
|
||||
{% image self.header_image fill-800x450 as share_image %}
|
||||
<meta property="og:title" content="{{ self.title }}" />
|
||||
<meta property="og:description" content="{% if self.excerpt %}{{ self.excerpt|striptags }}{% else %}{{ self.body|striptags|truncatewords:20 }}{% endif %}" />
|
||||
<meta property="og:url" content="{% canonical_url entry=self %}" />
|
||||
{% if self.header_image %}
|
||||
<meta property="og:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image:width" content="800" />
|
||||
<meta property="og:image:height" content="450" />
|
||||
<meta name="twitter:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image" content="{% image_url share_image.url %}" />
|
||||
<meta property="og:image:width" content="800" />
|
||||
<meta property="og:image:height" content="450" />
|
||||
<meta name="twitter:image" content="{% image_url share_image.url %}" />
|
||||
{% endif %}
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content="{{ self.title }}" />
|
||||
<meta name="twitter:description" content="{% if self.excerpt %}{{ self.excerpt|striptags }}{% else %}{{ self.body|striptags|truncatewords:20 }}{% endif %}" />
|
||||
{% endblock social_share %}
|
||||
|
||||
{% block content %}
|
||||
<section class="content-page">
|
||||
<article class="container"
|
||||
{%if self.id %}data-entry-page-update-comments-url="{% url 'entry_page_update_comments' self.id %}{% endif %}">
|
||||
{% block blog_content %}
|
||||
<article class="box page-content"
|
||||
{% if self.id %}data-entry-page-update-comments-url="{% url 'entry_page_update_comments' self.id %}{% endif %}">
|
||||
{% include 'puput/entry_page_header.html' with entry=self %}
|
||||
{% if self.header_image %}
|
||||
<section>
|
||||
<span class="image featured">
|
||||
{% image self.header_image fill-800x450 as header_image %}
|
||||
<img alt="{{ self.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% include 'puput/entry_links.html' with entry=self %}
|
||||
</section>
|
||||
{% endif %}
|
||||
<section>
|
||||
{{ self.body|richtext}}
|
||||
<div class="row">
|
||||
<div class="col-md-2">
|
||||
<a href="{% pageurl blog_page %}" class="blog_btn back">
|
||||
<i class="fa fa-angle-left"></i> {% trans 'Return' %}
|
||||
</a>
|
||||
</div>
|
||||
{% entry_url self blog_page as post_url %}
|
||||
<ul class="social-share-all text-right col-md-10">
|
||||
<li class="social-item">
|
||||
{% post_to_facebook post_url '<span><i class="fa fa-facebook"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_twitter self.title post_url '<span><i class="fa fa-twitter"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_linkendin post_url '<span><i class="fa fa-linkedin"></i></span>' %}
|
||||
</li>
|
||||
<li class="social-item">
|
||||
{% post_to_gplus post_url '<span><i class="fa fa-google-plus"></i></span>' %}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if self.header_image %}
|
||||
<div class="image">
|
||||
{% image self.header_image fill-940x300 as header_image %}
|
||||
<img alt="{{ self.header_image.title }}" src="{{ header_image.url }}" class="img-responsive">
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% include 'puput/entry_page_header.html' with entry=self %}
|
||||
|
||||
<div class="article-body" role="main">
|
||||
{{ self.body|richtext}}
|
||||
</div>
|
||||
|
||||
{% show_comments %}
|
||||
</article>
|
||||
</section>
|
||||
{% endblock content %}
|
||||
</section>
|
||||
{% show_comments %}
|
||||
</article>
|
||||
{% endblock blog_content %}
|
||||
|
||||
{% block extra_content %}
|
||||
{% if self.has_related %}
|
||||
|
|
|
|||
|
|
@ -1,36 +1,6 @@
|
|||
{% load wagtailcore_tags wagtailroutablepage_tags puput_tags %}
|
||||
{% load puput_tags %}
|
||||
<header>
|
||||
<h2 class="post_title">
|
||||
<a href="{% pageurl entry %}">{{ entry.title }}</a>
|
||||
<a href="{% entry_url entry blog_page %}">{{ entry.title }}</a>
|
||||
</h2>
|
||||
<ul class="links">
|
||||
<li>
|
||||
<i class="fa fa-user"></i>
|
||||
<a href="{% routablepageurl blog_page "entries_by_author" entry.owner.username %}">
|
||||
{{ entry.owner.username }}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-calendar"></i>
|
||||
{{ entry.date|date:"DATE_FORMAT" }}
|
||||
</li>
|
||||
{% if entry.categories.count > 0 %}
|
||||
<li>
|
||||
<i class="fa fa-folder-open"></i>
|
||||
{% categories_list entry.categories %}
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if entry.tags.count > 0 %}
|
||||
<li>
|
||||
<i class="fa fa-tag"></i>
|
||||
{% tags_list blog_page.num_tags_entry_header entry.tags %}
|
||||
</li>
|
||||
{% endif %}
|
||||
{% if blog_page.disqus_api_secret %}
|
||||
<li>
|
||||
<i class="fa fa-comments"></i>
|
||||
{{ entry.num_comments }}
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</header>
|
||||
</header>
|
||||
Loading…
Reference in a new issue