Introducing the Schedule Module
- #Modules
- #Updates
- Mitchell Christ
Welcome to time-Based Content Management in SanityPress
We're excited to announce a powerful new addition to SanityPress: the Schedule module. This feature brings time-based content management to your Next.js + Sanity.io website, allowing you to schedule when specific content modules appear and disappear automatically.
What is the Schedule Module?
The Schedule module is a sophisticated wrapper component that enables you to control the visibility of any existing SanityPress module based on date and time. Built as a client component while maintaining compatibility with server components, it provides seamless integration with your existing content structure.
Key Features
- Flexible Date Range Control: Set specific start and end dates for content visibility.
- Module Nesting: Wrap any existing SanityPress module to make it time-sensitive.
- Real-Time Updates: Automatic content updates through efficient interval checking with the wrapper client component.
- Server Component Compatible: Works seamlessly with both client and server components.
How It Works
The Schedule module is built around the <Scheduler>
wrapper React component, which handles all the timing logic. It uses setInterval
to continuously check if the current time falls within the specified datetime ranges, ensuring your content appears and disappears exactly when you want it to.
This works without the need for Sanity's Scheduled publishing paid feature—it will work on the free plan! All that's needed are a start
and end
"datetime" schema type.
Feel free to repurpose this code into your project—SanityPress or not!
How to Use
To start using the Schedule module, simply add it to your Page document. Then, add start and/or end dates and times. Lastly, populate your content with the list of modules from the dropdown.
You can add more modules to use in the Scheduler by editing the schedule-module.ts
Sanity schema file:
export default defineType({
name: 'schedule-module',
// ...
fields: [
// ...
defineField({
name: 'modules',
type: 'array',
of: [
{ type: 'callout' },
{ type: 'custom-html' },
{ type: 'hero' },
{ type: 'hero.saas' },
{ type: 'hero.split' },
{ type: 'testimonial.featured' },
// ... add more modules here
],
}),
],
})
Real-World Applications
Seasonal Website Themes
Using the Schedule module with our Custom HTML module, you can automatically apply seasonal styling to your website. Imagine automatically activating holiday decorations during December.
Temporary Announcements
The Schedule module powers our Announcement component, allowing you to display time-sensitive notifications above your site header, such as:
- Flash announcements
- Limited-time offers
- Temporary service notifications
Dynamic Homepage Content
Schedule different hero banners to showcase various content throughout the year:
- Seasonal promotions
- Event highlights
- Time-limited features
- Campaign-specific messaging
Looking Forward
The Schedule module is just the beginning of our efforts to make content management more dynamic and flexible in SanityPress. We're excited to see how you'll use this feature to create more engaging, timely content experiences for your users.
Have questions or want to contribute? Join our GitHub discussion or or give us a star on GitHub!