C9 Blocks

April 21, 2024

C9 Blocks Plugin

10 new Gutenberg blocks with section templates and page templates. With C9 Blocks + Themes, the digital agency is built right into the code.

COVERT NINE‘s C9 Blocks plugin provides 10 new Gutenberg blocks, plus an interface for creating pages from section templates, or fully-built page templates. Block landing page templates are usable for any purpose but are designed to give organizations a head start on creating landing pages with specific purposes for their audience.

The landing page templates are organized in a modal by the “content journey” step (Awareness, Consideration, Conversion). After installing the plugin, they can be accessed from the feather logo icon in the upper right corner.

Plugin can be installed from the WordPress admin via file upload or by cloning the Github repo. We recommend using a C9 supported theme with the C9 Blocks plugin, but it also works with the Twenty Twenty Four, Twenty Twenty One, Twenty Twenty and Twenty Nineteen WordPress themes. We recommend using the C9 Starter, C9 Work theme, or C9 Togo theme to see C9 Blocks in action, or signup for the C9 early access list to get all of our premium themes and plugins for free! We currently have four blocks-based themes and four child themes available for early access list subscribers and an exclusive C9 Blocks Animation Plugin to animate any core WordPress blocks or C9 Blocks.

For an overview of each of the blocks, and more up to date documentation, head over to our documentation site

What’s it like editing content with C9?

C9 Blocks Includes the Following Blocks

  • Heading Block
  • Social Share Block
  • Horizontal Tabs Block
  • Vertical Tabs Block
  • Posts Grid Block
  • Post and Page Grid Block
  • Call To Action Block
  • Carousel Block
  • Image Carousel Block
  • Toggles Block
  • Grid Block

Demo Videos

Creating marketing-focused landing pages with C9 Blocks + C9 Starter Theme

How to Create a mobile-friendly and animated Homepage for the Twenty Twenty One WordPress Theme

Designing a new page header using C9 Grid blocks and the Twenty Twenty One WordPress Theme

How to Create a Homepage for the Twenty Twenty WordPress Theme

Building A Netflix Inspired Landing Page with C9 Blocks

Overview & Documentation

Get an overview of each of the blocks and the latest documentation by heading over to our documentation site.

C9 Starter WordPress Theme

The C9 Starter Theme is a responsive and minimal, CSS Grid-based, Bootstrap 4 theme that utilizes most of Bootstrap’s components and works seamlessly with C9 Blocks and the Gutenberg block editor. It’s based on Understrap, but with an innovative approach to using Gutenberg’s editing system.

If you’re an agency working on behalf of a client and want to build your own style guide and/or themes on top of the C9 Starter Theme, included is a client boilerplate folder and full child theme support. Join the C9 early access list with a simple email signup to get four example themes along with all of our other WordPress tools emailed to you with tips on how to build your own block-based WordPress websites.

C9 Blocks Animation with Greensock (GSAP)

C9 Blocks has an addon called C9 Animation that comes with our C9 Early access list when you sign up. Unlock the power of buttery-smooth animations that run cross-browser and cross-device, all from within the visual block editor.

C9 Blocks Animation Plugin

Blocks-powered WordPress Themes

Follow Along

Online Documentation

Support

Get premium paid support: Here

The Blocks Development Guide lives Here

Additional tutorials, C9 Themes, and WordPress content from COVERT NINE Here

Licenses

Resource Licenses:
C9 Images, Icons, + Logos: https://www.covertnine.com/c9-blocks-plugin | GNU GPL v3

Installation

  1. Upload the plugin files to the /wp-content/plugins/c9-blocks directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress
  3. Use the Appearance->C9 Blocks screen to see a quick overview for using the plugin, and you can access your Reusable Block Layouts you save at Appearance -> C9 Reusable Blocks.
  4. The C9 Blocks plugin should redirect you to this quick start guide after activation. Blocks can be accessed from the + icon or the feather logo icon in the upper right hand corner form any Gutenberg editing screen

Screenshots

  1. A look at the COVERT NINE Blocks from the + icon in a Gutenberg editing screen

    A look at the COVERT NINE Blocks from the + icon in a Gutenberg editing screen

  2. C9 blocks by using the '/' key shortcut and typing 'c9'

    C9 blocks by using the '/' key shortcut and typing 'c9'

  3. After clicking the feather icon, the page sections modal pops up.

    After clicking the feather icon, the page sections modal pops up.

  4. Page Templates in the C9 Blocks modal.

    Page Templates in the C9 Blocks modal.

  5. Reusable Blocks that you have saved on a site will display and can be previewed with the C9 Blocks modal.

    Reusable Blocks that you have saved on a site will display and can be previewed with the C9 Blocks modal.

  6. Tutorials in the modal to show how to use the blocks plugin and how to build landing pages.

    Tutorials in the modal to show how to use the blocks plugin and how to build landing pages.

FAQ

Can C9 Blocks be used with any theme?

The current blocks plugin supports the WordPress Twenty Nineteen, WordPress Twenty Twenty, WordPress Twenty Twenty One, C9 Starter, C9 Music, C9 Work, and the C9 Togo WordPress themes.

We’re working to make the plugin work with other themes as well. If you have a page template that supports full-width layouts, then the C9 Blocks plugin should work with most Bootstrap and some non-Bootstrap themes.

Get the C9 Starter Theme
C9 Starter Demo
C9 Work Demo
C9 Music Demo
C9 Togo Demo

Do I need the new block editor to use C9 Blocks?

Yes, you will need to have WordPress 5.9 or later installed to take advantage of C9 Blocks.

Changelog

1.7.5

Removed width support for cover block causing some issues in backend. Core width controls work just fine.

1.7.4

Updated compatibility with WordPress 6.5.2

1.7.3

Fixed issue with template preview from C9 Templates modal with new block markup for WordPress 6.5.2.

1.7.2

Bug fixes and updates for WordPress Twenty Twenty Four theme compatibility and WordPress 6.4.3.

1.7.1

Fixed bug where you can’t click images in grids that are floated. Fixed some JS errors related to react.

1.7.0

Added spacer extension to galleries. Minor WordPress 6.4 bug fixes.

1.6.9

Adjustment to inspector fields to show more characters, and visibility extension set to expand by default

1.6.8

Fixed a bug causing horizontal blocks to be uneditable. Updated dev packages. Fixed sidebar fields hard to see on some views. Minor bug fixes and tweaks to some templates and interface elements. Added translations folder and initial english translation files. Adjusted patterns, and preview code to account for new preview dialog features.

1.6.7

Fixed bugs and updated packages and blocks for WordPress 6.2. Revised C9 Heading block to create new block on enter.

1.6.6

Fixed production build tools that was causing some backend mobile editing issues for some browsers.

1.6.5

Changed default on overlay background blend modes to normal. Package updates for developers. Updated quick start guide.

1.6.4

Changed backend fonts to rems from ems and fixed one subhead size missed.

1.6.3

Changing fonts to rems, and updates to template markup.

1.6.2

Bugfix on some full width C9 Grid blocks.

1.6.1

Bug fix on entry for vertical tabs. Link dialog fix on carousels. Alignment fixes for some blocks in posts. CTA bar font size fix.

1.6.0

Further edits to templates for WordPress 6.1.1 compatibility. Fixed video background bug, updated build tools, updated section + page templates.

1.5.2

Updates for WordPress 6.1. Fixes to horizontal tabs, carousels, lists. Updates to build tools for webpack5. Updating templates and sections.

1.5.1

Fix to some width issues with carousels in backend on some screens.

1.5.0

Updates to Grid blocks for width issues in backend. Added toggle to disable YouTube API from C9 Blocks Side Panel in the editor for GDPR compliance. Better compatibility with core button blocks updates. WordPress 6 compatibility updates. Support added for html in post titles for Post Grid block.

1.4.5

Adjustments to backend editor on saved block layouts, updates to labels for more clarification between reusable vs templates that are not locked. An attempt was made at fixing the BlockPreviews.

1.4.4

Updates for WordPress 5.9. Enhancements to carousel blocks for removing carousel slide items and changing slide order. Updated FAQs and readme.

1.4.3

Updated styles for C9 Grid layouts with mobile column flip enabled so spacing is even on columns stacked.

1.4.2

Added visibility settings for core blocks and c9-blocks for specific devices. Added column reversal toggle for mobile column order sort. Compatible with WordPress 5.8. Working on widget block updates.

1.4.1

Optimized file output.

1.4.0

Bug fixes to toolbar buttons and image carousel block toolbar bug fixes on Firefox.

1.3.9

Bug fix to video backgrounds in backend. Removed linear gradient inline CSS from inner containers.

1.3.8

Big update for WordPress 5.7 compatibility. Updates to carousels, image carousels, tabs, and bug fixes on mobile for some carousel settings.

1.3.7

Fixed broken “covert to blocks” buttons from saved blocks. Fixed layout bug for WooCommerce checkout conflicts. Updated package for icons in WP. Image carousels slides can now be linked. Min-height CSS fix for carousel slide heights.

1.3.6

Bug fix to overflow issues from some drop down menus on toolbar dropdowns like image replacement. Adding icons and more templates to library. Saved blocks width issues. Better mobile previews with grid layouts in admin.

1.3.5

Adjustments for styles to account for Twenty Twenty One WordPress theme to posts grid and some block elements inside of C9 Grid blocks. Updates to wide container alignments in grids on some screen sizes. Horizontal tabs style adjustment for slightly larger mobile devices. New markup for some blocks for new C9 Animations.

1.3.4

Fix bug with buttons on image carousels being behind images on some layouts, fixed 404 error from fonawesome for non C9 theme inclusion.

1.3.3

Adding more carousel transitions. Better full width alignments for carousels. Button color fix on C9 Grid rows.

1.3.2

Fixing bug for carousel arrows being below scalable drag bar.

1.3.1

Fixing bug for video background links from YouTube. Font size fixes for CTA bars, some formatting updates to templates modal.

1.3.0

Updating markup for vertical alignment of C9 Grid column container blocks for WordPress 5.6. Fixed markup interfering with core Social Icons Block.

1.2.9

Fixing backend previews for tablet, updating markup to account for social icon core blocks and WordPress 5.6 markup.

1.2.8

Adjustments to vertical alignemnts for columns in containers, draggable C9 Grid blocks, column widths in backend for WordPress 5.6

1.2.7

Heading toolbar buttons bug fixed.

1.2.6

Backend style updates to keep compliance with WordPress 5.6. Updates to full width alignment on some blocks. React.js updates for some block api components. Toolbar button updates.

1.2.5

Updates to style guide landing page template, hiding post and page blocks from root insertion, maintenance update.

1.2.4

Fixing C9 Grid blocks causing horizontal scrollbar in Chrome on Windows, alignment fixes for C9 Posts Grid container, modal grid icon size adjustments.

1.2.3

Adjustments to templates modal on smaller screens, fixes for some JS errors showing up for some users.

1.2.2

Bug fix for C9 Blocks Animations with video background C9 Grids.

1.2.1

Optimized SVG icons, optimizing frontend file size, modal style updates.

1.2

Added alignwide and alignfull alignments to Carousels and Image Carousels. Added draggable heights for containers in C9 Grids. Several bug fixes to jumpy navigations, preparing plugins for animation settings. Bug fixes to alignments on some blocks. New page templates and section templates!

1.1.3

Fixed issues with new toggles and tabs not displaying appender buttons and some alignfull container issues on some browsers in WordPress 5.5.

1.1.2

Fixed bugs to grid row buttons and icons missing for delete toggle buttons.

1.1.1

Updated backend settings and CSS for WordPress 5.5. Added equal height slide settings for image carousels and carousels. Added WP Query filtering by tags or categories for Post Grids. Usability enhancements for WP 5.5 to make it easier to add content to C9 Grids and carousels. C9 Grids can be used on Posts in addition to Pages. Added better support for IE11.

1.1

Fixed margins on column buttons. Added appender buttons for column grids to make it easier to add content.

1.0.9

Fixed bug on alignwide alignment for containers on some tablet devices.

1.0.8

Compatibility updates for WP 5.4 release to deprecated code. Fixed video background display bug. Better Internet Explorer 11 support.

1.0.7

  • Microsoft Edge browser compatibility updates. Internet explorer 11 compatibility updates for grid alignments.

1.0.6

  • Fixed markup changes for WordPress 5.4 Gutenberg updates
  • Alignwide and alignfull class updates for Posts
  • Bug related to display of embeds and Twitter embeds
  • Single post big header entry meta bug fixes
  • Updates to templates modal
  • Fixing Netflix style page template queries
  • Backend mobile updates

1.0.5

  • Fixed contact template that had unexpected block output
  • Fixed color and image path background image bugs. Thanks Drew + Christian.
  • Fixed admin-style path double /

1.0.4

  • Fixed error message related to colors in backend being exposed to rest API

1.0.3

  • Added font size controls to call to action block
  • Added mobile override settings for background imagery in C9 Grid and C9 Posts Grid Block (Initial beta of the mobile settings)
  • Fixed bugs causing jumpy row buttons on c9-grid block
  • Adjustments to editor spacing of grids and columns to more accurately reflect the frontend display
  • Removed dotted outlines for columns
  • Updated modal design
  • Updates to page templates and section templates
  • Added several new layouts to templates modal
  • Updated bugs for WordPress Twenty Twenty and Twenty Nineteen Themes to remain compatible with the latest version of WordPress 5.3.2
  • Updates to mobile layouts for most templates with background imagery

1.0.2

  • Updated readme files, and fixed bugs related to display of backgrounds on iOS devices.

1.0.1

  • Initial release
  • 10 new blocks
  • 38 section templates
  • 15 full landing page templates
  • First set of online documentation
  • WordPress Twenty Nineteen and Twenty Twenty Support
  • C9 Starter Theme Support

Details

  • Version: 1.7.5
  • Active installations: 100
  • WordPress Version: 5.9
  • Tested up to: 6.5.5
  • PHP Version: 7.1

Ratings


5 Stars
4 Stars
3 Stars
2 Stars
1 Stars