Fahad Murtaza

Don’t take our word for it, try CardCrafter live. <a href="https://tastewp.com/plugins/cardcrafter-data-grids" rel="nofollow ugc">Full-featured demo</a> on a real WordPress site. No signup, no download, no risk.
CardCrafter is the #1 WordPress plugin for displaying data as beautiful card grids. Transform your WordPress posts, JSON data, and custom content into professional, responsive card layouts. No coding required.
🆕 NEW in v1.12.0: Native WordPress Posts integration! Display your blog posts, pages, or custom post types as stunning card grids with featured images, excerpts, and automatic formatting.
Perfect for: 
• Team Directories – Display staff members with photos and bios 
• Product Showcases – Feature products with images, prices, and descriptions 
• Portfolio Galleries – Present your work in elegant grid layouts 
• Blog Post Grids – Convert WordPress posts into visual card displays 
• Service Listings – Highlight your services with card-based layouts
Trusted by 10,000+ WordPress sites for enterprise-grade data visualization with instant setup and professional results.
Why CardCrafter?
<ul>
<li>🎨 Beautiful by Default: Modern, clean card designs that look professional out of the box.</li>
<li>📱 Fully Responsive: Cards automatically adapt to any screen size.</li>
<li>⚡ Lightweight: Pure JavaScript, no jQuery. Fast and efficient.</li>
<li>🔍 Interactive: Built-in search and sorting for easy data navigation.</li>
<li>📊 Data Export: Export displayed data as CSV, JSON, or PDF for business use.</li>
<li>🔧 Flexible Layouts: Choose between Grid, Masonry, or List view.</li>
</ul>
<h3>🚀 Key Features</h3>
<ul>
<li>🧱 Gutenberg Block: Native WordPress block editor support with visual configuration.</li>
<li>📝 WordPress Posts Grid: Transform your blog posts into beautiful card layouts with one click.</li>
<li>Instant Search & Sort: Users can filter and sort cards instantly (Client-side).</li>
<li>Multiple Layouts: Grid, Masonry, and List views to suit your content.</li>
<li>Customizable Columns: Display 2, 3, or 4 cards per row.</li>
<li>Smart Field Mapping: Automatically detects image, title, subtitle, description, and link fields.</li>
<li>Professional Data Export: Export as CSV for spreadsheets, JSON for system integration, or PDF for reports.</li>
<li>Live Admin Preview: Test your JSON sources before publishing.</li>
<li>Dark Mode Support: Cards automatically adapt to dark color schemes.</li>
</ul>
<h3>💡 Perfect For</h3>
<ul>
<li>Team Directories: Showcase your team members with photos and bios.</li>
<li>Product Catalogs: Display products with images, prices, and descriptions.</li>
<li>Portfolio Galleries: Present your work in an elegant grid layout.</li>
<li>Service Listings: Highlight your services with card-based layouts.</li>
<li>Testimonials: Display customer reviews in beautiful cards.</li>
</ul>
<h3>Usage</h3>
Display WordPress Posts 
Display your blog posts, pages, or custom post types as beautiful cards.
<pre><code>[cardcrafter-data-grids post_type="post"]
</code></pre>
Show WooCommerce Products 
Display your products in a grid layout.
<pre><code>[cardcrafter-data-grids post_type="product"]
</code></pre>
Team Directory (Sorted) 
Display team members sorted alphabetically by title.
<pre><code>[cardcrafter-data-grids post_type="team" wp_query="orderby=title&order=ASC"]
</code></pre>
News Category 
Show only posts from the ‘news’ category.
<pre><code>[cardcrafter-data-grids post_type="post" wp_query="category_name=news&posts_per_page=6"]
</code></pre>
Featured Products 
Display products that have a ‘featured’ meta key set to ‘yes’.
<pre><code>[cardcrafter-data-grids post_type="product" wp_query="meta_key=featured&meta_value=yes"]
</code></pre>
Team by Author 
Show team members created by a specific author (ID 5).
<pre><code>[cardcrafter-data-grids post_type="team" wp_query="author=5&orderby=menu_order"]
</code></pre>
Portfolio with Custom Fields (ACF) 
Map your custom fields to card elements automatically.
<pre><code>[cardcrafter-data-grids post_type="portfolio" image_field="project_image" subtitle_field="client_name"]
</code></pre>
Product with Descriptions 
Use custom fields for price and features.
<pre><code>[cardcrafter-data-grids post_type="product" subtitle_field="price" description_field="product_features"]
</code></pre>
Instant Demo 
Automatically loads team demo data with professional banner.
<pre><code>[cardcrafter-data-grids]
</code></pre>
Gutenberg Block (Recommended) 
1. Add the “CardCrafter” block to any post/page 
2. Configure your data source in the sidebar settings 
3. Choose layout, columns, and interactive features 
4. Preview updates live in the editor
Load from JSON URL 
Load data from an external JSON source.
<pre><code>[cardcrafter-data-grids source="https://example.com/team.json"]
</code></pre>
Masonry Layout 
Display cards in a Pinterest-style masonry layout.
<pre><code>[cardcrafter-data-grids source="https://example.com/products.json" layout="masonry" columns="4"]
</code></pre>
Shortcode Attributes
<ul>
<li><code>source</code> (optional) – URL of your JSON data. Omit for instant demo mode.</li>
<li><code>post_type</code> (NEW!) – WordPress post type to display (post, page, product, etc.)</li>
<li><code>wp_query</code> (NEW!) – Custom WordPress query parameters (category=news&author=5)</li>
<li><code>posts_per_page</code> (NEW!) – Number of WordPress posts to display (default: 12)</li>
<li><code>layout</code> – “grid”, “masonry”, or “list” (default: grid)</li>
<li><code>columns</code> – 2, 3, or 4 (default: 3)</li>
<li><code>items_per_page</code> – 6, 12, 24, 50, or 100 (default: 12)</li>
<li><code>image_field</code> – JSON field for image (default: image)</li>
<li><code>title_field</code> – JSON field for title (default: title)</li>
<li><code>subtitle_field</code> – JSON field for subtitle (default: subtitle)</li>
<li><code>description_field</code> – JSON field for description (default: description)</li>
<li><code>link_field</code> – JSON field for link (default: link)</li>
</ul>

CardCrafter – Data-Driven Card Grids

Transform JSON data and WordPress posts into beautiful card grids. Perfect for teams, products, portfolios, and blogs.

Ronald Huereca

Brice Capobianco

WP Plugin Info Card lets you display WordPress plugins, GitHub repositories, Easy Digital Downloads plugins, and third-party plugins in beautiful, customizable cards using blocks or shortcodes (compatible with most page builders).
Whether you are showcasing your own plugins, highlighting recommended tools, or displaying GitHub projects, WP Plugin Info Card gives you more flexibility than the default WordPress blocks by supporting multiple data sources with consistent, beautiful layouts.
It works with WordPress.org plugins and themes, GitHub repositories, Easy Digital Downloads (EDD) products, and third-party plugins, so you are not limited to a single ecosystem.
This plugin is perfect for:
<ul>
<li>Reviewers and Developers wanting to showcase projects, whether hosted on GitHub, WordPress.org, or hosted else-where and custom created.</li>
<li>WordPress contributors who’d like to display contribution badges or past contributions.</li>
<li>Users wanting more design choice and layout variation than what is offered by the Core WordPress blocks.</li>
</ul>
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/8eKDCEoXGKU?version=3&rel=0&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<h3>Why use WP Plugin Info Card?</h3>
The default WordPress Plugin/Theme blocks are limited to WordPress.org listings with a limited design. WP Plugin Info Card expands on that by allowing you to display plugin cards and project cards from multiple sources in several beautiful cards.
Use it to:
<ul>
<li>Display WordPress.org plugin cards and theme cards anywhere on your site. Customize the grids and layouts with ease, supporting both blocks and shortcodes.</li>
<li>Showcase GitHub repositories in a card-like grid, highlighting your favorite GitHub projects, or showcasing your own. Depending on the permissions of your GitHub token, this works for private repos.</li>
<li>Highlight premium or third-party plugins not listed on WordPress.org. For example, you’d like to feature a popular pro plugin. Simply fill in the plugin details, reference it by slug, and display it in a beautiful card.</li>
<li>Display plugin screenshots from a WordPress.org plugin in a responsive card with carousel and lightbox suppport.</li>
<li>Display a list of all WordPress.org plugins installed on your site, which is great for showing support and recognition towards plugin authors. This is perfect for About pages or “how it’s made” posts/pages.</li>
<li>Display plugins or themes from WordPress.org based on a query, for example, only showing plugins by your .org username, where you’re able to curate a list of plugins you contribute to in a beautiful card grid.</li>
<li>Show off your WordPress.org profile badges, which is perfect for team pages, profile pages, and about pages. Everyone loves flair.</li>
<li>Keep track of your own WordPress.org plugins/themes, with a convenient dashboard widget and friendly admin options allowing you to enter watched WordPress.org assets.</li>
</ul>
<h3>Major Features</h3>
Multiple Data Sources
Display plugin and project data from:
<ul>
<li>WordPress.org plugins and themes</li>
<li>GitHub repositories with metadata and stats</li>
<li>Easy Digital Downloads products/plugins</li>
<li>Third-party plugins and custom integrations</li>
</ul>
Blocks and Shortcodes
WP Plugin Info Card works with the Block Editor/Gutenberg, Classic Editor, and your favorite page builder:
<ul>
<li>Use Gutenberg blocks for visual editing in the block editor.</li>
<li>Use shortcodes for classic setups and page builders such as Elementor.</li>
</ul>
GitHub Info Card / GitHub Info Cards Grid Block
Show GitHub repositories using a dedicated block or shortcode. Display repository details, stats, and links in a compact yet informative card format. This is perfect for highlighting your favorite GitHub repository, showcasing your own, or even consolidating a list of multiple GitHub repositories into a responsive grid.
Plugin Screenshots Block/Shortcode
Display plugin screenshots from WordPress.org in a beautiful card featuring a responsive gallery/carousel layout with lightbox support. This is ideal for plugin landing pages, tutorials, announcements, and documentation.
Profile Badges
Display your WordPress.org profile badges to highlight contributions, plugins, and community involvement. It supports dynamic and custom (user-selected) badges. These are perfect for About, Team, and Profile pages.
Third-party Plugin Support with Optional REST Support
Add plugins that are not hosted on WordPress.org, including premium and private plugins. Showcase these using the blocks/shortcodes that come with WP Plugin Info Card. Optional REST support means that if you’re a third-party plugin provider, you can add your custom plugin, enable a REST endpoint, and let others automatically download your details to their own install, and have it updated automatically.
Performance Friendly
<ul>
<li>Uses transients for caching and lazy-loading where needed.</li>
<li>Uses local options and post types for data storage/easier parsing/less custom tables.</li>
<li>Optimized for front-end performance, with things only loading where needed.</li>
</ul>
<h3>Quick Links (Shortcode Documentation)</h3>
<ul>
<li><a href="https://wppic.dlxplugins.com/shortcodes/wp-pic" rel="nofollow ugc">[wp-pic] shortcode and parameters</a>.</li>
<li><a href="https://wppic.dlxplugins.com/shortcodes/wp-pic-query" rel="nofollow ugc">[wp-pic-query] shortcode and parameters</a>.</li>
<li><a href="https://wppic.dlxplugins.com/shortcodes/wp-pic-site-plugins" rel="nofollow ugc">[wp-pic-site-plugins] shortcode and parameters</a>.</li>
<li><a href="https://wppic.dlxplugins.com/shortcodes/wp-pic-plugin-screenshots" rel="nofollow ugc">[wp-pic-plugin-screenshots] shortcode and parameters</a>.</li>
<li><a href="https://docs.dlxplugins.com/wp-plugin-info-card/shortcodes/github-info-card" rel="nofollow ugc">[github-info-card] shortcode and parameters</a>.</li>
<li><a href="https://docs.dlxplugins.com/wp-plugin-info-card/shortcodes/wp-pic-badges" rel="nofollow ugc">[wp-pic-badges] shortcode and parameters</a>.</li>
</ul>
<h3>Quick Links (Block Documentation)</h3>
<ul>
<li><a href="https://wppic.dlxplugins.com/blocks/wp-plugin-info-card-block" rel="nofollow ugc">WP Plugin Info Card block</a>.</li>
<li><a href="https://wppic.dlxplugins.com/blocks/wp-plugin-info-card-query-block" rel="nofollow ugc">WP Plugin Info Card Query block</a>.</li>
<li><a href="https://wppic.dlxplugins.com/blocks/site-plugins-card-grid" rel="nofollow ugc">Site Plugins Card Grid block</a>.</li>
<li><a href="https://wppic.dlxplugins.com/blocks/plugin-screenshots-info-card" rel="nofollow ugc">WP Plugin Info Card Plugin Screenshots block</a>.</li>
<li><a href="https://docs.dlxplugins.com/wp-plugin-info-card/blocks/the-github-info-cards-block" rel="nofollow ugc">GitHub Info Cards Grid block</a>.</li>
<li><a href="https://docs.dlxplugins.com/wp-plugin-info-card/blocks/badges-block" rel="nofollow ugc">Profile Badges Block</a>.</li>
</ul>
<h3>When should I use this plugin?</h3>
WP Plugin Info Card is ideal if you want to:
<ul>
<li>Showcase your WordPress plugins on your website</li>
<li>Display GitHub repositories on your site</li>
<li>Display and highlight premium or third-party plugins</li>
<li>Build consistent and beautiful cards with customizable layouts</li>
<li>Add .org features like plugin screenshots or profile badges to your site</li>
</ul>
<a href="http://b-website.com/wp-envato-affiliate-card-powered-envato-market-api" title="WP Envato Affiliate Card" rel="nofollow ugc">PREMIUM ADD-ON – WP Envato Affiliate Card</a>
<h3>GitHub</h3>
Feel free to make pull requests or issues on the <a href="https://github.com/dlxplugins/wp-plugin-info-card" rel="nofollow ugc">WP Plugin Info Card GitHub account</a>.
<blockquote>
Credits: Originally developed and maintained by <a href="https://www.b-website.com/" rel="nofollow ugc">Brice CAPOBIANCO</a>.
</blockquote>
<h3>How can I report security bugs?</h3>
You can report security bugs through the Patchstack Vulnerability Disclosure Program. The Patchstack team help validate, triage and handle any security vulnerabilities. <a href="https://patchstack.com/database/vdp/wp-plugin-info-card" rel="nofollow ugc">Report a security vulnerability.</a>

WP Plugin Info Card

very handy and cool style! Like it! At least a widget would be nice.



Amazing!

I'm truly thankful to you for making such an awesome looking plugin. Please don't let this plugin to die without any update or patches. I personally think you should release a pro version of this plugin over codecanyon. As a developer myself I know how hard it is to spend time for free plugins. If you make a pro version of this plugin, I would be more than happy to buy it.
Also after playing with this plugin a bit I will send you a donation (if you accept that) for keep updating this awesome plugin and not let it die. Please keep this plugin updated with new patch or release a paid version. :)
Keep up the good work brother.



Thanks for making such awesome plugin

If you need to show some data about WP plugins, it’s a very good solution with a nice output and some useful functions.

Very good

Fantastic job, you saved me a lot of time with this plugin!
Thank you!

Fantastic!

I was happy to find this plugin! Made adding my own plugin's card to my website straight forward and got to focus on styling more than the API to pull the info.

Very happy :)

Super handy!

L'extension fait parfaitement le travail ! 

- Système simple pour surcharger les template
- Shortcode très bien fournis en options
- Blocs Gutenberg 

Perfect !

Add beautiful, customizable cards to showcase plugins, themes, and projects from WordPress.org, GitHub, EDD, and third-party plugins.

CardCrafter – Data-Driven Card Grids vs WP Plugin Info Card