docs: update templates
This commit is contained in:
Daniel Lautzenheiser
@ -6,224 +6,38 @@ weight: 2
|
||||
|
||||
You can add Static 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 Static CMS to Netlify, giving you a fully working CMS-enabled site with just a few clicks.
|
||||
|
||||
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, minmax(0, 1fr))', gap: '24px' }}>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/hugo.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Hugo Site Starter</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-hugo-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/gatsby.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Gatsby Site Starter</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-gatsby-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/middleman.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Middleman Site Starter</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-middleman-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/preact.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Preact CLI</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-preact-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/nextjs.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Next.js Blog Template</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-nextjs-netlify-blog-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/11ty-logo.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Eleventy Starter</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-eleventy-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/nuxt.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Nuxt.js Boilerplate</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-nuxt-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: '8px',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '120px',
|
||||
height: '120px',
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<img style={{ display: 'flex', height: '100%' }} src="/img/metalsmith.svg" />
|
||||
</div>
|
||||
<h5 style={{ margin: 0 }}>Metalsmith Starter</h5>
|
||||
<p style={{ margin: 0 }}>
|
||||
<a href="https://app.netlify.com/start/deploy?repository=https://github.com/StaticJsCMS/static-cms-metalsmith-netlify-template&stack=cms">
|
||||
<img src="https://www.netlify.com/img/deploy/button.svg" alt="Deploy to Netlify" />
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<Templates>
|
||||
<Template
|
||||
title="Hugo Site Starter"
|
||||
image="/img/hugo.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-hugo-netlify-template"
|
||||
/>
|
||||
<Template
|
||||
title="Gatsby Site Starter"
|
||||
image="/img/gatsby.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-gatsby-netlify-template"
|
||||
/>
|
||||
<Template
|
||||
title="Preact CLI"
|
||||
image="/img/preact.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-preact-netlify-template"
|
||||
/>
|
||||
<Template
|
||||
title="Next.js Blog Template"
|
||||
image="/img/nextjs.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-next-netlify-template"
|
||||
/>
|
||||
<Template
|
||||
title="Eleventy Starter"
|
||||
image="/img/11ty-logo.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-eleventy-netlify-template"
|
||||
/>
|
||||
<Template
|
||||
title="Nuxt.js Boilerplate"
|
||||
image="/img/nuxt.svg"
|
||||
url="https://github.com/StaticJsCMS/static-cms-nuxt-netlify-template"
|
||||
/>
|
||||
</Templates>
|
||||
|
||||
After clicking one of those buttons, authenticate with GitHub and choose a repository name. Netlify then automatically creates a clone of the repository in your GitHub 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