
Product
Introducing Pull Request Stories to Help Security Teams Track Supply Chain Risks
Socket’s new Pull Request Stories give security teams clear visibility into dependency risks and outcomes across scanned pull requests.
@jee-r/astro-decap-cms
Advanced tools
Add Decap CMS’s admin dashboard to any Astro project
npm i astro-decap-cms
This is an integration for the Astro site builder, which adds support for Decap CMS, an open-source, Git-based content management system.
Adding the integration will:
/admin
(or another route if you prefer)dev
mode to allow local content updates via the CMSUsually each of these requires individual set up and configuration. Using this integration, you configure your CMS once in astro.config.mjs
, sit back, and enjoy!
Looking for a quick way to get started? Try out the Blog Starter with Decap CMS →
To add Decap CMS to your project, import and use the integration in your
Astro config file, adding it to the integrations
array.
// astro.config.mjs
import { defineConfig } from 'astro/config';
import NetlifyCMS from 'astro-decap-cms';
export default defineConfig({
integrations: [
NetlifyCMS({
config: {
backend: {
name: 'git-gateway',
branch: 'main',
},
collections: [
// Content collections
],
},
}),
],
});
You can pass an options object to the integration to configure how it behaves.
adminPath
Type: string
Default: '/admin'
Determines the route where the Decap CMS admin dashboard will be available on your site.
Feeling nostalgic for WordPress? You could set this to '/wp-admin'
!
config
Type: CmsConfig
This option is required. It allows you to configure Decap CMS with the
same options you would use when using Decap CMS’s config.yml
file format.
You can see a full list of configuration options in the Decap CMS docs.
At a minimum, you must set the backend
and collections
options:
config: {
// Use Netlify’s “Git Gateway” authentication and target our default branch
backend: {
name: 'git-gateway',
branch: 'main',
},
collections: [
// Define a blog post collection
{
name: 'posts',
label: 'Blog Posts',
folder: 'src/pages/posts',
create: true,
delete: true,
fields: [
{ name: 'title', widget: 'string', label: 'Post Title' },
{ name: 'body', widget: 'markdown', label: 'Post Body' },
],
},
],
};
previewStyles
Type: Array<string | [string, { raw: true }]>
Sets custom CSS styles to apply in the Decap CMS preview pane.
You can provide URLs to external CSS stylesheets (Google Fonts for example), paths to local CSS files in your project, or even raw CSS strings:
previewStyles: [
// Path to a local CSS file, relative to your project’s root directory
'/src/styles/main.css',
// An npm module identifier
'@fontsource/roboto',
// A URL to an externally hosted CSS file
'https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap',
// Raw CSS!
['p { color: red; }', { raw: true }],
];
disableIdentityWidgetInjection
Type: boolean
Default: false
By default, astro-decap-cms
injects Netlify’s Identity Widget across your site to enable authentication. If you only want to inject the widget on the admin route, you can set disableIdentityWidgetInjection: true
.
FAQs
Add Decap CMS’s admin dashboard to your Astro project
We found that @jee-r/astro-decap-cms demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Socket’s new Pull Request Stories give security teams clear visibility into dependency risks and outcomes across scanned pull requests.
Research
/Security News
npm author Qix’s account was compromised, with malicious versions of popular packages like chalk-template, color-convert, and strip-ansi published.
Research
Four npm packages disguised as cryptographic tools steal developer credentials and send them to attacker-controlled Telegram infrastructure.