Skip to content

Commit 2dcb007

Browse files
committed
post-meta-testimonial example
1 parent 8e31f74 commit 2dcb007

27 files changed

+1024
-0
lines changed
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
# This file is for unifying the coding style for different editors and IDEs
2+
# editorconfig.org
3+
4+
# WordPress Coding Standards
5+
# https://make.wordpress.org/core/handbook/coding-standards/
6+
7+
root = true
8+
9+
[*]
10+
charset = utf-8
11+
end_of_line = lf
12+
insert_final_newline = true
13+
trim_trailing_whitespace = true
14+
indent_style = tab
15+
16+
[*.{yml,yaml}]
17+
indent_style = space
18+
indent_size = 2
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
8+
# Coverage directory used by tools like istanbul
9+
coverage
10+
11+
# Compiled binary addons (https://nodejs.org/api/addons.html)
12+
build/Release
13+
14+
# Dependency directories
15+
node_modules/
16+
17+
# Optional npm cache directory
18+
.npm
19+
20+
# Optional eslint cache
21+
.eslintcache
22+
23+
# Output of `npm pack`
24+
*.tgz
25+
26+
# Output of `wp-scripts plugin-zip`
27+
*.zip
28+
29+
# dotenv environment variables file
30+
.env
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# Post Meta Testimonial
2+
3+
This example adds a testimonial block that allows users to add and manage testimonial content with custom post metadata in the Block Editor.
4+
5+
> [!NOTE]
6+
> This example is explained step by step in the post [Creating a custom block that stores post meta](https://developer.wordpress.org/news/2023/03/creating-a-custom-block-that-stores-post-meta/)
7+
8+
<!-- Please, do not remove these @TABLE EXAMPLES BEGIN and @TABLE EXAMPLES END comments or modify the table inside. This table is automatically generated from the data at _data/examples.json and _data/tags.json -->
9+
<!-- @TABLE EXAMPLES BEGIN -->
10+
11+
| Example | <span style="display: inline-block; width:250px">Description</span> | Tags | Download .zip | Live Demo |
12+
| ------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
13+
| [Post Meta Testimonial](https://github.com/WordPress/block-development-examples/tree/trunk/plugins/post-meta-testimonial) | Shows how to create a testimonial block that uses post meta data to store and display testimonial information. | <small><code><a href="https://WordPress.github.io/block-development-examples/?tags=meta">meta</a></code></small> <small><code><a href="https://WordPress.github.io/block-development-examples/?tags=block">block</a></code></small> | [📦](https://github.com/WordPress/block-development-examples/releases/download/latest/post-meta-testimonial.zip 'Install the plugin on any WordPress site using this zip and activate it to see the example in action') | [![](https://raw.githubusercontent.com/WordPress/block-development-examples/trunk/_assets/icon-wp.svg)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/WordPress/block-development-examples/trunk/plugins/post-meta-testimonial/_playground/blueprint.json 'Click here to access a live demo of this example') |
14+
15+
<!-- @TABLE EXAMPLES END -->
16+
17+
## Overview
18+
19+
This example demonstrates how to create a custom block that manages testimonial content using post metadata. The block allows users to add testimonial-specific information such as the author's name, role, and testimonial content directly within the Block Editor.
20+
21+
The plugin showcases:
22+
23+
- How to register and use custom post meta fields with blocks
24+
- Implementation of a custom block with metadata support
25+
- Integration with the Block Editor's components and controls
26+
- Best practices for handling and displaying testimonial data
27+
28+
## Related resources
29+
30+
- [Block Editor Handbook](https://developer.wordpress.org/block-editor/)
31+
- [Using Post Meta Data](https://developer.wordpress.org/block-editor/how-to-guides/metabox/)
32+
- [`register_post_meta`](https://developer.wordpress.org/reference/functions/register_post_meta/) documentation
33+
- [Block Controls](https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/block-controls-toolbar-and-sidebar/)
34+
35+
---
36+
37+
> **Note**
38+
> Check the [Start Guide for local development with the examples](https://github.com/WordPress/block-development-examples/wiki/Examples#start-guide-for-local-development-with-the-examples)
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
{
2+
"$schema": "https://schemas.wp.org/trunk/block.json",
3+
"apiVersion": 3,
4+
"name": "tutorial/post-meta-testimonial",
5+
"version": "0.1.0",
6+
"title": "Post Meta Testimonial",
7+
"category": "text",
8+
"icon": "format-quote",
9+
"description": "A block quote style testimonial that saves to post meta.",
10+
"example": {
11+
"attributes": {
12+
"authorName": "WordPress",
13+
"authorURL": "developer.wordpress.org/news"
14+
}
15+
},
16+
"attributes": {
17+
"authorName": {
18+
"type": "string"
19+
},
20+
"authorURL": {
21+
"type": "string"
22+
}
23+
},
24+
"usesContext": [
25+
"postId",
26+
"postType"
27+
],
28+
"supports": {
29+
"html": false,
30+
"multiple": false
31+
},
32+
"textdomain": "post-meta-testimonial",
33+
"editorScript": "file:./index.js",
34+
"editorStyle": "file:./index.css",
35+
"style": "file:./style-index.css",
36+
"render": "file:./render.php",
37+
"viewScript": "file:./view.js"
38+
}
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/*!**************************************************************************************************************************************************************************************************************************************************************!*\
2+
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/post-meta-testimonial/editor.scss ***!
3+
\**************************************************************************************************************************************************************************************************************************************************************/
4+
/**
5+
* The following styles get applied inside the editor only.
6+
*
7+
* Replace them with your own styles or remove the file completely.
8+
*/
9+
.wp-block-tutorial-post-meta-testimonial {
10+
border: 1px dotted #f00;
11+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-core-data', 'wp-i18n'), 'version' => 'ad1fa289c8661a8cb6a1');

plugins/post-meta-testimonial/build/post-meta-testimonial/index.css

Lines changed: 13 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

plugins/post-meta-testimonial/build/post-meta-testimonial/index.css.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)