mirror of
https://github.com/telekom-security/tpotce.git
synced 2025-04-29 19:58:52 +00:00
238 lines
15 KiB
Text
238 lines
15 KiB
Text
|
<!DOCTYPE html>
|
||
|
|
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8"/>
|
||
|
|
<meta content="IE=edge" http-equiv="X-UA-Compatible"/>
|
||
|
|
<title>Setting up your own Ghost theme</title>
|
||
|
|
<meta content="True" name="HandheldFriendly"/>
|
||
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||
|
|
<link href="/assets/built/screen.css?v=8cfc086fe8" rel="stylesheet" type="text/css"/>
|
||
|
|
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon"/>
|
||
|
|
<link href="/themes/" rel="canonical"/>
|
||
|
|
<meta content="no-referrer-when-downgrade" name="referrer"/>
|
||
|
|
<link href="/themes/amp/" rel="amphtml"/>
|
||
|
|
<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>
|
||
|
|
<script>//<![CDATA[
|
||
|
|
!function(){var o,i,n,e,r="//172.20.254.138:80/ghost/api/v0.1/";n={api:function(){var n,e=Array.prototype.slice.call(arguments),t=r;return(n=e.pop())&&"object"!=typeof n&&(e.push(n),n={}),(n=n||{}).client_id=o,n.client_secret=i,e.length&&e.forEach(function(n){t+=n.replace(/^\/|\/$/g,"")+"/"}),t+function(n){var e,t=[];if(!n)return"";for(e in n)n.hasOwnProperty(e)&&(n[e]||!1===n[e])&&t.push(e+"="+encodeURIComponent(n[e]));return t.length?"?"+t.join("&"):""}(n)}},e=function(n){o=n.clientId?n.clientId:"",i=n.clientSecret?n.clientSecret:"",r=n.url?n.url:r.match(/{\{api-url}}/)?"":r},"undefined"!=typeof window&&(window.ghost=window.ghost||{},window.ghost.url=n,window.ghost.init=e),"undefined"!=typeof module&&(module.exports={url:n,init:e})}();
|
||
|
|
//]]></script>
|
||
|
|
<script>ghost.init({clientId:"ghost-frontend",clientSecret:"99616761d626"});</script>
|
||
|
|
<meta content="Ghost 1.25" name="generator"/>
|
||
|
|
<link href="/rss/" rel="alternate" title="user Blog" type="application/rss+xml"/>
|
||
|
|
</head>
|
||
|
|
<body class="post-template tag-getting-started">
|
||
|
|
<div class="site-wrapper">
|
||
|
|
<header class="site-header outer">
|
||
|
|
<div class="inner">
|
||
|
|
<nav class="site-nav">
|
||
|
|
<div class="site-nav-left">
|
||
|
|
<a class="site-nav-logo" href=""><img alt="user Blog" src="/v1.0.0/images/ghost-logo.svg"/></a>
|
||
|
|
<ul class="nav" role="menu">
|
||
|
|
<li class="nav-home" role="menuitem"><a href="/">Home</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<div class="site-nav-right">
|
||
|
|
<div class="social-links">
|
||
|
|
</div>
|
||
|
|
<a class="rss-button" href="https://feedly.com/i/subscription/feed/http://172.20.254.138:80/rss/" rel="noopener" target="_blank"><svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><circle cx="6.18" cy="17.82" r="2.18"></circle><path d="M4 4.44v2.83c7.03 0 12.73 5.7 12.73 12.73h2.83c0-8.59-6.97-15.56-15.56-15.56zm0 5.66v2.83c3.9 0 7.07 3.17 7.07 7.07h2.83c0-5.47-4.43-9.9-9.9-9.9z"></path></svg>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
<main class="site-main outer" id="site-main">
|
||
|
|
<div class="inner">
|
||
|
|
<article class="post-full post tag-getting-started ">
|
||
|
|
<header class="post-full-header">
|
||
|
|
<section class="post-full-meta">
|
||
|
|
<time class="post-full-meta-date" datetime="2018-08-09">9 August 2018</time>
|
||
|
|
<span class="date-divider">/</span> <a href="/tag/getting-started/">Getting Started</a>
|
||
|
|
</section>
|
||
|
|
<h1 class="post-full-title">Setting up your own Ghost theme</h1>
|
||
|
|
</header>
|
||
|
|
<figure class="post-full-image" style="background-image:url(https://casper.ghost.org/v1.0.0/images/design.jpg)">
|
||
|
|
</figure>
|
||
|
|
<section class="post-full-content">
|
||
|
|
<div 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"><img alt="marketplace" src="/v1.0.0/images/marketplace.jpg"/></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>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<footer class="post-full-footer">
|
||
|
|
<section class="author-card">
|
||
|
|
<span class="avatar-wrapper"><svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M3.513 18.998C4.749 15.504 8.082 13 12 13s7.251 2.504 8.487 5.998C18.47 21.442 15.417 23 12 23s-6.47-1.558-8.487-4.002zM12 12c2.21 0 4-2.79 4-5s-1.79-4-4-4-4 1.79-4 4 1.79 5 4 5z" fill="#FFF"></path></g></svg>
|
||
|
|
</span>
|
||
|
|
<section class="author-card-content">
|
||
|
|
<h4 class="author-card-name"><a href="/author/ghost/">Ghost</a></h4>
|
||
|
|
<p>You can delete this user to remove all the welcome posts</p>
|
||
|
|
</section>
|
||
|
|
</section>
|
||
|
|
<div class="post-full-footer-right">
|
||
|
|
<a class="author-card-button" href="/author/ghost/">Read More</a>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</article>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
<aside class="read-next outer">
|
||
|
|
<div class="inner">
|
||
|
|
<div class="read-next-feed">
|
||
|
|
<article class="read-next-card" style="background-image:url(https://casper.ghost.org/v1.0.0/images/blog-cover.jpg)">
|
||
|
|
<header class="read-next-card-header">
|
||
|
|
<small class="read-next-card-header-sitetitle">— user Blog —</small>
|
||
|
|
<h3 class="read-next-card-header-title"><a href="/tag/getting-started/">Getting Started</a></h3>
|
||
|
|
</header>
|
||
|
|
<div class="read-next-divider"><svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M13 14.5s2 3 5 3 5.5-2.463 5.5-5.5S21 6.5 18 6.5c-5 0-7 11-12 11C2.962 17.5.5 15.037.5 12S3 6.5 6 6.5s4.5 3.5 4.5 3.5"></path></svg>
|
||
|
|
</div>
|
||
|
|
<div class="read-next-card-content">
|
||
|
|
<ul>
|
||
|
|
<li><a href="/welcome/">Welcome to Ghost</a></li>
|
||
|
|
<li><a href="/the-editor/">Using the Ghost editor</a></li>
|
||
|
|
<li><a href="/using-tags/">Organising your content with tags</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<footer class="read-next-card-footer">
|
||
|
|
<a href="/tag/getting-started/">See all 6 posts →</a>
|
||
|
|
</footer>
|
||
|
|
</article>
|
||
|
|
<article class="post-card post tag-getting-started">
|
||
|
|
<a class="post-card-image-link" href="/advanced-markdown/">
|
||
|
|
<div class="post-card-image" style="background-image:url(https://casper.ghost.org/v1.0.0/images/advanced.jpg)"></div>
|
||
|
|
</a>
|
||
|
|
<div class="post-card-content">
|
||
|
|
<a class="post-card-content-link" href="/advanced-markdown/">
|
||
|
|
<header class="post-card-header">
|
||
|
|
<span class="post-card-tags">Getting Started</span>
|
||
|
|
<h2 class="post-card-title">Advanced Markdown tips</h2>
|
||
|
|
</header>
|
||
|
|
<section class="post-card-excerpt">
|
||
|
|
<p>There are lots of powerful things you can do with the Ghost editor If you've gotten pretty comfortable with all the basics of writing in Ghost, then you may enjoy some more advanced</p>
|
||
|
|
</section>
|
||
|
|
</a>
|
||
|
|
<footer class="post-card-meta">
|
||
|
|
<ul class="author-list">
|
||
|
|
<li class="author-list-item">
|
||
|
|
<div class="author-name-tooltip">
|
||
|
|
Ghost
|
||
|
|
</div>
|
||
|
|
<a class="static-avatar author-profile-image" href="/author/ghost/"><svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M3.513 18.998C4.749 15.504 8.082 13 12 13s7.251 2.504 8.487 5.998C18.47 21.442 15.417 23 12 23s-6.47-1.558-8.487-4.002zM12 12c2.21 0 4-2.79 4-5s-1.79-4-4-4-4 1.79-4 4 1.79 5 4 5z" fill="#FFF"></path></g></svg>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<span class="reading-time">2 min read</span>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</aside>
|
||
|
|
<div class="floating-header">
|
||
|
|
<div class="floating-header-logo">
|
||
|
|
<a href="">
|
||
|
|
<span>user Blog</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<span class="floating-header-divider">—</span>
|
||
|
|
<div class="floating-header-title">Setting up your own Ghost theme</div>
|
||
|
|
<div class="floating-header-share">
|
||
|
|
<div class="floating-header-share-label">Share this <svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||
|
|
<path d="M7.5 15.5V4a1.5 1.5 0 1 1 3 0v4.5h2a1 1 0 0 1 1 1h2a1 1 0 0 1 1 1H18a1.5 1.5 0 0 1 1.5 1.5v3.099c0 .929-.13 1.854-.385 2.748L17.5 23.5h-9c-1.5-2-5.417-8.673-5.417-8.673a1.2 1.2 0 0 1 1.76-1.605L7.5 15.5zm6-6v2m-3-3.5v3.5m6-1v2"></path>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
<a class="floating-header-share-tw" href="https://twitter.com/share?text=Setting%20up%20your%20own%20Ghost%20theme&url=http://172.20.254.138:80/themes/" onclick="window.open(this.href, 'share-twitter', 'width=550,height=235');return false;">
|
||
|
|
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M30.063 7.313c-.813 1.125-1.75 2.125-2.875 2.938v.75c0 1.563-.188 3.125-.688 4.625a15.088 15.088 0 0 1-2.063 4.438c-.875 1.438-2 2.688-3.25 3.813a15.015 15.015 0 0 1-4.625 2.563c-1.813.688-3.75 1-5.75 1-3.25 0-6.188-.875-8.875-2.625.438.063.875.125 1.375.125 2.688 0 5.063-.875 7.188-2.5-1.25 0-2.375-.375-3.375-1.125s-1.688-1.688-2.063-2.875c.438.063.813.125 1.125.125.5 0 1-.063 1.5-.25-1.313-.25-2.438-.938-3.313-1.938a5.673 5.673 0 0 1-1.313-3.688v-.063c.813.438 1.688.688 2.625.688a5.228 5.228 0 0 1-1.875-2c-.5-.875-.688-1.813-.688-2.75 0-1.063.25-2.063.75-2.938 1.438 1.75 3.188 3.188 5.25 4.25s4.313 1.688 6.688 1.813a5.579 5.579 0 0 1 1.5-5.438c1.125-1.125 2.5-1.688 4.125-1.688s3.063.625 4.188 1.813a11.48 11.48 0 0 0 3.688-1.375c-.438 1.375-1.313 2.438-2.563 3.188 1.125-.125 2.188-.438 3.313-.875z"></path></svg>
|
||
|
|
</a>
|
||
|
|
<a class="floating-header-share-fb" href="https://www.facebook.com/sharer/sharer.php?u=http://172.20.254.138:80/themes/" onclick="window.open(this.href, 'share-facebook','width=580,height=296');return false;">
|
||
|
|
<svg viewbox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="M19 6h5V0h-5c-3.86 0-7 3.14-7 7v3H8v6h4v16h6V16h5l1-6h-6V7c0-.542.458-1 1-1z"></path></svg>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<progress class="progress" id="reading-progress" value="0">
|
||
|
|
<div class="progress-container">
|
||
|
|
<span class="progress-bar"></span>
|
||
|
|
</div>
|
||
|
|
</progress>
|
||
|
|
</div>
|
||
|
|
<footer class="site-footer outer">
|
||
|
|
<div class="site-footer-content inner">
|
||
|
|
<section class="copyright"><a href="">user Blog</a> © 2018</section>
|
||
|
|
<nav class="site-footer-nav">
|
||
|
|
<a href="">Latest Posts</a>
|
||
|
|
<a href="https://ghost.org" rel="noopener" target="_blank">Ghost</a>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
<script crossorigin="anonymous" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" src="/jquery-3.2.1.min.js"></script>
|
||
|
|
<script src="/assets/js/jquery.fitvids.js,qv=8cfc086fe8.pagespeed.jm.nHU73nSfsl.js" type="text/javascript"></script>
|
||
|
|
<script>$(document).ready(function(){var $postContent=$(".post-full-content");$postContent.fitVids();var progressBar=document.querySelector('#reading-progress');var header=document.querySelector('.floating-header');var title=document.querySelector('.post-full-title');var lastScrollY=window.scrollY;var lastWindowHeight=window.innerHeight;var lastDocumentHeight=$(document).height();var ticking=false;function onScroll(){lastScrollY=window.scrollY;requestTick();}function onResize(){lastWindowHeight=window.innerHeight;lastDocumentHeight=$(document).height();requestTick();}function requestTick(){if(!ticking){requestAnimationFrame(update);}ticking=true;}function update(){var trigger=title.getBoundingClientRect().top+window.scrollY;var triggerOffset=title.offsetHeight+35;var progressMax=lastDocumentHeight-lastWindowHeight;if(lastScrollY>=trigger+triggerOffset){header.classList.add('floating-active');}else{header.classList.remove('floating-active');}progressBar.setAttribute('max',progressMax);progressBar.setAttribute('value',lastScrollY);ticking=false;}window.addEventListener('scroll',onScroll,{passive:true});window.addEventListener('resize',onResize,false);update();});</script>
|
||
|
|
</body>
|
||
|
|
</html>
|