Skip to content

Commit

Permalink
refactor: vuepress-boilerplate-netlify-cms
Browse files Browse the repository at this point in the history
  • Loading branch information
DemoMacro committed Apr 30, 2022
1 parent b72abe4 commit 561c712
Show file tree
Hide file tree
Showing 6 changed files with 11,330 additions and 61 deletions.
131 changes: 128 additions & 3 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,130 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*

# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage
*.lcov

# nyc test coverage
.nyc_output

# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Bower dependency directory (https://bower.io/)
bower_components

# node-waf configuration
.lock-wscript

# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules/
.vuepress/dist/
package-lock.json
yarn.lock
jspm_packages/

# Snowpack dependency directory (https://snowpack.dev/)
web_modules/

# TypeScript cache
*.tsbuildinfo

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Optional stylelint cache
.stylelintcache

# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity

# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local

# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache

# Next.js build output
.next
out

# Nuxt.js build / generate output
.nuxt
dist

# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public

# vuepress build output
.vuepress/dist

# vuepress v2.x temp and cache directory
.temp
.cache

# Docusaurus cache and generated files
.docusaurus

# Serverless directories
.serverless/

# FuseBox cache
.fusebox/

# DynamoDB Local files
.dynamodb/

# TernJS port file
.tern-port

# Stores VSCode versions used for testing VSCode extensions
.vscode-test

# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
16 changes: 8 additions & 8 deletions .vuepress/public/admin/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@ backend:
name: git-gateway
branch: master # Branch to update (master by default)

media_folder: 'media' # Folder where user uploaded files should go
media_folder: "media" # Folder where user uploaded files should go

# This line should *not* be indented
publish_mode: editorial_workflow

collections:
- name: 'Post' # Used in routes, e.g., /admin/collections/blog
label: 'Post' # Used in the UI
folder: '/' # The path to the folder where the documents are stored
- name: "Post" # Used in routes, e.g., /admin/collections/blog
label: "Post" # Used in the UI
folder: "/" # The path to the folder where the documents are stored
create: true # Allow users to create new documents in this collection
slug: '{{slug}}' # Filename template, e.g., YYYY-MM-DD-title.md
slug: "{{slug}}" # Filename template, e.g., YYYY-MM-DD-title.md
fields: # The fields for each document, usually in front matter
- {label: 'Title', name: 'title', widget: 'string'}
- {label: 'Publish Date', name: 'date', widget: 'datetime'}
- {label: 'Body', name: 'body', widget: 'markdown'}
- { label: "Title", name: "title", widget: "string" }
- { label: "Publish Date", name: "date", widget: "datetime" }
- { label: "Body", name: "body", widget: "markdown" }
12 changes: 4 additions & 8 deletions .vuepress/public/admin/index.html
Original file line number Diff line number Diff line change
@@ -1,17 +1,13 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Content Manager</title>
</head>

<body>
<!-- Include the script that builds the page and powers Netlify CMS -->
<script
src="https://cdn.jsdelivr.net/npm/netlify-cms@2/dist/cms.js"
async
defer
></script>
<script src="https://cdn.jsdelivr.net/npm/netlify-cms@2/dist/netlify-cms.js"></script>
</body>
</html>
47 changes: 22 additions & 25 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,69 +2,66 @@
title: README
---

# VuePress-NetlifyCMS
# vuepress-boilerplate-netlify-cms

![GitHub](https://img.shields.io/github/license/DemoMacro/VuePress-NetlifyCMS)

> A vuepress site hosted with Netlify CMS.
> VuePress boilerplate integrated with Netlify CMS, powered by Demo Macro.
<!-- Markdown snippet -->

[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/DemoMacro/VuePress-NetlifyCMS/)
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/DemoMacro/vuepress-boilerplate-netlify-cms&stack=cms)

## Quick Start
## Manual start

Let's get started with VuePress-NetlifyCMS step by step.
### [Fork](https://github.com/DemoMacro/vuepress-boilerplate-netlify-cms/fork) on Github

### [Fork](https://github.com/DemoMacro/VuePress-NetlifyCMS/fork) on Github
More info: [VuePress Documentation](https://vuepress.vuejs.org/)

### [Deploy](https://app.netlify.com/start/deploy?repository=https://github.com/DemoMacro/VuePress-NetlifyCMS) to Netlify
### Deploy to Netlify

```
Build command: vuepress build
Publish directory: pages
```
More info: [Framework integrations](https://docs.netlify.com/integrations/frameworks/#vuepress)

## Enable Identity and Git Gateway
### Enable Identity and Git Gateway

Netlify's Identity and Git Gateway services allow you to manage CMS admin users for your site without requiring them to have an account with your Git host or commit access on your repo. From your site dashboard on Netlify:

1. Go to **Settings > Identity**, and select **Enable Identity service**.
2. Under **Registration preferences**, select **Open** or **Invite only**. In most cases, you want only invited users to access your CMS, but if you're just experimenting, you can leave it open for convenience.
3. If you'd like to allow one-click login with services like Google and GitHub, check the boxes next to the services you'd like to use, under **External providers**.
4. Scroll down to **Services > Git Gateway**, and click **Enable Git Gateway**. This authenticates with your Git host and generates an API access token. In this case, we're leaving the **Roles** field blank, which means any logged in user may access the CMS. For information on changing this, check the [Netlify Identity documentation](https://www.netlify.com/docs/identity/).
4. Scroll down to **Services > Git Gateway**, and click **Enable Git Gateway**. This authenticates with your Git host and generates an API access token. In this case, we're leaving the **Roles** field blank, which means any logged in user may access the CMS.

More info: [Git Gateway](https://docs.netlify.com/visitor-access/git-gateway/)

### Add the Netlify Identity Widget

You'll need to add this to the `<head>` of your CMS index page at /admin/index.html, as well as the `<head>` of your site's main index page.We could include the script in your site using Netlify's Script Injection feature;
You will need to add it to the `<head>` of your CMS index page at /admin/index.html and to the `<head>` of the main index page of your website. We can use Netlify's script injection feature to include this script in your website.

```html
<!-- Include the script that enables Netlify Identity on this page. -->
<script
src="https://cdn.jsdelivr.net/npm/netlify-identity-widget@1/build/netlify-identity-widget.min.js"
async
defer
></script>
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
```

Add the following script before the closing body tag of your site's main index page using Netlify's Script Injection feature.
Using Netlify's script injection feature, add the following script to the main index page of your website before the close body tag.

```html
<script>
if (window.netlifyIdentity) {
window.netlifyIdentity.on('init', (user) => {
window.netlifyIdentity.on("init", (user) => {
if (!user) {
window.netlifyIdentity.on('login', () => {
document.location.href = '/admin/';
window.netlifyIdentity.on("login", () => {
document.location.href = "/admin/";
});
}
});
}
</script>
```

> Now you can control site content in https://yoursite.netlify.com/admin/
### Congratulations

You can now manage the content of your website at https://yoursite.netlify.com/admin/.

## License

This Project is under the [MIT License](LICENSE).
[MIT](LICENSE) &copy; [Demo Macro](https://github.com/DemoMacro)
40 changes: 23 additions & 17 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,27 +1,33 @@
{
"name": "vuepress-netlifycms",
"name": "vuepress-boilerplate-netlify-cms",
"version": "0.0.0",
"description": "VuePress boilerplate integrated with Netlify CMS, powered by Demo Macro.",
"private": true,
"licenses": [
{
"type": "MIT",
"url": "https://spdx.org/licenses/MIT.html"
},
{
"type": "CC-BY-NC-SA-4.0",
"url": "https://spdx.org/licenses/CC-BY-NC-SA-4.0.html"
}
],
"scripts": {
"dev": "vuepress dev",
"build": "vuepress build"
},
"devDependencies": {
"vuepress": "^1.5.2"
"repository": {
"type": "git",
"url": "git+https://github.com/DemoMacro/vuepress-boilerplate-netlify-cms.git"
},
"keywords": [
"vuepress",
"boilerplate",
"netlify",
"netlify-cms"
],
"author": {
"name": "Demo Macro",
"email": "abc@imst.xyz",
"url": "https://imst.xyz/"
},
"license": "MIT",
"bugs": {
"url": "https://github.com/DemoMacro/vuepress-boilerplate-netlify-cms/issues"
},
"prettier": {
"singleQuote": true,
"bracketSpacing": false,
"trailingComma": "none"
"homepage": "https://github.com/DemoMacro/vuepress-boilerplate-netlify-cms#readme",
"devDependencies": {
"vuepress": "^1.9.7"
}
}
Loading

0 comments on commit 561c712

Please sign in to comment.