├── .gitignore
├── README.md
├── assets
├── css
│ └── style.css
├── images
│ └── cover.jpg
└── js
│ └── script.js
├── author.hbs
├── default.hbs
├── error.hbs
├── home.hbs
├── index.hbs
├── package.json
├── page-contact.hbs
├── page.hbs
├── partials
├── contact.hbs
├── excerpt.hbs
├── nav-container.hbs
├── navigation.hbs
└── pagination.hbs
├── post.hbs
├── private.hbs
├── screenshot1.png
├── screenshot2.png
└── tag.hbs
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | development
3 | gulpfile.js
4 | assets/images/cover-old.jpg
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # OpenWriter
2 | ### A free theme for Ghost
3 |
4 | I created this theme as a way to learn how Ghost works. It is available for free. If you use the theme or have any suggestions for improvements, do tweet me at [@ireaderinokun](https://twitter.com/ireaderinokun)!
5 |
6 | 
7 |
8 | 
9 |
10 |
11 | ## Getting Started
12 |
13 | If you are completely new to Ghost, you should read their [documentation here first](https://github.com/tryghost/Ghost). Otherwise, continue reading!
14 |
15 | To install this theme, simply download this repo as a zip file, extract, and place in your themes directory. In your Ghost backend, go to 'settings' and select the OpenWriter theme.
16 |
17 |
18 | ## Key features
19 |
20 | - Clean design with parallax scroll
21 | - Fully responsive design
22 | - Ready to use, no configuration needed
23 | - Support for all main ghost features - author pages, tag pages, etc.
24 | - Default cover image
25 | - Cover image size smaller on subsequent archive pages
26 | - Contact form pre-installed
27 | - Support for private blogs *NEW*
28 |
29 |
30 | ### Contact Form
31 |
32 | Thanks to [Formspree](http://formspree.io), I was able to include a free contact form. Because Ghost no longer allows themes to have direct access to your remail for security reasons, you will need to add your email address manually. To do this, follow these steps:
33 |
34 | 1. Find "contact.hbs" in the partials folder of the theme
35 | 2. Place your email address in the specified section on line 2
36 | 3. Save the file and activate OpenWriter as your theme
37 | 4. Create a new post
38 | 5. Title the post 'Contact' and make sure the post URL is also 'contact'
39 | 6. Under the settings, check the box that says "Turn this post into a static page"
40 | 7. Publish the page
41 | 8. Visit the Contact page and fill in the form once to activate it with Formspree
42 |
43 |
44 |
45 | ### Cover Images
46 |
47 | Each page features a cover image. This is determined by the following hierarchy:
48 |
49 | 1. The individual page's cover image
50 | 2. The blog's cover image
51 | 3. The default cover image bundled with the theme
52 |
53 | Special thanks to [The Stocks](http://thestocks.im/) for providing the default cover image under the Creative Commons Zero licence.
54 |
55 |
56 |
57 |
--------------------------------------------------------------------------------
/assets/css/style.css:
--------------------------------------------------------------------------------
1 | @import url(http://fonts.googleapis.com/css?family=PT+Mono);@import url(http://fonts.googleapis.com/css?family=Libre+Baskerville:700,400italic,400);html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}#hidden-nav{z-index:3}main{z-index:2}html{font-size:62.5%}body,input,textarea{font-family:"Libre Baskerville",serif;font-size:14px;font-size:1.4rem;line-height:1.8;font-weight:400;color:#505050}h1{font-family:"Libre Baskerville",serif;font-size:30px;font-size:3rem;color:#fafafa}h2{font-size:22px;font-size:2.2rem}h2 a{text-decoration:none}h3{font-size:14px;font-size:1.4rem;font-weight:700;color:#c8c8c8}label{font-style:italic}a{color:inherit;font-weight:700;text-decoration:none;transition:color 0.6s}a:hover{color:#710109}nav a{text-decoration:none}.btn,input[type="submit"],.homepage-links li a{font-family:"Libre Baskerville",serif;font-size:12px;font-size:1.2rem}small{font-size:12px;font-size:1.2rem}blockquote{font-size:2rem}.regular nav{font-size:12px;font-size:1.2rem}.regular nav .fa{font-size:18px;font-size:1.8rem}pre,code{font-family:"PT Mono",monospace}.btn,input[type="submit"],.homepage-links li a{width:16rem;min-height:3.5rem;margin:1rem 0;padding:0.4rem;text-align:center;border:3px solid #710109;border-radius:20px;display:inline-block;transition:background-color 0.6s, color 0.6s}.btn:hover,input[type="submit"]:hover,.homepage-links li a:hover,.btn:focus,input[type="submit"]:focus,.homepage-links li a:focus{background-color:#710109;color:#fafafa}.pagination{margin-top:1rem}.pagination .page-number{margin:0 1rem}span.error-message{padding-bottom:1rem;display:block}body main,body footer{top:50vh;position:relative}body.error-template main,body.error-template footer,body.author-template main,body.author-template footer,body.home-template main,body.home-template footer,body.private-template main,body.private-template footer{top:0}header.regular{position:fixed;top:0;left:0;background-size:cover;background-position:center;width:100%;height:50vh}header.regular nav{color:#fafafa}.title-container{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:75%;text-align:center}.regular nav{position:absolute;top:0;left:0;width:100%;height:50px;padding:0 7%;line-height:50px}.regular nav:after{content:"";display:table;clear:both}.brand{float:left}.brand img{height:35px;width:auto;margin-top:7px}ul.navigation{float:right}@media screen and (min-width: 600px){ul.navigation li{display:inline-block;padding:0 5px;margin:0 5px}ul.navigation li#show-nav{display:none}}@media screen and (max-width: 600px){ul.navigation li{display:none}ul.navigation li#show-nav{display:inline-block}}#hidden-nav{top:-50vh;position:fixed;width:100%;height:50vh;background-color:#c8c8c8;text-align:center;padding:20px}#hidden-nav ul{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:85%}#hidden-nav li{display:block;padding:1rem;border-bottom:1px solid #fafafa}#hidden-nav li a{text-decoration:none}#hidden-nav li:last-child{border-bottom:none}p{margin-bottom:1.5rem}blockquote{margin-bottom:1.5rem;border-left:5px solid #c8c8c8;padding:1rem;quotes:"“" "”" "‘" "’"}blockquote p{margin-bottom:0}blockquote:before{content:open-quote;float:left;padding-right:1rem;font-size:5rem;line-height:1;color:#c8c8c8}pre,code{background-color:#fff}code{padding:0 5px}pre{padding:10px;margin-bottom:1.5rem}.post-content h1,.post-content h2,.post-content h3{margin:2.5rem 0 1.5rem}.post-content ul{list-style-type:disc}.post-content ul,.post-content ol{display:block;width:100%;padding-left:10%;margin-bottom:1.5rem}.post-content img{max-width:100%;height:auto;margin:0 auto}.post-excerpt{padding:2rem 0;border-top:1px solid #c8c8c8}.post-excerpt:after{content:"";display:table;clear:both}.post-excerpt hgroup{padding-bottom:2rem}.post-excerpt .read-more{float:right}.post-excerpt:first-child{border-top:none}.pagination{width:100%;text-align:center;margin-bottom:20px}textarea,input,input[type="text"],input[type="button"],input[type="submit"]{-webkit-appearance:none;-moz-appearance:none;border-radius:0}input,textarea{margin:0.3rem auto 1rem;padding:5px;text-align:center;border:3px solid #c8c8c8;width:85%;max-width:400px;outline:none}input:focus,textarea:focus{border:3px solid #710109}input{height:3.5rem}input[type="submit"]{border-radius:20px;background-color:#fafafa;cursor:pointer}label,input,textarea{display:block}#contactform{text-align:center;margin-top:3rem}html,body{background-color:#fafafa}main{width:100%;padding:3rem 7% 2rem;margin:0 auto;background-color:#fafafa;position:relative}.post-content,.post-excerpt{max-width:960px;margin-left:auto;margin-right:auto}footer{height:70px;border-top:1px solid #c8c8c8;text-align:center;padding:20px;position:relative;background-color:#fff}#homepage-hero{background-size:cover;background-position:center;width:100%;height:100vh;position:relative;color:#fafafa}#homepage-hero .btn,#homepage-hero input[type="submit"],#homepage-hero .homepage-links li a,.homepage-links li #homepage-hero a{margin:1rem}.blog-description{margin:2rem auto}.homepage-links li{display:inline-block}.homepage-links li a{display:inline-block}body.post-template .post-excerpt .author{display:none}.post-meta,.tags{color:#fafafa}.tags{margin-top:1.5rem}.post-footer{margin-top:3rem;padding-top:2rem;padding-bottom:3rem;text-align:center}.post-footer .share .fa{width:30px;height:30px;background-color:#c8c8c8;color:#fafafa;border-radius:50%;text-align:center;padding:8px;margin:5px 0 0 5px;transition:background-color 0.6s}.post-footer .share .fa:hover{background-color:#710109}.more-post{border-top:1px solid #c8c8c8;text-align:left}
2 |
--------------------------------------------------------------------------------
/assets/images/cover.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/ireade/openwriter/7aebf7e3fe3af3c4f34ffdc4e167b4dd0786d1ff/assets/images/cover.jpg
--------------------------------------------------------------------------------
/assets/js/script.js:
--------------------------------------------------------------------------------
1 | function parallax(){$(document).on("scroll",function(){var n=$(document).scrollTop(),o=-(n/2);$("header.regular").css("top",o),$("header.regular .title-container").css("opacity",1-n/300)})}$(document).ready(function(){parallax(),$("a#blog").on("click",function(){return $("html, body").animate({scrollTop:$("#home-latest-post").offset().top},1e3),!1}),$("#show-nav").on("click",function(){return $("#hidden-nav").animate({top:"0"},800),$("#hidden-nav").addClass("open"),!1}),$("#hide-nav").on("click",function(){return $("#hidden-nav").animate({top:"-50vh"},800),$("#hidden-nav").removeClass("open"),!1})});
--------------------------------------------------------------------------------
/author.hbs:
--------------------------------------------------------------------------------
1 | {{!< default}}
2 |
3 | {{#author}}
4 |
15 |