Repository files navigation

Simple and Elegant theme forGhost.

Hello, I created this theme for Ghost with inspiration fromMedium.It is available for free so you can use on your site. It is strictly forbidden to use it for commercial use. If you have any suggestions to improve the theme, you can send me a tweet@GodoFredoNinja

You can see Simply in action on my PageDemo

• Responsive layout
• Blog navigation
• Page 404 (Multiple faces emoticons)
• Page subscribe
• Pagination Infinite Scroll
• Instagram Feed in footer of Post
• AMP Template (Accelerated Mobile Pages)
• Cover images for blog, tag and author
• links to followers in social media
• Related Articles (6 articles)
• Template Video Post Format
• Template Image post Format
• Template Audio post Format
• Template not Image Featured in Post
• YouTube Subscribe Button in video post Format
• 5 articles latest posts in the (Author - Tag) section sidebar
• Tags Cloud in page of Author and Tag
• Previous and next button in the Post
• Support for comments (Facebook or Disqus)
• Support for counter comments (Facebook or Disqus)
• Buttons to share the article (Facebook - Twitter - Reddit - Linkedin - Pinterest - Whatsapp)
• Counter shared articles on Facebook
• Sticky content in the sidebar
• YouTube, Vimeo, kickstarter, Facebook, dailymotion => Responsive
• Lazy image loading for better performance only in backgrounds
• Code syntaxPrismjs Supported all syntax.

Simply supports the following webbrowsers.

Enable all checkboxes on the labs page in your Ghost admin panel.

Add the Social Links only for the services you want to appear in the header section of your website. Pay attention as enabling too many services will cause menu problems.

This section enables the YouTube Post format. Add the Channel Name and Channel ID which can be found hereYouTube Advanced Settings

— Copy the below script toSettings -> Code Injection -> Blog Footer section

<script>/*====================================================  THEME SETTINGS & GLOBAL VARIABLES====================================================*//* 01. Social Media Follow*/varfollowSocialMedia={'google':'https://...','youtube':'https://...','instagram':'https://...','snapchat':'https://...','dribbble':'https://...','github':'https://...','linkedin':'https://...','spotify':'https://...','codepen':'https://...','behance':'https://...','flickr':'https://...','pinterest':'https://...','telegram':'https://...','feed':'https://...',};/* 0.2  Video Post Format Subscribe */varyoutubeChannelName='YOUR_CHANNEL_NAME';varyoutubeChannelID='YOUR_CHANNEL_ID';/* 03. Disqus Comment Settings */vardisqusShortName='YOUR_DISQUS_SHORTCUT_HERE';/* 04. Newsletter (optional) */varnewsletterTitle='YOUR_TITLE';varnewsletterDescription='YOUR_DESCRIPTION';/* 05. instgram */varinstagramToken='Token_app_instagram';varinstagramUserId='User_ID';varinstagramUserName='User_Name';</script><!-- Disqus Comments Count--><scriptid="dsq-count-scr"src="//YOUR_DISQUS_SHORTCUT_HERE.disqus.com/count.js"async></script>

To use facebook comments, skip the configuration Disqus.

This enables comments and comment counter

— Add the codeSettings -> Code Injection -> Blog Footer

<divid="fb-root"></div><script>(function(d,s,id){$('.simply-facebook').removeClass('u-hide');varjs,fjs=d.getElementsByTagName(s)[0];if(d.getElementById(id))return;js=d.createElement(s);js.id=id;js.async=true;js.src="//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8";fjs.parentNode.insertBefore(js,fjs);}(document,'script','facebook-jssdk'));</script>

Add you own custom content into the side bar by editing the./partials/sidebar.hbs file.

<divclass="sidebar-items u-marginBottom30"><h3class="sidebar-title u-fontSizeBase u-textColorDarker">.. your title ..</h3><pclass="u-textColorDarker u-fontSize15 u-marginBottom10">.. your description or content ..</p></div>

Add some more styling options to your articles text with these three styles.

Make your code stand out with the PrismJS code highlighter.PrismJS allows you to select which languge you embeded and performs code highlighting according to the language. Neat!

Take a look at thePrismjs Supported Language List

Image — The Featured image will become large in size.

Not Image — The featured image will not be displayed in the article (Post).

Video — The first video in the article will be large in size. Supports formats

• vimeo
• Dailymotion
• Facebook Video
• Youtube
• Vid
• kickstarter

Audio — The first Audio in the article will be large in size. Supports formats

• Soundcloud
• Mixcloud
• Spotify

Add video or Audio where convenient. When you change the theme you will not have problems and not have Problem in your AMP Template

To make your changes with your favorite colors you just have to add the following code and replace with your colorsThemes.

• Hodor AMP Template
• Normalize
• Jquery.ghostHunter
• Prismjs
• sticky-kit
• lunr.js
• zoom.js
• jquery-lazyload
• Fonts

Copyright (c) 2017 GodoFredoNinja - Released under theCC BY-NC 4.0.