DEV Community: stuart

ApostropheCMS 4.18.0: Better Conditional Fields, Image Links in Rich Text & Widgets, plus a New Default Rich Text Toolbar

stuart — Wed, 11 Jun 2025 16:56:28 +0000

Hello Apostrophe Community!

Apostrophe 4.18.0 continues our commitment to improving the editorial experience with more options for conditional fields, easy image linking, and expanded rich text editing tools and styles.

Advanced Conditional Fields with Enhanced Query Capabilities

This release introduces enhancements to conditional field logic, giving developers more precise control over when fields appear in editing interfaces. Conditional fields now support following, enabling fields to be conditionally displayed based on values within deeply nested objects or arrays.

Additionally, conditional fields now support dot notation for conditionals like array length and MongoDB-like query operators including $gt, $gte, $lt, and $lte. This enhancement applies to all conditional fields, allowing developers to create more focused editing interfaces throughout the platform.

Unified Image Linking Experience

We've enhanced how editors work with images by introducing linking capabilities that work consistently whether images are added through the rich text editor or the image widget.

Images are now added as figure elements with caption support, providing better semantic structure and styling opportunities. This structure also enables captions and linking functionality. By default, the widgets allow you to add links to URLs or internal pages. The linkWithType option allows you to add links to any piece-type show page.

Important Styling Note: Developers should review and update their CSS to ensure proper styling of figure-based images. An inline margin: 0 style is added by default, but can be disabled by setting inlineStyles: false in widget configuration.

Streamlined Rich Text Editing

We've expanded the default toolbar and styling options available in the rich text widget, reducing setup work for new projects. Common formatting options that previously required explicit configuration are now available by default, allowing content teams to start creating formatted content immediately.

These enhancements reduce friction in the content creation process while maintaining the flexibility developers need to create customized editorial experiences. To take advantage of these new default settings in an existing project, just remove any project-level rich text widget toolbar options.

Enterprise Contributions: Zero-Downtime Site Management

We're proud to highlight a significant contribution from Michelin to our multisite capabilities. As briefly noted on May 20th, the multisite extension now supports zero-downtime site reloads and proactive site prewarming, enabling enterprise customers to manage large-scale deployments more efficiently. When site configurations change, the system serves requests with existing instances while new instances start in the background, ensuring seamless transitions and improved performance.

Quality of Life Improvements

This release includes several refinements that improve the overall editorial experience:

Media library download links now work as expected, immediately downloading files rather than navigating away from the current page
Error pages now include proper cache headers to prevent serving stale error content
API key permissions have been corrected to provide appropriate access levels for different user roles

These improvements are ready for you to explore! Update your projects with npm update and let us know what you think on our roadmap. Your feedback helps us refine and enhance ApostropheCMS to meet your needs.

🚀 Happy coding!

ApostropheCMS 4.17.0: Live widget preview now default and image cropping shortcut

stuart — Wed, 14 May 2025 20:43:07 +0000

Hello Apostrophe Community!

The full changelog can be read on the ApostropheCMS blog

The release of Apostrophe 4.17.0 includes updates to the core experience for teams, empowering editors with more intuitive widget editing and developers with tools to create more customized interfaces.

Image Widget: Streamlined Editing Path

We've improved the image widget with a more intuitive editing workflow. Previously, users had to navigate through multiple modals to adjust an image's cropping and focal point. Now, the image widget offers a more accessible menu with direct access to key functions:

This streamlined approach reduces clicks and makes image editing more efficient. The enhancement was implemented using our new widgetOperations configuration function, which adds the adjustImage operation to the image widget. This improvement demonstrates our commitment to making content editing more intuitive and efficient.

Live Widget Preview: Now Enabled by Default

After extensive internal testing that proved its stability and value, we enabled the live widget preview feature by default for all users. This change transforms widget editing from a "save and see" experience to immediate visual feedback as you type or select options in the widget modal. The immediate visual feedback helps editors create exactly what they need faster than ever.

For those who prefer to work without live previews, you can disable this feature in your widget settings, but we encourage you to give it a try - we believe it will substantially improve your content editing experience.

Customizable Widget Operations: Extend Any Widget's Capabilities

Developers can now use the new widgetOperations cascade config property to add custom operations to any widget type. This feature demonstrates our commitment to making the platform more extensible - we've already used it ourselves to add the adjustImage operation to the core image widget!

This new property allows developers to extend any widget's editing experience by adding custom operations directly to the menu interface. Content teams can now have editing workflows tailored specifically to their needs, with operations that make sense for their particular content types.

This is also a first steps toward the creation of Sections, which will make it possible to save and re-use layouts across your site.

Looking Ahead: Enhanced Documentation for Improved Developer-Driven UX

As part of our commitment to improving the content manager experience, we're enhancing our documentation site with an expanded tutorials section in the coming weeks and months. The first wave of new documents will help developers create better editorial interfaces, covering topics such as:

Configuring the admin bar for optimal workflow
Adding support desk help where editors need it most
Proper usage of tooltips and help text to guide users
Best practices for creating intuitive editing experiences

By providing developers with better UX guidance on, we aim to elevate the quality of editorial experiences across all ApostropheCMS projects. Look forward to these short-form, focused tutorials that will help you implement user-centered design principles in your CMS implementations.

These improvements are ready for you to explore! Update your projects with npm update and let us know what you think on our new roadmap site. Your feedback helps us refine and enhance ApostropheCMS to meet your needs.

🚀 Happy coding!

Apostrophe 4.15.0: In-Context Live Preview, Enhanced Tables, and Translation Tools

stuart — Wed, 16 Apr 2025 18:49:14 +0000

Hello Apostrophe Community!

A few notes here at the top, we have a video overview of 4.15.0

and the full deep-dive on our blog and a link to the GitHub discussion

We're excited to announce the release of Apostrophe 4.15.0, focused on empowering your editorial and marketing teams with tools that make content creation more intuitive and efficient. This release brings significant improvements to the core editing experience while enhancing our support for global enterprise customers through improved translation capabilities and content management.

In-Context Live Widget Preview: See Changes as You Make Them

The standout feature in this release is the new in-context live preview capability for widgets. Now, content editors can see changes reflected on the page in real-time as they make edits—no more waiting to publish or preview to see how adjustments will look.

Although this feature is well-tested, the feature is currently opt-in as we gather community feedback. To enable it, set preview: true in the options section of the index.js file of any widget module, or activate it globally by setting it on the @apostrophecms/widget-type module. We encourage you to test this feature and share your experience with us. The in-context preview is particularly powerful when combined with range fields for styles like container widths, allowing editors to fine-tune their content with immediate visual feedback.

Enhanced Table Editing in Rich Text

Tables are a crucial part of presenting structured information, and we've made them even better:

A dedicated control bar specifically for table editing
Drag-to-resize column functionality for perfect table layouts
Building on our recently released CSV import feature, these improvements make managing tabular data more intuitive than ever

As a reminder, if your rich text widgets don’t offer tables on the insert menu yet, be sure to add table to the insert option when configuring the rich text widget in each area. Then editors can access the insert menu by pressing / at the start of any line.

Global Reach with Translation Support

For our enterprise customers operating internationally, we've enhanced the Import/Export extension with automatic translation capabilities. When importing content, you can now leverage our Automatic Translation extension to streamline multilingual content management. This feature makes managing content across different languages and regions more efficient, especially if some of your locales are hosted in a separate deployment of ApostropheCMS.

Batch Operations for Media Library

Content managers working with large media collections will appreciate the enhanced batch operations in the Media Library. You can now select multiple images at once to:

Archive images in bulk
Localize multiple images simultaneously for different regions
Export selected images for use in other contexts

These batch operations significantly streamline workflows when managing extensive media collections, saving valuable time for your editorial and marketing teams.

UX Improvements Across the Board

We believe that small enhancements add up to a significantly better experience. This release includes numerous quality-of-life improvements, part of our broader commitment to focus on making the editor experience more intuitive in upcoming release cycles:

Smoother Page Management: Page dragging and reordering now happens in the background without blocking the UI, and the UI scrolls automatically when dragging.
Enhanced Media Manager: Uploading images is now smoother with no additional server requests and improved error handling.
Form Refinements: The user email field is properly typed as email, and the reset password button is more clearly labeled.
Performance Optimizations: We've reduced verbose logging and made background processes more efficient.

Community Contributions: sanitize-html Enhancements

We're proud to highlight community contributions in this release, particularly the enhancements to the sanitize-html module. Thanks to Rimvydas Naktinis, this long-standing module now includes onOpenTag and onCloseTag events, enabling more advanced filtering capabilities. This improvement demonstrates the power of our open-source community and their continued commitment to improving Apostrophe's ecosystem.

Discover Our New Public Roadmap

We're excited to announce our new public roadmap at https://roadmap.apostrophecms.com/. Visit to see what is in progress, coming next, and currently in the backlog — and share your ideas and feedback on current and future features. Insights from you help shape the direction of Apostrophe, and we encourage community contributions to make our CMS even better.

These improvements are ready for you to explore! Update your projects with npm update and let us know what you think. Your feedback helps us refine and enhance ApostropheCMS to meet your needs.

🚀 Happy coding!

ApostropheCMS 4.14.0: Smarter Content Management, Better Performance, and CSV Table Imports

stuart — Wed, 19 Mar 2025 18:41:31 +0000

Hello Dev.to community!

ApostropheCMS 4.14.0 has been released. Check out an overview.

There is also a full deep dive of the release on our blog

From enhanced table support in the rich-text editor to better piece management, this release brings several quality-of-life improvements for both developers and content managers.

Rich Text Improvements

The heart of content creation in Apostrophe has always been our rich text editor, and with this release, it becomes even more powerful. We've added the ability to generate tables from imported CSV files directly within the rich text widget. This allows content editors to quickly transform spreadsheet data into well-formatted web content.

We've also reworked rich text popovers to use AposContextMenu for both toolbar components and insert menu items, fixing problems seen when editing on smaller screen sizes.

A More Efficient and Intuitive UI

This release also brings several usability improvements. One of the more noticeable changes is the increase in the default pagination size for piece-type managers, jumping from 10 to 50 items per page. This change significantly reduces the need for excessive clicking and increases efficiency when managing extensive collections of content.

Finding the right PDF is now faster with the addition of a "Tags" filter to the file manager. We've also improved the image manager’s infinite scroll pagination for a more reliable browsing experience.

Quality-of-Life Fixes and Enhancements

No update is complete without some essential fixes. The lang attribute of the page <html> tag now correctly reflects the active localization settings, ensuring better accessibility and SEO compliance. We've also fine-tuned focus styling within the AposTable headers and added better error handling for misconfigured widgets in expanded preview mode. Another small but impactful fix: altering CSS styling to prevent margin collapse in nested areas, especially when the nested area comes from another document. This would sometimes make adding a peer widget above or below a parent widget difficult or impossible.

The postcss-viewport-to-container-toggle plugin was improved with expanded handling and conversion of more media queries and units, making our breakpoint preview feature more robust and versatile across a broader range of design scenarios.

🚀 Happy coding!