Fix character encoding issues across the docs site (#45518)
* Fix character encoding issues across the docs site * Fix manifest
This commit is contained in:
parent
0e64d563cb
commit
9f7e019d02
|
@ -350,7 +350,7 @@
|
||||||
{
|
{
|
||||||
"post_title": "Logging in WooCommerce",
|
"post_title": "Logging in WooCommerce",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/logging.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/logging.md",
|
||||||
"hash": "7f5777df46d83e49b024ae205111e0a0960d8c53466d351a8744999d256cb0c0",
|
"hash": "14deebc3eaaf821ade3f84b5b16d154b36b4cceae59b04b6cb18f6ba9588fa56",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/logging.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/logging.md",
|
||||||
"id": "c684e2efba45051a4e1f98eb5e6ef6bab194f25c"
|
"id": "c684e2efba45051a4e1f98eb5e6ef6bab194f25c"
|
||||||
},
|
},
|
||||||
|
@ -386,7 +386,7 @@
|
||||||
"menu_title": "Implement merchant onboarding",
|
"menu_title": "Implement merchant onboarding",
|
||||||
"tags": "how-to",
|
"tags": "how-to",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/handling-merchant-onboarding.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/handling-merchant-onboarding.md",
|
||||||
"hash": "238d7b7d6b52bbf1840bf2e264d0724cde220f6dab343e7620fee1a7fd715c08",
|
"hash": "e5fd467caece98bb1d18a5d150c375b2c575cb956980a7054b89b3cfcfbcdae9",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/handling-merchant-onboarding.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/handling-merchant-onboarding.md",
|
||||||
"id": "89fe15dc232379f546852822230c334d3d940b93",
|
"id": "89fe15dc232379f546852822230c334d3d940b93",
|
||||||
"links": {
|
"links": {
|
||||||
|
@ -458,7 +458,7 @@
|
||||||
"menu_title": "Build your first extension",
|
"menu_title": "Build your first extension",
|
||||||
"tags": "how-to",
|
"tags": "how-to",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/building-your-first-extension.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/extension-development/building-your-first-extension.md",
|
||||||
"hash": "6b3af5e8e96294df9625e843654adddcf97b26c81ec43b47c41be2b2ad835783",
|
"hash": "6c97092279436171fa847119ea8813a35b8ad7b8784bc3c993236648687064c1",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/building-your-first-extension.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/extension-development/building-your-first-extension.md",
|
||||||
"id": "278c2822fe06f1ab72499a757ef0c4981cfbffb5"
|
"id": "278c2822fe06f1ab72499a757ef0c4981cfbffb5"
|
||||||
},
|
},
|
||||||
|
@ -1004,7 +1004,7 @@
|
||||||
"post_title": "User Experience Guidelines - Payments Onboarding and Setup",
|
"post_title": "User Experience Guidelines - Payments Onboarding and Setup",
|
||||||
"menu_title": "Payments Onboarding and Setup",
|
"menu_title": "Payments Onboarding and Setup",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payments-onboarding.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payments-onboarding.md",
|
||||||
"hash": "b627aa75171e4ba4a7f9802a09df2de4026b1496ca2c448693abf010480ec0eb",
|
"hash": "aa2429f5322cb3f4e2168117e7c42cd3a090fc2665c6e09264a0d69c03216c9c",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payments-onboarding.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payments-onboarding.md",
|
||||||
"id": "9e100f5d1c5e52bb337a294456f75cd60929d9e3"
|
"id": "9e100f5d1c5e52bb337a294456f75cd60929d9e3"
|
||||||
},
|
},
|
||||||
|
@ -1012,7 +1012,7 @@
|
||||||
"post_title": "User Experience Guidelines - Payment Button Style",
|
"post_title": "User Experience Guidelines - Payment Button Style",
|
||||||
"menu_title": "Payment Button Style",
|
"menu_title": "Payment Button Style",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-style.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-style.md",
|
||||||
"hash": "ddaf6af31bbbba2e03feb852b650ac442d7937c7437464eeef1418c4c421939e",
|
"hash": "f302ec65394f21436f5886263f95aa8b24f7b3dc67a65ce7f6c0704923337612",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-style.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-style.md",
|
||||||
"id": "83d869cec0b2268ae30a6517c7c8f424de284cad"
|
"id": "83d869cec0b2268ae30a6517c7c8f424de284cad"
|
||||||
},
|
},
|
||||||
|
@ -1020,7 +1020,7 @@
|
||||||
"post_title": "User Experience Guidelines - Payment Button Size and Anatomy",
|
"post_title": "User Experience Guidelines - Payment Button Size and Anatomy",
|
||||||
"menu_title": "Payment Button Size",
|
"menu_title": "Payment Button Size",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-size.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-size.md",
|
||||||
"hash": "bec66a7aae90a2995d948f27510a12978f48676cf440fc3ac5c07db9f9d9de4b",
|
"hash": "f369880a1e4cc0841820c1ec690aac46ac4629cd105f8405f18d755a2346ba8e",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-size.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-size.md",
|
||||||
"id": "0920df1611e1b1b3e2f33c810a8f8e8ae09dd67c"
|
"id": "0920df1611e1b1b3e2f33c810a8f8e8ae09dd67c"
|
||||||
},
|
},
|
||||||
|
@ -1028,7 +1028,7 @@
|
||||||
"post_title": "User Experience Guidelines - Payment Button Layout",
|
"post_title": "User Experience Guidelines - Payment Button Layout",
|
||||||
"menu_title": "Payment Button Layout",
|
"menu_title": "Payment Button Layout",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-layout.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/ux-guidelines-payments/payment-button-layout.md",
|
||||||
"hash": "59b75f884b59d42f4950543a255afa4297e6aeec918fa86b57cfbe56a79461cc",
|
"hash": "c1a2014232650e5dcf2a37288df2c7a552a6e69e4919dd3ce27c71ff28175c2c",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-layout.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/ux-guidelines-payments/payment-button-layout.md",
|
||||||
"id": "96caecc340794e5c80af271e5cc844e0b3d80a04"
|
"id": "96caecc340794e5c80af271e5cc844e0b3d80a04"
|
||||||
}
|
}
|
||||||
|
@ -1175,7 +1175,7 @@
|
||||||
"menu_title": "Commands",
|
"menu_title": "Commands",
|
||||||
"tags": "reference",
|
"tags": "reference",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/wc-cli/wc-cli-commands.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/wc-cli/wc-cli-commands.md",
|
||||||
"hash": "b928cc77a9ff6bfb023b35f16989a0cdfb5e1a4877679aa61e894e9d0318d4eb",
|
"hash": "a926ff45642539e0edc6b4e3dfeba4b31c2d01082700af132a2e8d56cfa25ec5",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/wc-cli/wc-cli-commands.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/wc-cli/wc-cli-commands.md",
|
||||||
"id": "73d6bc6468d23a9e93d16d574399105b143e43af"
|
"id": "73d6bc6468d23a9e93d16d574399105b143e43af"
|
||||||
},
|
},
|
||||||
|
@ -1196,7 +1196,7 @@
|
||||||
"menu_title": "Frequently Asked Questions",
|
"menu_title": "Frequently Asked Questions",
|
||||||
"tags": "reference",
|
"tags": "reference",
|
||||||
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/wc-cli/cli-faq.md",
|
"edit_url": "https://github.com/woocommerce/woocommerce/edit/trunk/docs/wc-cli/cli-faq.md",
|
||||||
"hash": "f33cd9e92983e4351b7d3df23290391b6815673dd02b2843b23b4babb02c06a4",
|
"hash": "cdf02b0a30693f3659f26a774953cb56c85e0319c9472447a4b9563ac3d9b2a4",
|
||||||
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/wc-cli/cli-faq.md",
|
"url": "https://raw.githubusercontent.com/woocommerce/woocommerce/trunk/docs/wc-cli/cli-faq.md",
|
||||||
"id": "86857f8924e3bd3fe6fdcc06cd8f4351f5e6f4c1"
|
"id": "86857f8924e3bd3fe6fdcc06cd8f4351f5e6f4c1"
|
||||||
}
|
}
|
||||||
|
@ -1204,5 +1204,5 @@
|
||||||
"categories": []
|
"categories": []
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"hash": "494b0c55a9312202c17bf17b4e50f1f574790788c1606be4c61c99ad479b279a"
|
"hash": "54c558ffb682cee4ce5f81069690e47439b174cffac8e4d0950d014145dcad9e"
|
||||||
}
|
}
|
|
@ -7,22 +7,22 @@ tags: how-to
|
||||||
|
|
||||||
This guide will teach you how to use [create-woo-extension](https://www.npmjs.com/package/@woocommerce/create-woo-extension) to scaffold a WooCommerce extension. There are various benefits to using create-woo-extension over manually creating one from scratch, including:
|
This guide will teach you how to use [create-woo-extension](https://www.npmjs.com/package/@woocommerce/create-woo-extension) to scaffold a WooCommerce extension. There are various benefits to using create-woo-extension over manually creating one from scratch, including:
|
||||||
|
|
||||||
There’s less boilerplate code to write, and less dependencies to manually setup
|
There's less boilerplate code to write, and less dependencies to manually setup
|
||||||
Modern features such as Blocks are automatically supported
|
Modern features such as Blocks are automatically supported
|
||||||
Unit testing, linting, and Prettier IDE configuration are ready to use
|
Unit testing, linting, and Prettier IDE configuration are ready to use
|
||||||
|
|
||||||
Once your extension is set up, we’ll show you how to instantly spin up a development environment using [wp-env](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/).
|
Once your extension is set up, we'll show you how to instantly spin up a development environment using [wp-env](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/).
|
||||||
|
|
||||||
## Requirements
|
## Requirements
|
||||||
|
|
||||||
Before getting started, you’ll need the following tools installed on your device:
|
Before getting started, you'll need the following tools installed on your device:
|
||||||
|
|
||||||
|
|
||||||
- [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs) with NPM
|
- [Node.js](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs) with NPM
|
||||||
- [Docker](https://docs.docker.com/engine/install/) (must be running to use wp-env)
|
- [Docker](https://docs.docker.com/engine/install/) (must be running to use wp-env)
|
||||||
- [Composer](https://getcomposer.org/doc/00-intro.md)
|
- [Composer](https://getcomposer.org/doc/00-intro.md)
|
||||||
|
|
||||||
This guide also presumes you’re familiar with working with the command line.
|
This guide also presumes you're familiar with working with the command line.
|
||||||
|
|
||||||
## Bootstrapping Your Extension
|
## Bootstrapping Your Extension
|
||||||
|
|
||||||
|
@ -33,29 +33,29 @@ Open your terminal and run
|
||||||
@woocommerce/create-woo-extension my-extension-name
|
@woocommerce/create-woo-extension my-extension-name
|
||||||
```
|
```
|
||||||
|
|
||||||
If you’d like to set a custom extension name, you can replace `my-extension-name` with any slug. Please note that your slug must not have any spaces.
|
If you'd like to set a custom extension name, you can replace `my-extension-name` with any slug. Please note that your slug must not have any spaces.
|
||||||
|
|
||||||
If you see a prompt similar to Need to install the following packages: `@wordpress/create-block@4.34.0. Ok to proceed?`, press `Y`.
|
If you see a prompt similar to Need to install the following packages: `@wordpress/create-block@4.34.0. Ok to proceed?`, press `Y`.
|
||||||
|
|
||||||
|
|
||||||
Once the package finishes generating your extension, navigate into the extension’s folder using
|
Once the package finishes generating your extension, navigate into the extension's folder using
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
cd my-extension-name
|
cd my-extension-name
|
||||||
```
|
```
|
||||||
|
|
||||||
You should then install your extension’s dependencies using `npm install` and build it using `npm run build`.
|
You should then install your extension's dependencies using `npm install` and build it using `npm run build`.
|
||||||
|
|
||||||
Congratulations! You just spun up a WooCommerce extension! Your extension will have the following file structure:
|
Congratulations! You just spun up a WooCommerce extension! Your extension will have the following file structure:
|
||||||
|
|
||||||
- `my-extension-name`
|
- `my-extension-name`
|
||||||
- `block.json` - contains metadata used to register your custom blocks with WordPress. Learn more.
|
- `block.json` - contains metadata used to register your custom blocks with WordPress. Learn more.
|
||||||
- `build` - the built version of your extension which is generated using npm run build. You shouldn’t directly modify any of the files in this folder.
|
- `build` - the built version of your extension which is generated using npm run build. You shouldn't directly modify any of the files in this folder.
|
||||||
- `composer.json` - contains a list of your PHP dependencies which is referenced by Composer.
|
- `composer.json` - contains a list of your PHP dependencies which is referenced by Composer.
|
||||||
- `composer.lock` - this file allows you to control when and how to update these dependencies
|
- `composer.lock` - this file allows you to control when and how to update these dependencies
|
||||||
- `includes` - The primary purpose of an "includes" folder in PHP development is to store reusable code or files that need to be included or required in multiple parts of a project. This is a PHP developer convention.
|
- `includes` - The primary purpose of an "includes" folder in PHP development is to store reusable code or files that need to be included or required in multiple parts of a project. This is a PHP developer convention.
|
||||||
- `languages` - contains POT files that are used to localize your plugin.
|
- `languages` - contains POT files that are used to localize your plugin.
|
||||||
- `my-extension-name.php` - your plugin’s entry point that registers your plugin with WordPress.
|
- `my-extension-name.php` - your plugin's entry point that registers your plugin with WordPress.
|
||||||
- `node-modules` - help you form the building blocks of your application and write more structured code
|
- `node-modules` - help you form the building blocks of your application and write more structured code
|
||||||
- `package.json` - is considered the heart of a Node project. It records metadata, and installs functional dependencies, runs scripts, and defines the entry point of your application.
|
- `package.json` - is considered the heart of a Node project. It records metadata, and installs functional dependencies, runs scripts, and defines the entry point of your application.
|
||||||
- `README.md` - An introduction and instructional overview of your application. Any special instructions, updates from the author, and details about the application can be written in text here.
|
- `README.md` - An introduction and instructional overview of your application. Any special instructions, updates from the author, and details about the application can be written in text here.
|
||||||
|
@ -67,20 +67,20 @@ Congratulations! You just spun up a WooCommerce extension! Your extension will h
|
||||||
|
|
||||||
## Setting Up a Developer Environment
|
## Setting Up a Developer Environment
|
||||||
|
|
||||||
We recommend using `wp-env` to spin up local development environments. You can [learn more about wp-env here](https://make.wordpress.org/core/2020/03/03/wp-env-simple-local-environments-for-wordpress/). If you don’t already have wp-env installed locally, you can install it using
|
We recommend using `wp-env` to spin up local development environments. You can [learn more about wp-env here](https://make.wordpress.org/core/2020/03/03/wp-env-simple-local-environments-for-wordpress/). If you don't already have wp-env installed locally, you can install it using
|
||||||
`npm -g i @wordpress/env`.
|
`npm -g i @wordpress/env`.
|
||||||
|
|
||||||
Once you’ve installed `wp-env`, and while still inside your `my-extension-name` folder, run `wp-env` start. After a few seconds, a test WordPress site with your WooCommerce and your extension installed will be running on `localhost:8888`.
|
Once you've installed `wp-env`, and while still inside your `my-extension-name` folder, run `wp-env` start. After a few seconds, a test WordPress site with your WooCommerce and your extension installed will be running on `localhost:8888`.
|
||||||
|
|
||||||
If you didn’t set a custom name for your extension, you can visit [here](http://localhost:8888/wp-admin/admin.php?page=wc-admin&path=%2Fmy-extension-name) to see the settings page generated by /src/index.js. The default username/password combination for `wp-env` is `admin` / `password`.
|
If you didn't set a custom name for your extension, you can visit [here](http://localhost:8888/wp-admin/admin.php?page=wc-admin&path=%2Fmy-extension-name) to see the settings page generated by /src/index.js. The default username/password combination for `wp-env` is `admin` / `password`.
|
||||||
|
|
||||||
## Next Steps
|
## Next Steps
|
||||||
|
|
||||||
Now that you’ve bootstrapped your extension, it’s time to add some features! Here’s some simple ones you could include:
|
Now that you've bootstrapped your extension, it's time to add some features! Here's some simple ones you could include:
|
||||||
|
|
||||||
[How to add a custom field to simple and variable products](https://developer.woo.com/docs/how-to-add-a-custom-field-to-simple-and-variable-products/)
|
[How to add a custom field to simple and variable products](https://developer.woo.com/docs/how-to-add-a-custom-field-to-simple-and-variable-products/)
|
||||||
|
|
||||||
## Reference
|
## Reference
|
||||||
|
|
||||||
[Visit @woocommerce/create-woo-extension on NPM for package reference](https://www.npmjs.com/package/@woocommerce/create-woo-extension)
|
[Visit @woocommerce/create-woo-extension on NPM for package reference](https://www.npmjs.com/package/@woocommerce/create-woo-extension)
|
||||||
[Check out wp-env’s command reference to learn more about advanced functionality](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/#command-reference)
|
[Check out wp-env's command reference to learn more about advanced functionality](https://developer.wordpress.org/block-editor/reference-guides/packages/packages-env/#command-reference)
|
||||||
|
|
|
@ -23,7 +23,7 @@ Setup tasks appear on the WooCommerce Admin home screen and prompt a merchant to
|
||||||
|
|
||||||
### Registering the task with PHP
|
### Registering the task with PHP
|
||||||
|
|
||||||
To register your task as an extended task list item, you’ll need to start by creating a new PHP class that extends the Task class. This class will define the properties and behavior of your custom task.
|
To register your task as an extended task list item, you'll need to start by creating a new PHP class that extends the Task class. This class will define the properties and behavior of your custom task.
|
||||||
|
|
||||||
```php
|
```php
|
||||||
<?php
|
<?php
|
||||||
|
@ -148,7 +148,7 @@ registerPlugin( 'add-task-list-item', {
|
||||||
} );
|
} );
|
||||||
```
|
```
|
||||||
|
|
||||||
In the example above, the extension does a few different things. Let’s break it down:
|
In the example above, the extension does a few different things. Let's break it down:
|
||||||
|
|
||||||
#### Handle imports
|
#### Handle imports
|
||||||
|
|
||||||
|
@ -165,7 +165,7 @@ import { registerPlugin } from '@wordpress/plugins';
|
||||||
|
|
||||||
#### Construct the component
|
#### Construct the component
|
||||||
|
|
||||||
Next, we create a [functional component](https://reactjs.org/docs/components-and-props.html) that returns our task card. The intermixed JavaScript/HTML syntax we’re using here is called JSX. If you’re unfamiliar with it, you can [read more about it in the React docs](https://reactjs.org/docs/introducing-jsx.html).
|
Next, we create a [functional component](https://reactjs.org/docs/components-and-props.html) that returns our task card. The intermixed JavaScript/HTML syntax we're using here is called JSX. If you're unfamiliar with it, you can [read more about it in the React docs](https://reactjs.org/docs/introducing-jsx.html).
|
||||||
|
|
||||||
```js
|
```js
|
||||||
const Task = ( { onComplete, task } ) => {
|
const Task = ( { onComplete, task } ) => {
|
||||||
|
@ -207,7 +207,7 @@ In the example above, we're using the `Card` and `CardBody` components to constr
|
||||||
|
|
||||||
#### Register the Plugin for Task Content
|
#### Register the Plugin for Task Content
|
||||||
|
|
||||||
Next, we register the Task component as a plugin named "add-task-content" using [SlotFills](https://developer.wordpress.org/block-editor/reference-guides/slotfills/). This plugin nests the Task component within a WooOnboardingTask component and passes the necessary properties. We also specify the scope of the plugin as "woocommerce-tasks" to make it effective only within WooCommerce’s task list.
|
Next, we register the Task component as a plugin named "add-task-content" using [SlotFills](https://developer.wordpress.org/block-editor/reference-guides/slotfills/). This plugin nests the Task component within a WooOnboardingTask component and passes the necessary properties. We also specify the scope of the plugin as "woocommerce-tasks" to make it effective only within WooCommerce's task list.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
registerPlugin( 'add-task-content', {
|
registerPlugin( 'add-task-content', {
|
||||||
|
@ -227,7 +227,7 @@ registerPlugin( 'add-task-content', {
|
||||||
|
|
||||||
#### Register the Plugin for Task List Item Customization
|
#### Register the Plugin for Task List Item Customization
|
||||||
|
|
||||||
Finally, we register another plugin named "my-task-list-item-plugin." This plugin is used to customize the appearance of task list items. It also targets WooCommerce’s task list and wraps the DefaultTaskItem component within a custom wrapper with additional styling.
|
Finally, we register another plugin named "my-task-list-item-plugin." This plugin is used to customize the appearance of task list items. It also targets WooCommerce's task list and wraps the DefaultTaskItem component within a custom wrapper with additional styling.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
registerPlugin( 'my-task-list-item-plugin', {
|
registerPlugin( 'my-task-list-item-plugin', {
|
||||||
|
@ -250,11 +250,11 @@ registerPlugin( 'my-task-list-item-plugin', {
|
||||||
} );
|
} );
|
||||||
```
|
```
|
||||||
|
|
||||||
In summary, the JavaScript file for a simple task extends and customizes the functionality of WooCommerce’s task list, allowing users to better manage tasks and personalize the appearance of task list items.
|
In summary, the JavaScript file for a simple task extends and customizes the functionality of WooCommerce's task list, allowing users to better manage tasks and personalize the appearance of task list items.
|
||||||
|
|
||||||
### Registering the task with JavaScript
|
### Registering the task with JavaScript
|
||||||
|
|
||||||
In addition to registering the task in php, you’ll also need to register and enqueue the transpiled JavaScript file containing your task component and its configuration. A common way to do this is to create a dedicated registration function that hooks into the `admin_enqueue_scripts` action in WordPress. Below is an annotated example of how this registration might look:
|
In addition to registering the task in php, you'll also need to register and enqueue the transpiled JavaScript file containing your task component and its configuration. A common way to do this is to create a dedicated registration function that hooks into the `admin_enqueue_scripts` action in WordPress. Below is an annotated example of how this registration might look:
|
||||||
|
|
||||||
```php
|
```php
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -136,13 +136,13 @@ wc_get_logger()->info(
|
||||||
|
|
||||||
### When _not_ to use logging
|
### When _not_ to use logging
|
||||||
|
|
||||||
* To let a developer know that they’re using a method or API incorrectly. This can lead to a large volume of useless log entries, especially if it will get triggered on every page request. Better to give them immediate feedback in the form of an error or exception (e.g. `wc_doing_it_wrong()`).
|
* To let a developer know that they're using a method or API incorrectly. This can lead to a large volume of useless log entries, especially if it will get triggered on every page request. Better to give them immediate feedback in the form of an error or exception (e.g. `wc_doing_it_wrong()`).
|
||||||
|
|
||||||
### Best practices
|
### Best practices
|
||||||
|
|
||||||
* Rather than using the `WC_Logger`‘s `log()` method directly, it’s better to use one of the wrapper methods that’s specific to the log level. E.g. `info()` or `error()`.
|
* Rather than using the `WC_Logger`‘s `log()` method directly, it's better to use one of the wrapper methods that's specific to the log level. E.g. `info()` or `error()`.
|
||||||
* Write a message that is a complete, coherent sentence. This will make it more useful for people who aren’t familiar with the codebase.
|
* Write a message that is a complete, coherent sentence. This will make it more useful for people who aren't familiar with the codebase.
|
||||||
* Log messages should not be translatable (see the discussion about this in the comments). Keeping the message in English makes it easier to search for solutions based on the message contents, and also makes it easier for Happiness Engineers to understand what’s happening, since they may not speak the same language as the site owner.
|
* Log messages should not be translatable (see the discussion about this in the comments). Keeping the message in English makes it easier to search for solutions based on the message contents, and also makes it easier for Happiness Engineers to understand what's happening, since they may not speak the same language as the site owner.
|
||||||
* Ideally, each log entry message should be a single line (i.e. no line breaks within the message string). Additional lines or extra data should be put in the context array.
|
* Ideally, each log entry message should be a single line (i.e. no line breaks within the message string). Additional lines or extra data should be put in the context array.
|
||||||
* Avoid outputting structured data in the message string. Put it in a key in the context array instead. The logger will handle converting it to JSON and making it legible in the log viewer.
|
* Avoid outputting structured data in the message string. Put it in a key in the context array instead. The logger will handle converting it to JSON and making it legible in the log viewer.
|
||||||
* If you need to include a stack trace, let the logger generate it for you.
|
* If you need to include a stack trace, let the logger generate it for you.
|
||||||
|
|
|
@ -38,13 +38,13 @@ tags: reference
|
||||||
|
|
||||||
- Check for typos and verify the command syntax with --help. If the issue persists, consult the Command Reference or seek support from the WooCommerce community.
|
- Check for typos and verify the command syntax with --help. If the issue persists, consult the Command Reference or seek support from the WooCommerce community.
|
||||||
|
|
||||||
**What do I do if I get 404 errors when using commands?
|
### What do I do if I get 404 errors when using commands?
|
||||||
|
|
||||||
If you are getting a 401 error like `Error: Sorry, you cannot list resources. {"status":401}`, you are trying to use the command unauthenticated. The WooCommerce CLI as of 3.0 requires you to provide a proper user to run the action as. Pass in your user ID using the `--user` flag.
|
If you are getting a 401 error like `Error: Sorry, you cannot list resources. {"status":401}`, you are trying to use the command unauthenticated. The WooCommerce CLI as of 3.0 requires you to provide a proper user to run the action as. Pass in your user ID using the `--user` flag.
|
||||||
|
|
||||||
### I am trying to update a list of X, but it’s not saving
|
### I am trying to update a list of X, but it's not saving
|
||||||
|
|
||||||
Some ‘lists’ are actually objects. For example, if you want to set categories for a product, the REST API expects an array of objects.
|
Some ‘lists' are actually objects. For example, if you want to set categories for a product, the REST API expects an array of objects.
|
||||||
|
|
||||||
To set this you would use JSON like this:
|
To set this you would use JSON like this:
|
||||||
|
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue