Skip to content

Commit

Permalink
Merge pull request #59 from MrBoolean/master
Browse files Browse the repository at this point in the history 
Enable disqus support and hide the articleImage tag if it is present
  • Loading branch information
@starburst1977
starburst1977 committed Aug 21, 2014
2 parents 7789d3d + 59756d0 commit 9e15d79
Show file tree
Hide file tree
Showing 8 changed files with 79 additions and 65 deletions.
10 changes: 6 additions & 4 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
# Readium 2.0

# Readium 2.0.0
**The Medium-like theme for [Ghost](https://github.com/TryGhost)**. Reduced to the core design of Medium (without the cluttered
stuff, like the sidebar) to bring you a similar user experience
while giving you the freedom to host it on your own servers and on your own terms.
Expand Down Expand Up @@ -35,8 +34,11 @@ If you give your images an alt text, it gets added automatically as figcaption b
- Free & Open Source Font usage
- Theoretically ready for multiple users (here is how to [hack Ghost for Mulit-User](http://lifewiththemacks.com/multi-user-support/))

### Comments
To enable the disqus support open the file partials/comment-list.hbs and follow the instruction.

#### If your Ghost blog is self hosted:
1. Copy the contents of the .zip file into /content/themes/.
1. Copy the contents of the .zip file into /content/themes/.
2. You need to restart your Ghost instance. After that you can switch themes inside your Ghost admin (http://your.domain.com/ghost/settings/general/). Scroll down and choose "Readium" from the theme dropdown.
3. Now you can customize your logo, langing page image (if you choose to have one), as well as user images and texts to fit the theme.
4. Have fun.
Expand All @@ -51,4 +53,4 @@ If you give your images an alt text, it gets added automatically as figcaption b
- Highlight JS by Ivan Sagalaev
- @mr_boolean, @riplexus & @unverbraucht for helping with JS
- The awesome guys that make Ghost
- The really rad guys that design Medium
- The really rad guys that design Medium
4 changes: 4 additions & 0 deletions assets/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -647,3 +647,7 @@ body {
border-radius: 999em;
line-height: 44px;
padding: 0 18px; }
#disqus_thread {
margin-top: 50px; }
.post-tag-articleimage {
display: none; }
15 changes: 6 additions & 9 deletions assets/css/main.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ body
-webkit-font-feature-settings: "liga", "dlig"
-o-font-feature-settings: "liga", "dlig"
font-feature-settings: "liga", "dlig"

.logo-readium
position: fixed
left: 10px
Expand Down Expand Up @@ -570,7 +570,7 @@ body
display: none
&:hover
color: #333

.bottom-closer
width: 100%
position: relative
Expand Down Expand Up @@ -634,10 +634,7 @@ body
line-height: 44px
padding: 0 18px








#disqus_thread
margin-top: 50px
.post-tag-articleimage
display: none
24 changes: 12 additions & 12 deletions index.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,31 +30,31 @@
<script>
(function ($) {
"use strict";
$(document).ready(function(){
var $window = $(window),
$image = $('.teaserimage-image');
$window.on('scroll', function() {
var top = $window.scrollTop();
if (top < 0 || top > 1500) { return; }
$image
.css('transform', 'translate3d(0px, '+top/3+'px, 0px)')
.css('opacity', 1-Math.max(top/700, 0));
});
$window.trigger('scroll');
});
}(jQuery));
</script>

{{! The main content area on the homepage }}
<main class="content" role="main">

<h5 class="index-headline featured"><span>Featured</span></h5>

<div class="container featured">
{{#foreach posts}}
{{#if featured}}
Expand All @@ -66,16 +66,16 @@
<section class="post-excerpt" itemprop="description">
<p>{{excerpt characters="130"}}&hellip;</p>
</section>
<div class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> <span class="post-tags-set">{{tags prefix="on "}}</span></div>
<div class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> <span class="post-tags-set">on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}</span></div>
</div>
</article>
{{/if}}
{{/foreach}}
</div>


<h5 class="index-headline normal"><span>Regular</span></h5>

<div class="cf frame">
{{#foreach posts}}
{{#if featured}}
Expand All @@ -88,7 +88,7 @@
<section class="post-excerpt" itemprop="description">
<p>{{excerpt characters="130"}}&hellip;</p>
</section>
<div class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> <span class="post-tags-set">{{tags prefix="on "}}</span></div>
<div class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> <span class="post-tags-set">on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}</span></div>
</div>
</article>
{{/if}}
Expand Down
10 changes: 5 additions & 5 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name" : "Readium",
"version" : "2.0.0",
"description" : "Just a medium-like blogging platform.",
"author" : "Sven Read",
"homepage" : "http://www.svenread.com/readium"
"name": "Readium",
"version": "2.0.0",
"description": "Just a medium-like blogging platform.",
"author": "Sven Read",
"homepage": "http://www.svenread.com/readium"
}
8 changes: 3 additions & 5 deletions page.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,7 @@
<div class="cf post-meta-text">
<div class="author-image" style="background-image: url({{author.image}})">Blog Logo</div>
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{author.name}}</h4> on
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>
{{tags prefix=", tagged on " separator=", "}}
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>, tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}
</div>
<center><a href="#topofpage" class="topofpage"><i class="fa fa-angle-down"></i></a></center>
</div>
Expand Down Expand Up @@ -60,7 +59,7 @@
var height = $('.article-image').height();
$('.post-content').css('padding-top', height + 'px');
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
Expand Down Expand Up @@ -91,8 +90,7 @@
<div class="cf post-meta-text">
<div class="author-image" style="background-image: url({{author.image}})">Blog Logo</div>
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{author.name}}</h4> on
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>
{{tags prefix=", tagged on " separator=", "}}
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>, tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}
</div>
</div>
</div>
Expand Down
18 changes: 18 additions & 0 deletions partials/comment-list.hbs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{{!--
By default the comment-list is disabled. To enable this feature just remove
line 6 and line 18. It is also required to update the
variable "disqus_shortname".
--}}
{{!--
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = 'readium'; // required: replace example with your forum shortname
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
--}}
55 changes: 25 additions & 30 deletions post.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,61 +6,60 @@
<main class="content" role="main">

<article class="{{post_class}}">

{{! Everything inside the #post tags pulls data from the post }}
{{#post}}

{{#has tag="articleImage"}}

<div class="article-image">
<div class="post-image-image">

Article Image

</div>
<div class="post-meta">
<h1 class="post-title">{{{title}}}</h1>
<div class="cf post-meta-text">
<div class="author-image" style="background-image: url({{author.image}})">Blog Logo</div>
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{author}}</h4> on
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>
{{tags prefix=", tagged on " separator=", "}}
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>, tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}
</div>
<center><a href="#topofpage" class="topofpage"><i class="fa fa-angle-down"></i></a></center>
</div>
</div>

<script>
(function ($) {
"use strict";
$(document).ready(function(){
$('.post-content').each(function() {
var $this = $(this),
img = $this.find('img:first'),
url = img.attr('src');
$(".post-image-image").css('background-image', 'url('+url+')');
img.remove();
});
var $window = $(window),
$image = $('.post-image-image');
$window.on('scroll', function() {
var top = $window.scrollTop();
if (top < 0 || top > 1500) { return; }
$image
.css('transform', 'translate3d(0px, '+top/3+'px, 0px)')
.css('opacity', 1-Math.max(top/700, 0));
});
$window.trigger('scroll');
var height = $('.article-image').height();
$('.post-content').css('padding-top', height + 'px');
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
Expand All @@ -75,33 +74,32 @@
}
});
});
});
}(jQuery));
</script>

{{! Each post has the blog logo at the top, with a link back to the home page }}

{{else}}

<div class="noarticleimage">
<div class="post-meta">
<h1 class="post-title">{{{title}}}</h1>
<div class="cf post-meta-text">
<div class="author-image" style="background-image: url({{author.image}})">Blog Logo</div>
<h4 class="author-name" itemprop="author" itemscope itemtype="http://schema.org/Person">{{author}}</h4> on
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>
{{tags prefix=", tagged on " separator=", "}}
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format='DD MMM YYYY'}}</time>, tagged on {{#foreach tags}}<span class="post-tag-{{slug}}">{{#if @first}}{{else}}, {{/if}}<a href="/tag/{{slug}}">{{name}}</a></span>{{/foreach}}
</div>
</div>
</div>
<br>
<br>
<br>

{{/has}}


<section class="post-content">
<div class="post-reading">
Expand All @@ -110,9 +108,7 @@
<a name="topofpage"></a>
{{content}}
</section>

<footer class="post-footer">

<section class="share">
<a class="icon-twitter" href="http://twitter.com/share?text={{encode title}}&url={{url absolute="true"}}"
onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
Expand All @@ -127,9 +123,8 @@
<span class="hidden">Google+</span>
</a>
</section>

</footer>

{{> comment-list}}
<div class="bottom-teaser cf">
<div class="isLeft">
<h5 class="index-headline featured"><span>Written by</span></h5>
Expand All @@ -149,7 +144,7 @@
<a class="subscribe" href="{{@blog.url}}/rss/"><span class="tooltip">You should subscribe to my RSS feed.</span></a>
<div class="inner">
<section class="copyright">All content copyright <a href="{{@blog.url}}/">{{@blog.title}}</a> &copy; {{date format="YYYY"}}<br>All rights reserved.</section>

</div>
</footer>
</div>
Expand Down

0 comments on commit 9e15d79

Please sign in to comment.