tpotce/docker/tanner/snare/dist/pages/8/50f8f0588e30faaee873853ce1b145de

119 lines
16 KiB
Text
Raw Normal View History

2018-08-14 14:20:55 +00:00
<!DOCTYPE html>
<html ⚡="">
<head>
<meta charset="utf-8"/>
<title>Setting up your own Ghost theme</title>
<meta content="True" name="HandheldFriendly">
<meta content="width=device-width,minimum-scale=1,initial-scale=1" name="viewport"/>
<link href="/favicon.ico" rel="shortcut icon"/>
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon">
<link href="/themes/" rel="canonical"/>
<meta content="no-referrer-when-downgrade" name="referrer">
<meta content="user Blog" property="og:site_name"/>
<meta content="article" property="og:type"/>
<meta content="Setting up your own Ghost theme" property="og:title"/>
<meta content="Creating a totally custom design for your publication Ghost comes with a beautiful default theme called Casper, which is designed to be a clean, readable publication layout and can be easily adapted for most purposes. However, Ghost can also be completely themed to suit your needs. Rather than just giving" property="og:description"/>
<meta content="http://172.20.254.138:80/themes/" property="og:url"/>
<meta content="https://casper.ghost.org/v1.0.0/images/design.jpg" property="og:image"/>
<meta content="2018-08-09T11:04:46.000Z" property="article:published_time"/>
<meta content="2018-08-09T11:04:45.000Z" property="article:modified_time"/>
<meta content="Getting Started" property="article:tag"/>
<meta content="summary_large_image" name="twitter:card"/>
<meta content="Setting up your own Ghost theme" name="twitter:title"/>
<meta content="Creating a totally custom design for your publication Ghost comes with a beautiful default theme called Casper, which is designed to be a clean, readable publication layout and can be easily adapted for most purposes. However, Ghost can also be completely themed to suit your needs. Rather than just giving" name="twitter:description"/>
<meta content="http://172.20.254.138:80/themes/" name="twitter:url"/>
<meta content="https://casper.ghost.org/v1.0.0/images/design.jpg" name="twitter:image"/>
<meta content="Written by" name="twitter:label1"/>
<meta content="Ghost" name="twitter:data1"/>
<meta content="Filed under" name="twitter:label2"/>
<meta content="Getting Started" name="twitter:data2"/>
<meta content="1400" property="og:image:width"/>
<meta content="1050" property="og:image:height"/>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Article",
"publisher": {
"@type": "Organization",
"name": "user Blog",
"logo": "https://casper.ghost.org/v1.0.0/images/ghost-logo.svg"
},
"author": {
"@type": "Person",
"name": "Ghost",
"url": "http://172.20.254.138:80/author/ghost/",
"sameAs": []
},
"headline": "Setting up your own Ghost theme",
"url": "http://172.20.254.138:80/themes/",
"datePublished": "2018-08-09T11:04:46.000Z",
"dateModified": "2018-08-09T11:04:45.000Z",
"image": {
"@type": "ImageObject",
"url": "https://casper.ghost.org/v1.0.0/images/design.jpg",
"width": 1400,
"height": 1050
},
"keywords": "Getting Started",
"description": "Creating a totally custom design for your publication Ghost comes with a beautiful default theme called Casper, which is designed to be a clean, readable publication layout and can be easily adapted for most purposes. However, Ghost can also be completely themed to suit your needs. Rather than just giving",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "http://172.20.254.138:80/"
}
}
</script>
<meta content="Ghost 1.25" name="generator"/>
<link href="/rss/" rel="alternate" title="user Blog" type="application/rss+xml"/>
<link href="https://fonts.googleapis.com/css?family=Merriweather:300,700,700italic,300italic|Open+Sans:700,600,400" rel="stylesheet" type="text/css"/>
<style amp-custom="">html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{position:relative;vertical-align:baseline;font-size:75%;line-height:0}sup{top:-.5em}sub{bottom:-.25em}img{border:0}amp-img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;color:inherit;font:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{margin:0 2px;padding:.35em .625em .75em;border:1px solid silver}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}html{max-height:100%;height:100%;font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{max-height:100%;height:100%;color:#3a4145;background:#f4f8fb;letter-spacing:.01rem;font-family:"Merriweather",serif;font-size:1.8rem;line-height:1.75em;text-rendering:geometricPrecision;-webkit-font-feature-settings:"kern" 1;-moz-font-feature-settings:"kern" 1;-o-font-feature-settings:"kern" 1}::-moz-selection{background:#d6edff}::selection{background:#d6edff}h1,h2,h3,h4,h5,h6{margin:0 0 .3em 0;color:#2e2e2e;font-family:"Open Sans",sans-serif;line-height:1.15em;text-rendering:geometricPrecision;-webkit-font-feature-settings:"dlig" 1 , "liga" 1 , "lnum" 1 , "kern" 1;-moz-font-feature-settings:"dlig" 1 , "liga" 1 , "lnum" 1 , "kern" 1;-o-font-feature-settings:"dlig" 1 , "liga" 1 , "lnum" 1 , "kern" 1}h1{text-indent:-2px;letter-spacing:-1px;font-size:2.6rem}h2{letter-spacing:0;font-size:2.4rem}h3{letter-spacing:-.6px;font-size:2.1rem}h4{font-size:1.9rem}h5{font-size:1.8rem}h6{font-size:1.8rem}a{color:#4a4a4a}a:hover{color:#111}p,ul,ol,dl{margin:0 0 2.5rem 0;font-size:1.5rem;text-rendering:geometricPrecision;-webkit-font-feature-settings:"liga" 1 , "onum" 1 , "kern" 1;-moz-font-feature-settings:"liga" 1 , "onum" 1 , "kern" 1;-o-font-feature-settings:"liga" 1 , "onum" 1 , "kern" 1}ol,ul{padding-left:2em}ol ol,ul ul,ul ol,ol ul{margin:0 0 .4em 0;padding-left:2em}dl dt{float:left;clear:left;overflow:hidden;margin-bottom:1em;width:180px;text-align:right;text-overflow:ellipsis;white-space:nowrap;font-weight:700}dl dd{margin-bottom:1em;margin-left:200px}li{margin:.4em 0}li li{margin:0}hr{display:block;margin:1.75em 0;padding:0;height:1px;border:0;border-top:#efefef 1px solid}blockquote{box-sizing:border-box;margin:1.75em 0 1.75em 0;padding:0 0 0 1.75em;border-left:#4a4a4a .4em solid;-moz-box-sizing:border-box}blockquote p{margin:.8em 0;font-style:italic}blockquote small{display:inline-block;margin:.8em 0 .8em 1.5em;color:#ccc;font-size:.9em}blockquote small:before{content:"\2014 \00A0"}blockquote cite{font-weight:700}blockquote cite a{font-weight:normal}mark{background-color:#fdffb6}code,tt{padding:1px 3px;border:#e3edf3 1px solid;background:#f7fafb;border-radius:2px;white-space:pre-wrap;font-family:Inconsol
<style amp-boilerplate="">body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate="">body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async="" src="/v0.js"></script>
</meta></link></meta></head>
<body class="amp-template">
<header class="main-header">
<nav class="blog-title">
<a href="">user Blog</a>
</nav>
</header>
<main class="content" role="main">
<article class="post">
<header class="post-header">
<h1 class="post-title">Setting up your own Ghost theme</h1>
<section class="post-meta">
<p class="author">by <a href="/author/ghost/">Ghost</a></p>
<time class="post-date" datetime="2018-08-09">2018-08-09</time>
</section>
</header>
<figure class="post-image">
<amp-img height="400" layout="responsive" src="/v1.0.0/images/design.jpg" width="600"></amp-img>
</figure>
<section class="post-content">
<div class="kg-card-markdown"><p>Creating a totally custom design for your publication</p>
<p>Ghost comes with a beautiful default theme called Casper, which is designed to be a clean, readable publication layout and can be easily adapted for most purposes. However, Ghost can also be completely themed to suit your needs. Rather than just giving you a few basic settings which act as a poor proxy for code, we just let you write code.</p>
<p>There are a huge range of both free and premium pre-built themes which you can get from the <a href="http://marketplace.ghost.org">Ghost Theme Marketplace</a>, or you can simply create your own from scratch.</p>
<p><a href="http://marketplace.ghost.org"><amp-img alt="marketplace" height="893" layout="responsive" src="/v1.0.0/images/marketplace.jpg" width="1400"></amp-img></a></p>
<blockquote>
<p>Anyone can write a completely custom Ghost theme, with just some solid knowledge of HTML and CSS</p>
</blockquote>
<p>Ghost themes are written with a templating language called handlebars, which has a bunch of dynamic helpers to insert your data into template files. Like <code>{{author.name}}</code>, for example, outputs the name of the current author.</p>
<p>The best way to learn how to write your own Ghost theme is to have a look at <a href="https://github.com/TryGhost/Casper">the source code for Casper</a>, which is heavily commented and should give you a sense of how everything fits together.</p>
<ul>
<li><code>default.hbs</code> is the main template file, all contexts will load inside this file unless specifically told to use a different template.</li>
<li><code>post.hbs</code> is the file used in the context of viewing a post.</li>
<li><code>index.hbs</code> is the file used in the context of viewing the home page.</li>
<li>and so on</li>
</ul>
<p>We've got <a href="http://themes.ghost.org/v1.23.0/docs/about">full and extensive theme documentation</a> which outlines every template file, context and helper that you can use.</p>
<p>If you want to chat with other people making Ghost themes to get any advice or help, there's also a <strong>themes</strong> section on our <a href="https://forum.ghost.org/c/themes">public Ghost forum</a>.</p>
</div>
</section>
</article>
</main>
<footer class="site-footer clearfix">
<section class="copyright"><a href="">user Blog</a> © 2018</section>
<section class="poweredby">Proudly published with <a href="https://ghost.org">Ghost</a></section>
</footer>
</body>
</html>