docs: add NextJS example and template (#4178)
This commit is contained in:
committed by
GitHub
parent
4b487870c6
commit
f43c8d8648
@ -2,7 +2,6 @@
|
||||
title: Examples
|
||||
group: contributing
|
||||
weight: 110
|
||||
|
||||
---
|
||||
|
||||
Do you have a great, open source example? Submit a pull request to this page!
|
||||
@ -28,3 +27,4 @@ Example | Tools | Type | Source | More info |
|
||||
[Next.js demo](https://netlifycms-nextjs.netlify.com) | Next.js | blog | [masives/netlifycms-nextjs](https://github.com/masives/netlifycms-nextjs) | [read me](https://github.com/masives/netlifycms-nextjs)
|
||||
[Delog - JAMStack Blog with Netlify CMS](https://delog-w3layouts.netlify.com/) | Gatsby, Netlify-CMS | demo | [W3Layouts/gatsby-starter-delog](https://github.com/W3Layouts/gatsby-starter-delog) | [blog post](https://w3layouts.com/articles/delog-gatsby-starter-netlify-cms/)
|
||||
[Netlify CMS template for Gridsome](https://netlifycms-gridsome.suits.at/) | Gridsome, Vue | demo | [suits-at/netlifycms-gridsome](https://github.com/suits-at/netlifycms-gridsome) | [read me](https://github.com/suits-at/netlifycms-gridsome)
|
||||
[Next.js blogging template for Netlify](https://nextjs-netlify-blog-template.netlify.app/) | Next.js, Netlify | blog | [wutali/nextjs-netlify-blog-template](https://github.com/wutali/nextjs-netlify-blog-template) | [read me](https://github.com/wutali/nextjs-netlify-blog-template)
|
||||
|
@ -5,35 +5,42 @@ weight: 10
|
||||
---
|
||||
You can add Netlify CMS [to an existing site](/docs/add-to-your-site/), but the quickest way to get started is with a template. Found below, our featured templates deploy a bare-bones site and Netlify CMS to Netlify ([what's the difference, you ask?](../intro/#netlify-cms-vs-netlify)), giving you a fully working CMS-enabled site with just a few clicks.
|
||||
|
||||
<div style="display: flex; justify-content: space-around; text-align: center; margin-bottom: 1.5em;">
|
||||
<div style="flex-basis: 25%">
|
||||
<div style="display: flex; justify-content: left; text-align: center; margin-bottom: 1.5em; flex-wrap: wrap;"stack=cms>
|
||||
<div style="flex-basis: 33%">
|
||||
<div style="padding: 0 15%; height: 100px; display: flex; justify-content: center;">
|
||||
<img style="display: flex" src="/img/hugo.svg"/>
|
||||
</div>
|
||||
<h4>Hugo Site Starter</h4>
|
||||
<p><a href="https://app.netlify.com/start/deploy?repository=https://github.com/netlify-templates/one-click-hugo-cms&stack=cms"><img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" /></a></p>
|
||||
</div>
|
||||
<div style="flex-basis: 25%">
|
||||
<div style="flex-basis: 33%">
|
||||
<div style="padding: 0 30%; height: 100px; display: flex; justify-content: center;">
|
||||
<img style="display: flex" src="/img/gatsby.svg"/>
|
||||
</div>
|
||||
<h4>Gatsby Site Starter</h4>
|
||||
<p><a href="https://app.netlify.com/start/deploy?repository=https://github.com/AustinGreen/gatsby-starter-netlify-cms&stack=cms"><img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" /></a></p>
|
||||
</div>
|
||||
<div style="flex-basis: 25%">
|
||||
<div style="flex-basis: 33%">
|
||||
<div style="padding: 0 30%; height: 100px; display: flex; justify-content: center;">
|
||||
<img style="display: flex" src="/img/middleman.svg"/>
|
||||
</div>
|
||||
<h4>Middleman Site Starter</h4>
|
||||
<p><a href="https://app.netlify.com/start/deploy?repository=https://github.com/tomrutgers/middleman-starter-netlify-cms&stack=cms"><img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" /></a></p>
|
||||
</div>
|
||||
<div style="flex-basis: 25%">
|
||||
<div style="flex-basis: 33%">
|
||||
<div style="padding: 0 30%; height: 100px; display: flex; justify-content: center;">
|
||||
<img style="display: flex" src="/img/preact.svg"/>
|
||||
</div>
|
||||
<h4>Preact CLI</h4>
|
||||
<p><a href="https://app.netlify.com/start/deploy?repository=https://github.com/preactjs/preact-netlify&stack=cms"><img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" /></a></p>
|
||||
</div>
|
||||
<div style="flex-basis: 33%">
|
||||
<div style="padding: 0 30%; height: 100px; display: flex; justify-content: center;">
|
||||
<img style="display: flex" src="/img/nextjs.svg"/>
|
||||
</div>
|
||||
<h4>Next.js Blog Template</h4>
|
||||
<p><a href="https://app.netlify.com/start/deploy?repository=https://github.com/wutali/nextjs-netlify-blog-template&stack=cms"><img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" /></a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
After clicking one of those buttons, authenticate with GitHub or GitLab and choose a repository name. Netlify then automatically creates a clone of the repository in your GitHub or GitLab account. Next, it builds and deploys the new site on Netlify, bringing you to the site dashboard after completing the build.
|
||||
|
Reference in New Issue
Block a user