gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update CDN docs

Browse Source
This commit is contained in:
Daniel Lautzenheiser 2022-12-22 12:28:51 -05:00
parent 9f70481064
commit 49bed27aa8
9 changed files with 36 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/docs/content/docs/add-to-your-site-cdn.mdx
View File

@ -49,7 +49,7 @@ In this example, we pull the `admin/index.html` file from a public CDN.
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
<script>
window.CMS.init();
</script>
@ -57,7 +57,7 @@ In this example, we pull the `admin/index.html` file from a public CDN.
</html>
```
In the code above the `script` is loaded from the `unpkg` CDN. Should there be any issue, `jsDelivr` can be used as an alternative source. Simply set the `src` to `https://cdn.jsdelivr.net/npm/@staticcms/core@%5E1.0.0/dist/static-cms-core.js`
In the code above the `script` is loaded from the `unpkg` CDN. Should there be any issue, `jsDelivr` can be used as an alternative source. Simply set the `src` to `https://cdn.jsdelivr.net/npm/@staticcms/app@%5E1.0.0/dist/static-cms-app.js`
## Configuration

2
packages/docs/content/docs/custom-previews.mdx
View File

@ -35,7 +35,7 @@ The following parameters will be passed to your `react_component` during render:
### Example
```html
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
<script>
const PostPreview = ({ widgetFor, getAsset, entry }) => {
const [imageUrl, setImageUrl] = useState('');

2
packages/docs/content/docs/custom-widgets.mdx
View File

@ -123,7 +123,7 @@ Register widget takes an optional object of options. These options include:
`admin/index.html`
```html
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
<script>
const CategoriesControl = ({ label, value, field, onChange }) => {
const separator = useMemo(() => field.separator ?? ', ', [field.separator]);

50
packages/docs/content/docs/docusaurus.mdx
View File

@ -26,23 +26,23 @@ cd my-website
npm run start
```
A browser window opens at `http://localhost:3000`.
A browser window opens at `http://localhost:3000`.
The development server now serves your website at `http://localhost:3000`. As you edit the source files in `/my-website/`, you can visit `http://localhost:3000` to preview your changes.
## Push your project to GitHub
Static CMS requires a [backend](/docs/backends-overview/) to store content. Static CMS supports using Git hosts, like GitHub or GitLab, as backends. This guide uses GitHub.
Static CMS requires a [backend](/docs/backends-overview/) to store content. Static CMS supports using Git hosts, like GitHub or GitLab, as backends. This guide uses GitHub.
```bash
# 1. Initialize your local Git repository.
# 1. Initialize your local Git repository.
git init
# 2. Rename your initial branch to match GitHub.
git branch -m main
# 3. Stage all your local files to your repository.
git add .
git add .
# 4. Commit your staged changes.
git commit -m 'Initial commit'
@ -56,7 +56,7 @@ Don't add a license or a .gitignore. Do add an "origin" git remote.
![](/img/create-remote-repo.webp)
```bash
# 6. Update your remote repository with your staged changes.
# 6. Update your remote repository with your staged changes.
git push -u origin main
```
@ -73,7 +73,7 @@ git push -u origin main
![](/img/create-remote-repo.webp)
Choose the default option for everything else.
Choose the default option for everything else.
Your website is now deployed. Netlify provides you with a randomly generated domain name. Run `netlify open --site` to view your deployed site.
@ -82,7 +82,7 @@ Your website is now deployed. Netlify provides you with a randomly generated dom
### Before you begin
1. Remove all existing posts from `/blog`.
```bash
```bash
rm -rf ./blog/*
```
2. Create a new blog post post titled `2021-11-15-first-blog-post.md`.
@ -130,22 +130,22 @@ Your website is now deployed. Netlify provides you with a randomly generated dom
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
</body>
</html>
```
`index.html` displays the Static CMS admin interface. You'll use the admin interface to edit your blog posts.
4. Edit `config.yml` to look like this:
4. Edit `config.yml` to look like this:
```yaml
backend:
name: github
branch: main
branch: main
repo: <your-github>/my-website
# These lines should *not* be indented
media_folder: "static/img" # Media files will be stored in the repo under static/images/uploads
public_folder: "/img/" # The src attribute for uploaded media will begin with /images/uploads
collections:
- name: blog
label: "blog"
@ -163,38 +163,38 @@ Your website is now deployed. Netlify provides you with a randomly generated dom
name: "tags"
widget: "list"
- label: "Authors"
name: "authors"
name: "authors"
widget: "list"
fields:
- { name: name, label: Name, widget: string }
- { name: title, label: Title, widget: string }
- { name: url, label: URL, widget: string }
- { name: imageUrl, label: ImageURL, widget: string }
- { name: title, label: Title, widget: string }
- { name: url, label: URL, widget: string }
- { name: imageUrl, label: ImageURL, widget: string }
```
`config.yml` specifies what kind of content your blog posts have. The content specification enables Static CMS to edit existing posts and create new ones with the same format. To learn more, read about Static CMS' [](/docs/configuration-options/)[Configuration options](/docs/configuration-options/).
5. Visit `localhost:3000/admin`
You can now view and edit `2021-11-15-first-blog-post.md` through the admin interface. You can also create new blog posts.
You can now view and edit `2021-11-15-first-blog-post.md` through the admin interface. You can also create new blog posts.
**Warning:** Any changes you publish through the admin interface will only effect your *remote GitHub repository*. To retrieve these changes locally, `git pull` from your local repository.
6. Commit and push your new changes to your remote repository.
6. Commit and push your new changes to your remote repository.
```bash
git add .
git add .
git commit -m "Add Static CMS"
git push
```
Netlify builds and deploys your new changes.
Netlify builds and deploys your new changes.
## Add GitHub as an authentication provider
Before you can access `/admin/` through your Netlify domain, you need to set up an authentication provider. The authentication provider allows Static CMS to determine whether users have read and write access to `/admin/`. This guide uses GitHub credentials for authentication.
Before you can access `/admin/` through your Netlify domain, you need to set up an authentication provider. The authentication provider allows Static CMS to determine whether users have read and write access to `/admin/`. This guide uses GitHub credentials for authentication.
### Configure GitHub
### Configure GitHub
1. Create a new [GitHub OAuth application](https://github.com/settings/applications/new).
1. Create a new [GitHub OAuth application](https://github.com/settings/applications/new).
2. Enter your Netlify domain as the **Homepage URL**.
3. Enter `https://api.netlify.com/auth/done` as the **Authorization callback URL**.
4. Click **Register application.**
5. Click **Generate a new client secret.**
5. Click **Generate a new client secret.**
6. Copy the provided client secret and client ID.
### Configure Netlify
@ -203,4 +203,4 @@ Before you can access `/admin/` through your Netlify domain, you need to set up
2. Enter your client secret and client ID from GitHub.
3. Click **Install**.
🎉 All done! Now you can access the admin interface through your Netlify URL.
🎉 All done! Now you can access the admin interface through your Netlify URL.

2
packages/docs/content/docs/hugo.mdx
View File

@ -77,7 +77,7 @@ In Hugo, static files that don't need to be processed by the build commands live
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
</body>
</html>
```

2
packages/docs/content/docs/jekyll.mdx
View File

@ -37,7 +37,7 @@ Create a file `admin/index.html` in the root of your repo - it should look like
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
</body>
</html>
```

6
packages/docs/content/docs/middleman.mdx
View File

@ -118,7 +118,7 @@ In the newly created `index.html` we add scripts for Static CMS and the Netlify
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js" type="text/javascript"></script>
</head>
<body>
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js" type="text/javascript"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js" type="text/javascript"></script>
</body>
</html>
@ -151,7 +151,7 @@ collections:
```
### Push to GitHub
It's now time to commit your changes and push to GitHub.
It's now time to commit your changes and push to GitHub.
```bash
git init
@ -176,7 +176,7 @@ Netlify's Identity and Git Gateway services allow you to manage CMS admin users
## Start publishing
It's time to create your first blog post. Login to your site's `/admin/` page and create a new post by clicking New Blog. Add a title, a date and some text. When you click Publish, a new commit will be created in your GitHub repo with this format `Create Blog "year-month-date-title"`.
It's time to create your first blog post. Login to your site's `/admin/` page and create a new post by clicking New Blog. Add a title, a date and some text. When you click Publish, a new commit will be created in your GitHub repo with this format `Create Blog "year-month-date-title"`.
Then Netlify will detect that there was a commit in your repo, and will start rebuilding your project. When your project is deployed you'll be able to see the post you created.

2
packages/docs/content/docs/nextjs.mdx
View File

@ -158,7 +158,7 @@ Paste HTML for Static CMS into your `public/admin/index.html` file (check out th
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
</body>
</html>
```

2
packages/docs/content/docs/nuxt.mdx
View File

@ -36,7 +36,7 @@ In the `static/` directory, create a new directory `admin/`. Inside that directo
</head>
<body>
<!-- Include the script that builds the page and powers Static CMS -->
<script src="https://unpkg.com/@staticcms/core@%5E1.0.0/dist/static-cms-core.js"></script>
<script src="https://unpkg.com/@staticcms/app@%5E1.0.0/dist/static-cms-app.js"></script>
</body>
</html>
```