Ghosts default theme Casper for Vuepress.
Install the npm package:
$ npm i vuepress-theme-casper --save
# or
$ yarn add vuepress-theme-casper
Adapt your vuepress config config.js
:
module.exports = {
title: 'Theme Title',
description: 'Theme description',
base: '/',
theme: 'casper',
head: [
['link', { rel: 'icon', href: '/favicon.png' }]
],
markdown: {
anchor: {
permalink: false,
permalinkBefore: false
}
},
themeConfig: {
cover: '/images/cover.jpg',
logo: '/images/logo.png',
nav: [{
text: 'Home',
link: '/'
}, {
text: 'Posts',
link: '/posts'
}, {
text: 'Category',
link: '/category/some-category'
}, {
text: 'Page',
link: '/a-page.html'
}],
footer: [{
text: 'Latest Posts',
link: '/posts'
}, {
text: 'Facebook',
link: 'https://facebook.com/'
}, {
text: 'Twitter',
link: 'https://twitter.com'
}, {
text: 'Github',
link: 'https://github.com/'
}],
social: {
github: 'https://github.com',
twitter: 'https://twitter.com',
facebook: 'https://facebook.com',
xing: 'https://xing.de',
instagram: 'https://instagram.com',
linkedin: 'https://linkedin.com'
}
}
}
The following parameters are available:
---
title: And when we woke up, we had these bodies.
image: https://picsum.photos/1920/1080/?random&date=2018-04-15
publish: 2018-04-15
type: post|page
tags:
- toe-tappingly tragic
- thanks to the Internet
categories:
- portfolios
readingTime: 10 Minutes
---
The post intro uses the <!-- more -->
tag.
- For simplicity this theme doesn't support multiple authors
Planty is an e-commerce ready custom theme for Stackbit created by Snipcart.
This theme can be used to create an e-commerce ready website through Stackbit's platform. You'll get everything you need from products listing, categorization, FAQ, etc.
You can see it in action right here.
To learn more about Stackbit and its custom themes feature, read this post.
In Stackbit's custom themes importer, just use this repository URL. For the moment, this theme works only with Jekyll but will soon work with other static site generators supported by Stackbit.
Please note that the screenshots below have been taken in Forestry, you can use Forestry as headless CMS for your project if you want, but this also work with other CMSs.
First thing is to enter your Snipcart API key. Open your CMS and go to Global site config
.
Use your public API key in there.
Logos can be updated via the CMS as well. You'll be asked to provide a dark and a light logo.
Colors can be managed via the CMS as well. Under Global site config
section, open Styles config
. You'll see all colors used throughout the theme listed here. Adjust them for your own branding.
You can also configure background images in there.
Each product can be associated to a category. Open the Categories section and manage them there.
Products can be managed directly through the CMS via the Products section.
Products have several properties available, both for Snipcart and for the theme. You can define its price, description, name, ID, etc.
You can also define if this is a featured product, meaning that it will show in the Best sellers section on the site. A feature product will use the Feature images set.
The promotion is a component displayed just above the footer on some pages. You can configure what to show in that box via the CMS.
You can define a Call to action for the promotion, it's usually a link to a section of your site.
You can manage testimonials to show on the site via this section.
Manage the content of the About section here.
Manage your FAQ entries in this section.