blog
<!DOCTYPE html>
<html lang="<txp:lang />">
<head>
<txp:output_form form="blg-head"/>
</head>
<body>
<txp:output_form form="blg-navigation"/>
<div class="wrapper">
<div class="container">
<div role="main">
<txp:article limit="5" form="blg-article" />
</div>
</div>
</div>
<txp:output_form form="blg-footer"/>
</body>
</html>
blg-head
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><txp:page_title separator=" - " /></title>
<meta name="description" content="<txp:site_slogan />" />
<meta name="author" content="<txp:site_name />" />
<meta name="generator" content="TXP CMS">
<!-- Bootstrap Core CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<txp:css name='blog' format="link" media="" />
blg-navigation
<div class="blog-masthead">
<div class="container">
<nav class="blog-nav">
<txp:section_list sections="blog, about" include_default="1" wraptag="" break="">
<a <txp:if_section name='<txp:section />'>
class="blog-nav-item active"
<txp:else />
class="blog-nav-item"
</txp:if_section>
href="<txp:section url="1" />"><txp:section title="1" /></a>
</txp:section_list>
</nav>
</div>
</div>
blg-article
<h2 class="blog-post-title"><txp:permlink><txp:title /></txp:permlink></h2>
<p class="blog-post-meta"><txp:posted /></p>
<txp:body />
<p>
<strong><txp:text item="author" /></strong>
<span itemprop="author"><txp:author link="1" this_section="1" /></span>
<txp:if_article_category>
<br /><strong>Category </strong>
<span itemprop="keywords">
<txp:category1 title="1" link="1" /> <txp:category2 title="1" link="1" />
</span>
</txp:if_article_category>
</p>
<hr>
blg-footer
<footer class="blog-footer">
<p>Copyright © 2016 <a href="http://txpcms.com">TXP CMS</a></p>
</footer>
<!-- jQuery -->
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
blog
/*
* Globals
*/
body {
font-family: 'PT Sans', sans-serif;
font-size: 16px;
color: #555;
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
margin-top: 0;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: normal;
color: #333;
}
/*
* Override Bootstrap's default container.
*/
@media (min-width: 1200px) {
.container {
width: 970px;
}
}
/*
* Masthead for nav
*/
.blog-masthead {
background-color: #222;
border-color: #080808;
}
/* Nav links */
.blog-nav-item {
position: relative;
display: inline-block;
padding: 10px;
font-weight: 500;
color: #cdddeb;
}
.blog-nav-item:hover,
.blog-nav-item:focus {
color: #fff;
text-decoration: none;
}
/* Active state gets a caret at the bottom */
.blog-nav .active {
color: #fff;
}
.blog-nav .active:after {
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
margin-left: -5px;
vertical-align: middle;
content: " ";
border-right: 5px solid transparent;
border-bottom: 5px solid;
border-left: 5px solid transparent;
}
/*
* Blog name and description
*/
.blog-header {
padding-top: 20px;
padding-bottom: 20px;
}
.blog-title {
margin-top: 30px;
margin-bottom: 0;
font-size: 60px;
font-weight: normal;
}
.blog-description {
font-size: 20px;
color: #999;
}
/*
* Main column and sidebar layout
*/
.blog-main {
font-size: 18px;
line-height: 1.5;
}
/* Sidebar modules for boxing content */
.sidebar-module {
padding: 15px;
margin: 0 -15px 15px;
}
.sidebar-module-inset {
padding: 15px;
background-color: #F7F7F7;
border-radius: 4px;
}
.sidebar-module-inset p:last-child,
.sidebar-module-inset ul:last-child,
.sidebar-module-inset ol:last-child {
margin-bottom: 0;
}
/* Pagination */
.pager {
margin-bottom: 60px;
text-align: left;
}
.pager > li > a {
width: 140px;
padding: 10px 20px;
text-align: center;
border-radius: 30px;
}
/*
* Blog posts
*/
.blog-post {
margin-bottom: 60px;
}
.blog-post-title {
margin-bottom: 5px;
font-size: 40px;
}
.blog-post-meta {
margin-bottom: 20px;
color: #999;
}
/*
* Blog title
*/
.blog-post-title a {
color: #333;
border-radius: 0.1190476em;
}
.blog-post-title a:visited {
color: #333;
}
/*
* Footer
*/
.blog-footer {
padding: 40px 0;
color: #999;
text-align: center;
background-color: #f9f9f9;
border-top: 1px solid #e5e5e5;
}
.blog-footer p:last-child {
margin-bottom: 0;
}