ContentQL ContentQL Docs

ContentQL Core Package

Overview

The @contentql/core package extends your default Payload CMS configuration by integrating pre-built collections and plugins. These configurations can be extended further to match your project needs. It’s essential to have a solid understanding of blocks and collections before diving into customizations.

For detailed information, check the official package here:

npm

Getting Started

To use the base configuration of ContentQL Core, add the following code to your payload.config.ts file:

payolad.config.ts
import { cqlConfig } from '@contentql/core'
import path from 'path'
import { fileURLToPath } from 'url'
 
// payload block-configuration files
import DetailsConfig from '@/payload/blocks/Details/config'
import HomeConfig from '@/payload/blocks/Home/config'
import ListConfig from '@/payload/blocks/List/config'
 
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
const finalPath = path.resolve(dirname, 'payload-types.ts')
 
// Add the extra payload configuration you want!
export default cqlConfig({
  // baseURL is required for Live-Preview & SEO generation
  baseUrl: 'http://localhost:3000',
  dbURL: process.env.DATABASE_URI,
  s3: {
    bucket: process.env.S3_BUCKET,
    accessKeyId: process.env.S3_ACCESS_KEY_ID,
    secretAccessKey: process.env.S3_SECRET_ACCESS_KEY,
    region: process.env.S3_REGION,
    endpoint: process.env.S3_ENDPOINT,
  },
  typescript: {
    outputFile: finalPath,
  },
  secret: process.env.PAYLOAD_SECRET,
  cors: [process.env.PAYLOAD_URL],
  csrf: [process.env.PAYLOAD_URL],
  resend: {
    apiKey: process.env.RESEND_API_KEY,
    defaultFromAddress: process.env.RESEND_SENDER_EMAIL,
    defaultFromName: process.env.RESEND_SENDER_NAME,
  },
  // pass the configuration to blocks field these will appear in pages collection in admin panel
  blocks: [HomeConfig, DetailsConfig, ListConfig],
})

Accessing Collection Slugs

To access collection slugs in your routes, use the following import:

route.ts
// This will provide the slugs of all collections
import { collectionSlug } from '@contentql/core'
 
const { docs } = await payload.find({
  collection: collectionSlug['blogs'],
  depth: 5,
  draft: false,
})

πŸ“¦ Out of the Box Contents

These collections & plugins will be automatically added

Collections

Plugins

Continuous Updates from ContentQL

Whenever we make changes to any of our plugins or add a new feature, these updates are delivered as a package update. If you're creating a theme, you will automatically get the latest features and improvements through these updates, ensuring your project stays aligned with the latest version of the package.

On this page