Info Cards – present key information in elegant card layouts vs Syntax-highlighting Code Block (with Server-side Rendering)

Turn plain text into eye-catching info cards that make your content easier to scan, understand, and remember – no code required. Info Cards | Demos | Pricing Why Info Cards? Walls of text lose readers. Info Cards is a Gutenberg block that lets you present content as beautifully designed, informative cards – combining images, text, and links in layouts your audience can consume at a glance. Choose from built-in templates or create your own custom layout to fit your branding. Set columns, gaps, colors, and typography from the block sidebar – no code or additional software needed, even if you have limited technical knowledge. Every card layout is fully responsive, so your content looks great and functions perfectly across all devices and screen sizes. Whether you’re creating product cards, team member profiles, or informational sections, Info Cards helps your content stand out. Free Features Fully Customizable: Adjust every part of the card to match your site. Custom Colors: Use your brand’s colors throughout. Built-in Templates: Start from ready-made card designs. Layout Control: Set columns, column gap, and row gap. Image Support: Use an image in each card. Link Support: Make cards clickable with links. Typography: Control the text styling of your cards. Responsive Layout: Cards adapt to all devices and screen sizes. Easy to Use: Add and customize cards straight from the block editor. Pro Version Info Cards Pro unlocks more designs and deeper styling control: Universal Shortcodes: Compatible with all page builders. 12+ Ready-Made Themes: Professionally designed card styles. Advanced Templates & Layouts: More ways to arrange your cards. More Typography Controls: Font family, weight, and spacing. Hover & Animation Effects: Bring cards to life on interaction. Gradient & Advanced Color Options: Richer backgrounds and accents. Full Box Control: Border, padding, and margin settings. Card Shadows & Depth Effects: Add dimension to your layouts. 7+ New Built-in Blocks: Extra card blocks to build with. Priority Updates & Support. How to Use Install and activate the Info Cards plugin. Go to the page or post where you want to embed the cards. Click the + button in the Gutenberg editor and search for Info Cards. Select the Info Cards block. Create and customize your cards, then publish. Enjoy! Use Cases Product Highlights: Present features or products in scannable cards. Team Profiles: Introduce team members with photo, name, and link. Service Sections: Summarize what you offer in a clean grid. Informational Content: Break long content into digestible cards. Feedback Liked that plugin? Hate it? Want a new feature? Send me some feedback ⭐ Check out the Parent Plugin of this plugin- 🔥 bBlocks – Best gutenberg blocks collections for WordPress. ⭐ Check out our other WordPress Plugins- 🔥 Html5 Audio Player – Best audio player plugin for WordPress. 🔥 Html5 Video Player – Best video player plugin for WordPress. 🔥 PDF Poster – A fully-featured PDF Viewer Plugin for WordPress. 🔥 StreamCast – A fully-featured Radio Player Plugin for WordPress. 🔥 3D Viewer – Display interactive 3D models on the webs.

This plugin extends the Code block in WordPress core to add syntax highlighting which is rendered on the server. Pre-existing Code blocks on a site are automatically extended to include syntax highlighting. Doing server-side syntax highlighting eliminates the need to enqueue any JavaScript on the frontend (e.g. Highlight.js or Prism.js) and this ensures there is no flash of unhighlighted code (FOUC?). Reducing script on the frontend improves frontend performance, and it also allows for the syntax highlighted code to appear properly in AMP pages as rendered by the official AMP plugin (see also ampproject/amp-wp#972) or when JavaScript is turned off in the browser. This extended Code block uses language auto-detection to add syntax highlighting, but you can override the language in the block’s settings sidebar. (There is currently no syntax highlighting of the Code block in the editor, but see #8.) The plugin supports all programming languages that highlight.php supports (being a port of highlight.js). The Code block also is extended to support specifying lines to highlight which get marked up with mark elements (including in RSS feeds). There is also a checkbox for whether to show line numbers on the frontend (with the numbers being non-selectable). Lastly, given inconsistencies across themes regarding whether lines in a Code block should be wrapped, this plugin adds styling to force them to no-wrap by default, with a checkbox to opt in to wrapping when desired. For advanced usage, please see the plugin wiki. This plugin is developed on GitHub. See list of current issues with the plugin. Please feel free to file any additional issues or requests that you may come across. Pull requests are welcome. See contributing information. Credits This is a fork of Code Syntax Block by Marcus Kazmierczak (mkaz), which is also available on WordPress.org. Copyright (c) 2018 Marcus Kazmierczak. Licensed under GPL 2.0 or later. highlight.php is released under the BSD 3-Clause License. Copyright © 2006-2013, Ivan Sagalaev ([email protected]), highlight.js (original author). Copyright © 2013, Geert Bergman ([email protected]), highlight.php