Prometheus

<img src='./logo.png'> <img src="https://img.shields.io/github/downloads/halfrost/Prometheus/total?label=Theme%20downloads&color=brightgreen"> <img src="https://img.shields.io/badge/build-passing-brightgreen.svg"> <img src="https://img.shields.io/badge/Language-%20JavaScript | CSS%20-f9e229.svg"> <img src="https://img.shields.io/badge/Framework-Ghost | node.js%20-0eb984.svg"> <img src="https://img.shields.io/badge/node->v8.9.0-b561fe.svg"> <img src="https://img.shields.io/badge/npm->v5.5.1-000000.svg"> <img src="https://img.shields.io/badge/Ghost--CLI->1.13.0-orange.svg"> <img src="https://img.shields.io/badge/Ghost--Version->3.0.0-80d4f9.svg"> <img src="https://img.shields.io/badge/platform-%20iOS | Android | Mac | Web%20-ff69b4.svg"> <img src="https://visitor-badge.laobi.icu/badge?page_id=halfrost.Prometheus"> <a href="https://github.com/halfrost/Prometheus/blob/master/LICENSE"><img alt="GitHub" src="https://img.shields.io/github/license/halfrost/Prometheus?label=License"></a> <a href="https://halfrost.com"><img src="https://img.shields.io/badge/Blog-Halfrost--Field-80d4f9.svg?style=flat"></a> <a href="http://weibo.com/halfrost"><img src="https://img.shields.io/badge/weibo-@halfrost-f974ce.svg?style=flat&colorA=f4292e"></a> <a href="https://twitter.com/halffrost"><img src="https://img.shields.io/badge/twitter-@halffrost-F8E81C.svg?style=flat&colorA=009df2"></a> <a href="https://www.zhihu.com/people/halfrost/activities"><img src="https://img.shields.io/badge/%E7%9F%A5%E4%B9%8E-@halfrost-fd6f32.svg?style=flat&colorA=0083ea"></a> <img src="https://img.shields.io/badge/made%20with-%3C3-red.svg"> <a href="https://github.com/halfrost/Prometheus/pulls"><img src="https://img.shields.io/badge/PR-Welcome-brightgreen.svg"></a>

Prometheus Ghost theme is clean and very modern. The design is highly focused on typography. But there is also the perfect combination of image and white space in this design. This theme is perfect for a personal and professional blog. Also, the theme will fit in with perfectly with any fashion blog, food blog, movie blog, music blog or any other you can imagine. You could use this theme for an online magazine or journal also.

Installing and customizing this theme is very easy. All required information is provided in the documentation.

Live Demo is here.

First tell a story

In Greek mythology, Prometheus (/prəˈmiːθiəs/; Ancient Greek: Προμηθεύς, [promɛːtʰéu̯s], possibly meaning "forethought") is a Titan, culture hero, and trickster figure who is credited with the creation of humanity from clay, and who defies the gods by stealing fire and giving it to humanity as civilization. Prometheus is known for his intelligence and as a champion of humankind and also seen as the author of the human arts and sciences generally. He is sometimes presented as the father of Deucalion, the hero of the flood story.

The punishment of Prometheus as a consequence of the theft of fire is a popular subject of both ancient and modern culture. Zeus, king of the Olympian gods, sentenced the Titan to eternal torment for his transgression. The immortal was bound to a rock, where each day an eagle, the emblem of Zeus, was sent to eat Prometheus' liver, which would then grow back overnight to be eaten again the next day (in ancient Greece, the liver was often thought to be the seat of human emotions). Prometheus was eventually freed by the hero Heracles.

In another myth, Prometheus establishes the form of animal sacrifice practiced in ancient Greek religion.

Evidence of a cult to Prometheus himself is not widespread. He was a focus of religious activity mainly at Athens, where he was linked to Athena and Hephaestus, other Greek deities of creative skills and technology.

In the Western classical tradition, Prometheus became a figure who represented human striving, particularly the quest for scientific knowledge, and the risk of overreaching or unintended consequences. In particular, he was regarded in the Romantic era as embodying the lone genius whose efforts to improve human existence could also result in tragedy: Mary Shelley, for instance, gave The Modern Prometheus as the subtitle to her novel Frankenstein (1818).

Why is this name?

Because of Prometheus above experience, Prometheus is also the symbol of forethought, diligent and courageous. I hope who use this ghost theme would bring his website wisdom.

Theme General features

Ready for latest version of Ghost 3.0 and above.
Fully support new membership and subscription feature.
User select-able light and dark mode.
Fully support Progressive Web Apps.
Clean and clutter free modern design.
Minimal, highly content focused, reader friendly and eye soothing.
100% responsive, looks nice in any size of device.
supports image logo.
Previous and next post link in single post view.
Fully supports ghost Koenig Editor.
Supports inbuilt navigation system.
Blog Cover and blog description.
Tag image and tag description.
Author cover image, avatar, bio and social links.
Multi author support.
search functionality.
Responsive youtube, vimeo, soundcloud, mixcloud.
Beautiful Code Highlight.
Static pages.
Custom author archive page template.
Custom tag archive page template.
Custom subscribe page.
Custom error page.
Custom AMP template
Cross-Browser Compatibility.
Comment with disqus.
Post sharing.
Ghost subscription.
Contact form using formspree
Google font.
SVG icons.
Well commented and well structured coding.
Development files included. Easy to customize.
Developer friendly. Built with gulp and SASS.

Supports inbuilt Ghost features

Translation ready English and Polish included.
Members & subscriptions.
Publication title and description.
Publication logo and cover.
Post, page, tag and author page.
Author cover, avatar, bio, location, website and social accounts.
Tag cover and description.
Primary tag in post-cards.
Multiple authors.
Koenig editor.
Markdown card.
Bookmark card.
Gallery card.
Image card with normal, wide and full width.
Secondary navigation.
Featured post and page.
Reading time.
Next and previous post navigation.
Social accounts.
Content API v3.

Members & subscriptions

Custom membership page.
Custom account page for member.
Custom account page for paid-member.
Custom sign-in page.
Custom sign-up page.
Custom newsletter page.
Custom Call-to-Action in post for member.
Custom Call-to-Action in post for paid-member.
Pricing tables: Free, Monthly, Yearly.
Pricing tables in custom account and membership page.
6 colors for Call-to-Action.
Sign-in, sign-up, subscribe and checkout notifications.
Account details.
Cancel & continue subscription button.
Members and Paid-members labels in post-cards.
Option to edit billing info.
Custom currency USD, AUD, CAD, EUR, GBP, INR.

Comprehensive picture optimization

Most of my pictures are on the CDN of Qiuniu, which has sponsored my blog for several years. I would like to thank you again. Images have always been the main part of network requests. This time, several processings have been done on image loading.

1. The main pictures are `lazyload:g`

Delayed loading, loading only when sliding to the visible area, Ghost is not convenient to change the Markdown rendering engine, but you can write html directly when editing, and you need to write the code directly in the editor.

<!-- Set the alt value to cover or full-img to control the initial thumbnail of the article and whether it fills the screen -->
<img data-url="https://img.halfrost.com/blog/2015/12/book.jpg" class="lazy cover" alt="cover">

2. WebP picture and resolution adaptation

According to whether the device browser supports WebP and whether it is a mobile phone, using the graphics processing interface of the cloud to load pictures in different formats and resolutions, the size of the pictures is greatly optimized.

/*Use js to determine whether the browser supports webP format images*/
webPCheck: function(feature, callback) {
        var TestImages = {
            demo: "UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAsAAAABBxAREYiI/gcAAABWUDggGAAAADABAJ0BKgEAAQABABwlpAADcAD+/gbQAA=="
        };
        var img = new Image();
        img.onload = function() {
            var result = (img.width > 0) && (img.height > 0);
            console.log('支持Webp');
            ImageSmartLoader.isWebPSupported = true;
            ImageSmartLoader.webPLoader();
        };
        img.onerror = function() {
            ImageSmartLoader.isWebPSupported = false;
            ImageSmartLoader.webPLoader();
        };
        img.src = "data:image/webp;base64," + TestImages['demo'];
},


/*Call different by passing parameters lazyload*/
$(".lazy").lazyload({
    advanced_load: true,
    data_attribute: 'url',
    webP_load: true,
    is_scale: true,
    scale_width: 750
});

/*Reassemble the lazyload url, and call different pictures with the cloud interface*/
if (settings.advanced_load == true) {
    updatedUrl += '!';
}
if (settings.is_scale == true) {
    updatedUrl += '/fw/' + settings.scale_width;
}
if (settings.webP_load == true) {
    updatedUrl += '/format/webp';
}

3. Advanced optimization Iconfont - TODO #9

This time I re-use [

Prometheus

Install / Use

README

Prometheus

First tell a story

Why is this name?

Theme General features

Supports inbuilt Ghost features

Members & subscriptions

Comprehensive picture optimization

1. The main pictures are `lazyload:g`

2. WebP picture and resolution adaptation

3. Advanced optimization Iconfont - TODO #9

Prometheus

Install / Use

README

Prometheus

First tell a story

Why is this name?

Theme General features

Supports inbuilt Ghost features

Members & subscriptions

Comprehensive picture optimization

1. The main pictures are lazyload:g

2. WebP picture and resolution adaptation

3. Advanced optimization Iconfont - TODO #9

1. The main pictures are `lazyload:g`