From 50f0aaf86ae94f4bf88c1f77f8871b76932dcf04 Mon Sep 17 00:00:00 2001 From: Fellyph Cintra Date: Tue, 9 Dec 2025 17:32:11 -0300 Subject: [PATCH 1/2] removing references from github proxy --- .../docs/main/guides/for-plugin-developers.md | 34 +- .../main/guides/for-plugin-developers.md | 176 ++++---- .../main/guides/for-plugin-developers.md | 295 +++++++++---- .../main/guides/for-plugin-developers.md | 196 ++++++--- .../main/guides/for-plugin-developers.md | 388 +++++++++++++++++- 5 files changed, 850 insertions(+), 239 deletions(-) diff --git a/packages/docs/site/docs/main/guides/for-plugin-developers.md b/packages/docs/site/docs/main/guides/for-plugin-developers.md index 2630068850..c72ee938c6 100644 --- a/packages/docs/site/docs/main/guides/for-plugin-developers.md +++ b/packages/docs/site/docs/main/guides/for-plugin-developers.md @@ -50,19 +50,13 @@ Blueprints can be passed to a Playground instance [in several ways](/blueprints/ A plugin stored in a GitHub repository can also be loaded in a Playground instance via Blueprints. -With the `pluginData` property of the [`installPlugin` blueprint step](/blueprints/steps#installPlugin), you can define a [`url` resource](/blueprints/steps/resources#urlreference) that points to the location of the `.zip` file containing the plugin you want to load in the Playground instance. - -To avoid CORS issues, the Playground project provides a [GitHub proxy](https://playground.wordpress.net/proxy) that allows you to generate a `.zip` from a repository (or even a folder inside a repo) containing your plugin. +With the `pluginData` property of the [`installPlugin` blueprint step](/blueprints/steps#installPlugin), you can define a [`git:directory` resource](/blueprints/steps/resources#gitdirectoryreference) that will build a plugin from the files from a repository in the Playground instance. :::info -[GitHub proxy](https://playground.wordpress.net/proxy) is an incredibly useful tool to load plugins from GitHub repositories as it allows you to load a plugin from a specific branch, a specific directory, a specific commit or a specific PR. -::: - -:::tip -If your plugin is hosted on GitHub, you can automatically add preview buttons to your pull requests using the Playground PR Preview GitHub Action. This lets reviewers test your changes instantly without any setup. See [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) for details. +For the past few months, the [GitHub proxy](https://playground.wordpress.net/proxy) was an incredibly useful tool to load plugins from GitHub repositories, as it allows you to load a plugin from a specific branch, a specific directory, a specific commit, or a specific PR. But with the recent improvements to Playground, this feature is no longer necessary. The GitHub Proxy will be discontinued soon, please update your blueprints to `git:directory` resource. ::: -For example, the following `blueprint.json` installs a plugin from a GitHub repository leveraging the https://github-proxy.com tool: +For example, the following `blueprint.json` installs a plugin from a GitHub repository: ```json { @@ -72,15 +66,21 @@ For example, the following `blueprint.json` installs a plugin from a GitHub repo { "step": "installPlugin", "pluginData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin" + "resource": "git:directory", + "url": "https://github.com/wptrainingteam/devblog-dataviews-plugin", + "ref": "HEAD", + "refType": "refname" } } ] } ``` -[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin%22}}]}) +:::tip +If your plugin is hosted on GitHub, you can automatically add preview buttons to your pull requests using the Playground PR Preview GitHub Action. This lets reviewers test your changes instantly without any setup. See [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) for details. +::: + +[   Run Blueprint   ](https://playground.wordpress.net/#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/wptrainingteam/devblog-dataviews-plugin%22,%22ref%22:%22HEAD%22,%22refType%22:%22refname%22}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) ### Plugin from code in a file or gist in GitHub @@ -126,9 +126,9 @@ When providing a link to a WordPress Playground instance with some plugins activ Some useful tools and resources provided by the Playground project to work with blueprints are: -- Check the [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) to explore real-world code examples of using WordPress Playground to launch a WordPress site with a variety of setups. -- The [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) tool provides a visual interface to drag or click the steps to create a blueprint for WordPress Playground. You can also create your own steps! -- The [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool allows you edit your blueprint online and run it directly in a Playground instance. +- Check the [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) to explore real-world code examples of using WordPress Playground to launch a WordPress site with a variety of setups. +- The [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) tool provides a visual interface to drag or click the steps to create a blueprint for WordPress Playground. You can also create your own steps! +- The [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool allows you edit your blueprint online and run it directly in a Playground instance. ::: @@ -213,8 +213,8 @@ npx @wp-playground/cli server --auto-mount With Google Chrome you can synchronize a Playground instance with your local plugin's code and your plugin's GitHub repo. With this connection you can: -- See live (in the Playground instance) your local changes -- Create PRs in the GitHub repo with your changes +- See live (in the Playground instance) your local changes +- Create PRs in the GitHub repo with your changes Here's a little demo of this workflow in action: diff --git a/packages/docs/site/i18n/es/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md b/packages/docs/site/i18n/es/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md index 20155fa65a..8e09c8a2bb 100644 --- a/packages/docs/site/i18n/es/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md +++ b/packages/docs/site/i18n/es/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md @@ -6,13 +6,15 @@ description: Una guía para desarrolladores de plugins sobre cómo usar Playgrou + +WordPress Playground es una herramienta innovadora que permite a los desarrolladores de plugins construir, probar y mostrar sus plugins directamente en un entorno de navegador. + -El WordPress Playground es una herramienta innovadora que permite a los desarrolladores de plugins construir, probar y mostrar sus plugins directamente en un entorno de navegador. - -Esta guía te mostrará cómo usar WordPress Playground para mejorar tu flujo de trabajo de desarrollo de plugins, crear demostraciones en directo para mostrar tu plugin y simplificar las pruebas y revisiones de tu plugin. +Esta guía te mostrará cómo usar WordPress Playground para mejorar tu flujo de trabajo de desarrollo de plugins, crear demostraciones en vivo para mostrar tu plugin y simplificar las pruebas y revisiones de tu plugin. -### El Plugin en el directorio de plugins de WordPress +### Plugin en el directorio de temas de WordPress -Con WordPress Playground, puedes lanzar rápidamente una instalación de WordPress con casi cualquier plugin disponible en el [Directorio de Plugins de WordPress](https://wordpress.org/plugins/) instalado y activado. Todo lo que necesitas hacer es añadir el parámetro de consulta `plugin` a la [URL de Playground](https://playground.wordpress.net) y usar el slug del plugin del directorio de WordPress como valor. Por ejemplo: https://playground.wordpress.net/?plugin=create-block-theme +Con WordPress Playground, puedes lanzar rápidamente una instalación de WordPress con casi cualquier plugin disponible en el [Directorio de Plugins de WordPress](https://wordpress.org/plugins/) instalado y activado. Todo lo que necesitas hacer es añadir el [parámetro de consulta](/developers/apis/query-api) `plugin` a la [URL de Playground](https://playground.wordpress.net) y usar el slug del plugin del directorio de WordPress como valor. Por ejemplo: https://playground.wordpress.net/?plugin=create-block-theme -También puedes cargar cualquier plugin del directorio de plugins de WordPress configurando [el paso `installPlugin`](/blueprints/steps#InstallPluginStep) de un [Blueprint](/blueprints/getting-started) pasándolo a la instancia de Playground. +También puedes cargar cualquier plugin del directorio de plugins de WordPress configurando el [paso `installPlugin`](/blueprints/steps#InstallPluginStep) de un [Blueprint](/blueprints/getting-started) pasado a la instancia de Playground. ```json { @@ -96,13 +98,13 @@ También puedes cargar cualquier plugin del directorio de plugins de WordPress c } ``` -[   Ejecuta el Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) +[   Ejecutar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) -Los Blueprints pueden ser pasados a una instancia de Playground [de múltiples formas](/blueprints/using-blueprints). +Los Blueprints pueden pasarse a una instancia de Playground [de varias maneras](/blueprints/using-blueprints). -Un plugin almacenado en un repositorio de GitHub también puede ser cargado en una instancia de Playground a través de Blueprints. - -Con la propiedad `pluginData` del [paso `installPlugin` del blueprint](/blueprints/steps#installPlugin), puedes definir un [`recurso url`](/blueprints/steps/resources#urlreference) que apunte a la ubicación del archivo `.zip` que contiene el plugin que deseas cargar en la instancia de Playground. - -Para evitar problemas de CORS, el proyecto Playground proporciona un [proxy de GitHub](https://playground.wordpress.net/proxy) que te permite generar un `.zip` a partir de un repositorio (o incluso una carpeta dentro de un repositorio) que contiene tu plugin. +Un plugin almacenado en un repositorio de GitHub también puede cargarse en una instancia de Playground a través de Blueprints. -:::info -[El proxy de GitHub](https://playground.wordpress.net/proxy) es una herramienta increíblemente útil para cargar plugins desde repositorios de GitHub, ya que te permite cargar un plugin desde una rama específica, un directorio específico, un commit específico o un PR específico. -::: +Con la propiedad `pluginData` del [paso del blueprint `installPlugin`](/blueprints/steps#installPlugin), puedes definir un [recurso `git:directory`](/blueprints/steps/resources#gitdirectoryreference) que construirá un plugin a partir de los archivos de un repositorio en la instancia de Playground. -:::tip -Si tu plugin está alojado en GitHub, puedes agregar automáticamente botones de vista previa a tus pull requests utilizando la GitHub Action llamada Playground PR Preview. Esto permite a los revisores probar tus cambios al instante sin ninguna configuración. Consulta [Agregar botones de vista previa de PR con GitHub Actions](/guides/github-action-pr-preview) para más detalles. +:::info +Durante los últimos meses, el [proxy de GitHub](https://playground.wordpress.net/proxy) fue una herramienta increíblemente útil para cargar plugins desde repositorios de GitHub, ya que permitía cargar un plugin desde una rama específica, un directorio específico, un commit específico o un PR específico. Pero con las recientes mejoras en Playground, esta función ya no es necesaria. El Proxy de GitHub se descontinuará pronto, por favor actualiza tus blueprints al recurso `git:directory`. ::: -Por ejemplo, el siguiente `blueprint.json` instala un plugin desde un repositorio de GitHub aprovechando la herramienta https://github-proxy.com: +Por ejemplo, el siguiente `blueprint.json` instala un plugin desde un repositorio de GitHub: ```json { @@ -176,21 +166,37 @@ Por ejemplo, el siguiente `blueprint.json` instala un plugin desde un repositori { "step": "installPlugin", "pluginData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin" + "resource": "git:directory", + "url": "https://github.com/wptrainingteam/devblog-dataviews-plugin", + "ref": "HEAD", + "refType": "refname" } } ] } ``` -[   Ejecuta el Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin%22}}]}) + + +:::tip +Si tu plugin está alojado en GitHub, puedes agregar automáticamente botones de vista previa a tus pull requests utilizando la GitHub Action llamada Playground PR Preview. Esto permite a los revisores probar tus cambios al instante sin ninguna configuración. Consulta [Agregar botones de vista previa de PR con GitHub Actions](/guides/github-action-pr-preview) para más detalles. +::: + + + +[   Ejecutar Blueprint   ](https://playground.wordpress.net/#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/wptrainingteam/devblog-dataviews-plugin%22,%22ref%22:%22HEAD%22,%22refType%22:%22refname%22}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) -### Plugin desde el código en un archivo o gist en GitHub +### Plugin desde código en un archivo o gist en GitHub -Al combinar los pasos [`writeFile`](/blueprints/steps#WriteFileStep) y [`activatePlugin`](/blueprints/steps#activatePlugin) también puedes lanzar una instancia de WP Playground con un plugin creado sobre la marcha a partir de código almacenado en un gist o [un archivo en GitHub](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php): +Combinando los pasos [`writeFile`](/blueprints/steps#WriteFileStep) y [`activatePlugin`](/blueprints/steps#activatePlugin), también puedes lanzar una instancia de WP Playground con un plugin creado sobre la marcha a partir de código almacenado en un gist o [un archivo en GitHub](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php): ```json { @@ -248,7 +254,7 @@ Al combinar los pasos [`writeFile`](/blueprints/steps#WriteFileStep) y [`activat } ``` -[   Ejecuta el Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) +[   Ejecutar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) -## Configurando una demo para tu plugin con Blueprints +## Configurando una demostración para tu plugin con Blueprints -Cuando proporcionas un enlace a una instancia de WordPress Playlist con algunos plugins activados, es posible que también quieras personalizar la configuración inicial de esa instancia de Playground utilizando esos plugins. Con los [Blueprints](/blueprints/getting-started) de Playground puedes cargar/activar plugins y configurar la instancia de Playground. +Al proporcionar un enlace a una instancia de WordPress Playground con algunos plugins activados, es posible que también desees personalizar la configuración inicial para esa instancia de Playground utilizando esos plugins. Con los [Blueprints](/blueprints/getting-started) de Playground puedes cargar/activar plugins y configurar la instancia de Playground. + + :::tip Algunas herramientas y recursos útiles proporcionados por el proyecto Playground para trabajar con blueprints son: -- Consulta la [Galería de Blueprints](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) para explorar ejemplos de código del mundo real que utilizan WordPress Playground para lanzar un sitio de WordPress con una variedad de configuraciones. -- La herramienta [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) proporciona una interfaz visual para arrastrar o hacer clic en los pasos para crear un blueprint para WordPress Playground. ¡También puedes crear tus propios pasos! -- La herramienta [Blueprints builder](https://playground.wordpress.net/builder/builder.html) te permite editar tu blueprint en línea y ejecutarlo directamente en una instancia de Playground. +- Consulta la [Galería de Blueprints](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) para explorar ejemplos de código del mundo real sobre el uso de WordPress Playground para lanzar un sitio de WordPress con una variedad de configuraciones. +- La herramienta [Biblioteca de Pasos de WordPress Playground](https://akirk.github.io/playground-step-library/#) proporciona una interfaz visual para arrastrar o hacer clic en los pasos para crear un blueprint para WordPress Playground. ¡También puedes crear tus propios pasos! +- La herramienta [Constructor de Blueprints](https://playground.wordpress.net/builder/builder.html) te permite editar tu blueprint en línea y ejecutarlo directamente en una instancia de Playground. ::: @@ -288,7 +308,7 @@ Algunas herramientas y recursos útiles proporcionados por el proyecto Playgroun Through properties and [`steps`](/blueprints/steps) in the Blueprint, you can configure the Playground instance's initial setup, providing your plugins with the content and configuration needed for showcasing your plugin's compelling features and functionality. --> -A través de propiedades y [`steps`](/blueprints/steps)(pasos) en el Blueprint, puedes configurar el estado inicial de la instancia de Playground, proporcionando a tus plugins el contenido y la configuración necesarios para mostrar las características y convincentes funcionalidades de tu plugin. +A través de propiedades y [`pasos`](/blueprints/steps) en el Blueprint, puedes configurar la configuración inicial de la instancia de Playground, proporcionando a tus plugins el contenido y la configuración necesarios para mostrar las características y funcionalidades atractivas de tu plugin. + ### `plugins` + -### `plugins` - -Si tu plugin tiene dependencias con otros plugins, puedes usar la clave `plugins` para instalar el tuyo junto con cualquier otro plugin necesario. +Si tu plugin tiene dependencias de otros plugins, puedes usar la abreviatura `plugins` para instalar el tuyo junto con cualquier otro plugin necesario. ```json { @@ -332,11 +354,15 @@ Si tu plugin tiene dependencias con otros plugins, puedes usar la clave `plugins } ``` -[   Ejecuta el Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) +[   Ejecutar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) + ### `landingPage` + -### `landingPage` - -Si tu plugin tiene una vista de configuración o un asistente de incorporación, puedes usar la clave `landingPage` para redirigir automáticamente a cualquier página en la instancia de Playground al cargarla. +Si tu plugin tiene una vista de configuración o un asistente de incorporación, puedes usar la abreviatura `landingPage` para redirigir automáticamente a cualquier página en la instancia de Playground al cargar. ```json { @@ -362,13 +386,21 @@ Si tu plugin tiene una vista de configuración o un asistente de incorporación, } ``` -[   Ejecuta el Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) +[   Ejecutar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) +### `writeFile` + + + +Con el [paso `writeFile`](/blueprints/steps#writeFile) puedes crear cualquier archivo de plugin sobre la marcha, haciendo referencia al código de un archivo \*.php almacenado en GitHub o Gist. + -### `writeFile` - -Con el [paso `writeFile`](/blueprints/steps#writeFile) puedes crear cualquier archivo de un plugin sobre la marcha, haciendo referencia al código de un archivo \*.php almacenado en repositorio de GitHub o un Gist. - -Aquí tienes un ejemplo de un **[plugin que genera Custom Post Types](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)**, colocado en la carpeta `mu-plugins` para asegurar que el código se ejecute automáticamente al cargar: +Aquí hay un ejemplo de un **[plugin que genera Tipos de Post Personalizados](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)**, colocado en la carpeta `mu-plugins` para asegurar que el código se ejecute automáticamente al cargar: ```json { @@ -426,11 +454,23 @@ Aquí tienes un ejemplo de un **[plugin que genera Custom Post Types](https://ra + +Desde una carpeta de plugins en tu entorno de desarrollo local, puedes cargar rápidamente una instancia de Playground localmente con ese plugin cargado y activado. + +Usa el [comando `@wp-playground/cli`](/developers/local-development/wp-playground-cli) desde el directorio raíz de tu plugin usando tu programa de línea de comandos preferido. + + + +Con el IDE [Visual Studio Code](https://code.visualstudio.com/), también puedes usar la [extensión de Visual Studio Code](/developers/local-development/vscode-extension) mientras trabajas en el directorio raíz de tu plugin. + -Desde la carpeta de un plugin en tu entorno de desarrollo local, puedes cargar rápidamente una instancia de Playground con ese plugin cargado y activado. - -Usa el [comando `@wp-playground/cli`](/developers/local-development/wp-playground-cli) desde el directorio raíz de tu plugin utilizando tu programa de línea de comandos preferido. - -Con el IDE [Visual Studio Code](https://code.visualstudio.com/), también puedes usar la [extensión de Visual Studio Code](/developers/local-development/vscode-extension) mientras trabajas en el directorio raíz de tu plugin. - Por ejemplo: ```bash @@ -458,7 +492,7 @@ npx @wp-playground/cli server --auto-mount ### See your local changes in a Playground instance and directly create PRs in a GitHub repo with your changes --> -### Ver tus cambios locales en una instancia de Playground y crear PRs directamente en un repositorio de GitHub con tus cambios +### Ve tus cambios locales en una instancia de Playground y crea PRs directamente en un repositorio de GitHub con tus cambios -Con Google Chrome puedes sincronizar una instancia de Playground con el código local de tu plugin y el repositorio de GitHub de tu plugin. Con esta conexión puedes: +Con Google Chrome puedes sincronizar una instancia de Playground con el código de tu plugin local y el repositorio de GitHub de tu plugin. Con esta conexión puedes: -- Ver en directo (en la instancia de Playground) tus cambios locales -- Crear PRs en el repositorio de GitHub con tus cambios +- Ver en vivo (en la instancia de Playground) tus cambios locales +- Crear PRs en el repositorio de GitHub con tus cambios Aquí tienes una pequeña demostración de este flujo de trabajo en acción: @@ -492,6 +526,6 @@ Check [About Playground > Build > Synchronize your playground instance with a lo :::info -Consulta [Acerca de Playground > Construye > Sincroniza tu instancia de playground con una carpeta local y crea Pull Requests en GitHub](/about/build#synchronize-your-playground-instance-with-a-local-folder-and-create-github-pull-requests) para obtener más información. +Consulta [Acerca de Playground > Construir > Sincronizar tu instancia de playground con una carpeta local y crear Pull Requests de GitHub](/about/build#synchronize-your-playground-instance-with-a-local-folder-and-create-github-pull-requests) para más información. ::: diff --git a/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md b/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md index 4da83ad1d5..78905cd229 100644 --- a/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md +++ b/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md @@ -4,23 +4,17 @@ slug: /guides/for-plugin-developers description: Playground を使用してプラグインの魅力的なライブ デモを構築、テスト、作成するためのプラグイン開発者向けガイドです。 --- -WordPress Playground は、プラグイン開発者がブラウザ環境で直接プラグインを構築、テスト、紹介できる革新的なツールです。 - -このガイドでは、WordPress Playground を使用してプラグイン開発ワークフローを改善し、プラグインを紹介するライブデモを作成し、プラグインのテストとレビューを簡素化する方法を説明します。 +WordPress Playground は、プラグイン開発者がブラウザ環境で直接プラグインを構築、テスト、紹介できる革新的なツールです。 -:::info - -WordPress Playground を使用して製品を[構築](/about/build)、[テスト](/about/test)、[起動](/about/launch)する方法については、[Playground について](/about) セクションをご覧ください。 - -::: +このガイドでは、WordPress Playground を使用してプラグイン開発ワークフローを改善し、プラグインを紹介するライブデモを作成し、プラグインのテストとレビューを簡素化する方法を説明します。 -## プラグインを使って Playground インスタンスを起動する +:::info + +WordPress Playground を使用して製品を[構築](/about/build)、[テスト](/about/test)、[起動](/about/launch)する方法については、[Playground について](/about) セクションをご覧ください。 + +::: -### WordPress テーマディレクトリ内のプラグイン +## プラグインを使って Playground インスタンスを起動する -WordPress Playground を使えば、[WordPress プラグインディレクトリ](https://wordpress.org/plugins/)にあるほぼすべてのプラグインをインストール・有効化した WordPress 環境を素早く起動できます。[Playground URL](https://playground.wordpress.net) に `plugin` [クエリパラメータ](/developers/apis/query-api)を追加し、 WordPress ディレクトリにあるプラグインのスラッグを値として指定するだけです。例：https://playground.wordpress.net/?plugin=create-block-theme +### WordPress テーマディレクトリ内のプラグイン -:::tip -Playground インスタンスにインストールして有効化したいプラグインごとに、クエリパラメータを使って複数のプラグインをインストールして有効化できます。「plugin」パラメータを繰り返し指定することで実現できます。例：https://playground.wordpress.net/?plugin=gutenberg&plugin=akismet&plugin=wordpress-seo。 -::: +WordPress Playground を使えば、[WordPress プラグインディレクトリ](https://wordpress.org/plugins/)にあるほぼすべてのプラグインをインストール・有効化した WordPress 環境を素早く起動できます。[Playground URL](https://playground.wordpress.net) に `plugin` [クエリパラメータ](/developers/apis/query-api)を追加し、 WordPress ディレクトリにあるプラグインのスラッグを値として指定するだけです。例：https://playground.wordpress.net/?plugin=create-block-theme -また、Playground インスタンスに渡される [Blueprint](/blueprints/getting-started) の [`installPlugin` ステップ](/blueprints/steps#InstallPluginStep) を設定することで、WordPress プラグイン ディレクトリから任意のプラグインをロードすることもできます。 +:::tip +Playground インスタンスにインストールして有効化したいプラグインごとに、クエリパラメータを使って複数のプラグインをインストールして有効化できます。「plugin」パラメータを繰り返し指定することで実現できます。例：https://playground.wordpress.net/?plugin=gutenberg&plugin=akismet&plugin=wordpress-seo。 +::: ```json { @@ -81,53 +78,86 @@ You can also load any plugin from the WordPress plugins directory by setting the ``` [   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) +--> -ブループリントは、[いくつかの方法](/blueprints/using-blueprints)で Playground インスタンスに渡すことができます。 +また、Playground インスタンスに渡される [Blueprint](/blueprints/getting-started) の [`installPlugin` ステップ](/blueprints/steps#InstallPluginStep) を設定することで、WordPress プラグイン ディレクトリから任意のプラグインをロードすることもできます。 + +```json +{ + "landingPage": "/wp-admin/plugins.php", + "login": true, + "steps": [ + { + "step": "installPlugin", + "pluginData": { + "resource": "wordpress.org/plugins", + "slug": "gutenberg" + } + } + ] +} +``` + +[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) -### GitHub リポジトリのプラグイン +ブループリントは、[いくつかの方法](/blueprints/using-blueprints)で Playground インスタンスに渡すことができます。 -GitHub リポジトリに保存されているプラ ​​ グインは、ブループリントを介して Playground インスタンスに読み込むこともできます。 +### GitHub リポジトリのプラグイン -[`installPlugin` ブループリント ステップ](/blueprints/steps#installPlugin) の `pluginData` プロパティを使用して、Playground インスタンスにロードするプラグインを含む `.zip` ファイルの場所を指す [`url` リソース](/blueprints/steps/resources#urlreference) を定義できます。 +GitHub リポジトリに保存されているプラグインは、ブループリントを介して Playground インスタンスに読み込むこともできます。 -CORS の問題を回避するために、Playground プロジェクトは [GitHub プロキシ](https://playground.wordpress.net/proxy) を提供します。これにより、プラグインを含むリポジトリ (またはリポジトリ内のフォルダー) から `.zip` を生成できます。 +[`installPlugin` ブループリントステップ](/blueprints/steps#installPlugin)の`pluginData`プロパティを使用して、Playgroundインスタンス内のリポジトリのファイルからプラグインを構築する[`git:directory`リソース](/blueprints/steps/resources#gitdirectoryreference)を定義できます。 - :::info -[GitHub プロキシ](https://playground.wordpress.net/proxy) は、GitHub リポジトリからプラグインをロードするのに非常に便利なツールです。特定のブランチ、特定のディレクトリ、特定のコミット、または特定の PR からプラグインをロードできます。 +For the past few months, the [GitHub proxy](https://playground.wordpress.net/proxy) was an incredibly useful tool to load plugins from GitHub repositories, as it allows you to load a plugin from a specific branch, a specific directory, a specific commit, or a specific PR. But with the recent improvements to Playground, this feature is no longer necessary. The GitHub Proxy will be discontinued soon, please update your blueprints to `git:directory` resource. ::: +--> - - -たとえば、次の `blueprint.json` は、https://github-proxy.com ツールを活用して GitHub リポジトリからプラグインをインストールします。 +たとえば、次の `blueprint.json` は GitHub リポジトリからプラグインをインストールします。 + ```json { "landingPage": "/wp-admin/admin.php?page=add-media-from-third-party-service", @@ -136,27 +166,40 @@ For example, the following `blueprint.json` installs a plugin from a GitHub repo { "step": "installPlugin", "pluginData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin" + "resource": "git:directory", + "url": "https://github.com/wptrainingteam/devblog-dataviews-plugin", + "ref": "HEAD", + "refType": "refname" } } ] } ``` -[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin%22}}]}) + -### GitHub のファイルまたは gist 内のコードからのプラグイン +:::tip +プラグインがGitHubでホストされている場合、Playground PR Preview GitHub Actionを使用して、プルリクエストにプレビューボタンを自動的に追加できます。これにより、レビュアーは設定なしですぐに変更をテストできます。詳細については、[GitHub Actionsを使用したPRプレビューボタンの追加](/guides/github-action-pr-preview)を参照してください。 +::: + + + +[   Run Blueprint   ](https://playground.wordpress.net/#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/wptrainingteam/devblog-dataviews-plugin%22,%22ref%22:%22HEAD%22,%22refType%22:%22refname%22}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) -[`writeFile`](/blueprints/steps#WriteFileStep) と [`activatePlugin`](/blueprints/steps#activatePlugin) ステップを組み合わせることで、gist または [GitHub 内のファイル](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php) に保存されたコードからオンザフライで構築されたプラグインを使用して WP Playground インスタンスを起動することもできます。 +### GitHub のファイルまたは gist 内のコードからのプラグイン ```json { @@ -183,12 +226,35 @@ By combining the [`writeFile`](/blueprints/steps#WriteFileStep) and [`activatePl ``` [   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) +--> -:::info +[`writeFile`](/blueprints/steps#WriteFileStep) と [`activatePlugin`](/blueprints/steps#activatePlugin) ステップを組み合わせることで、gist または [GitHub 内のファイル](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php) に保存されたコードからオンザフライで構築されたプラグインを使用して WP Playground インスタンスを起動することもできます。 -[ブループリントギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md)の [gist からプラグインをインストール](https://playground.wordpress.net/builder/builder.html?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-plugin-from-gist/blueprint.json#{%22meta%22:{%22title%22:%22Install%20plugin%20from%20a%20gist%22,%22author%22:%22zieladam%22,%22description%22:%22Install%20and%20activate%20a%20WordPress%20plugin%20from%20a%20.php%20file%20stored%20in%20a%20gist.%22,%22categories%22:[%22plugins%22]},%22landingPage%22:%22/wp-admin/plugins.php%22,%22preferredVersions%22:{%22wp%22:%22beta%22,%22php%22:%228.0%22},%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/0-plugin.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://gist.githubusercontent.com/ndiego/456b74b243d86c97cda89264c68cbdee/raw/ff00cf25e6eebe4f5a4eaecff10286f71e65340b/block-hooks-demo.php%22}},{%22step%22:%22activatePlugin%22,%22pluginName%22:%22Block%20Hooks%20Demo%22,%22pluginPath%22:%220-plugin.php%22}]})の例では、gist のコードからプラグインをロードする方法を示しています。 +```json +{ + "landingPage": "/wp-admin/plugins.php", + "login": true, + "steps": [ + { + "step": "login" + }, + { + "step": "writeFile", + "path": "/wordpress/wp-content/plugins/cpt-books.php", + "data": { + "resource": "url", + "url": "https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php" + } + }, + { + "step": "activatePlugin", + "pluginPath": "cpt-books.php" + } + ] +} +``` -::: +[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) -## ブループリントを使用してプラグインのデモを設定する +:::info + +[ブループリントギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md)の [gist からプラグインをインストール](https://playground.wordpress.net/builder/builder.html?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-plugin-from-gist/blueprint.json#{%22meta%22:{%22title%22:%22Install%20plugin%20from%20a%20gist%22,%22author%22:%22zieladam%22,%22description%22:%22Install%20and%20activate%20a%20WordPress%20plugin%20from%20a%20.php%20file%20stored%20in%20a%20gist.%22,%22categories%22:[%22plugins%22]},%22landingPage%22:%22/wp-admin/plugins.php%22,%22preferredVersions%22:{%22wp%22:%22beta%22,%22php%22:%228.0%22},%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/0-plugin.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://gist.githubusercontent.com/ndiego/456b74b243d86c97cda89264c68cbdee/raw/ff00cf25e6eebe4f5a4eaecff10286f71e65340b/block-hooks-demo.php%22}},{%22step%22:%22activatePlugin%22,%22pluginName%22:%22Block%20Hooks%20Demo%22,%22pluginPath%22:%220-plugin.php%22}]})の例では、gist のコードからプラグインをロードする方法を示しています。 + +::: -いくつかのプラグインを有効にした WordPress Playground インスタンスへのリンクを提供する場合、それらのプラグインを使って Playground インスタンスの初期設定をカスタマイズしたい場合もあるでしょう。Playground の[Blueprints](/blueprints/getting-started)を使えば、プラグインを読み込み／有効化し、 Playground インスタンスを設定できます。 +## ブループリントを使用してプラグインのデモを設定する -:::tip - -Playground プロジェクトでは、ブループリントを操作するために、以下の便利なツールとリソースを提供しています。 - -- [ブループリント ギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) では、WordPress Playground を使用して様々な設定で WordPress サイトを立ち上げる実際のコード例をご覧いただけます。 -- [WordPress Playground ステップ ライブラリ](https://akirk.github.io/playground-step-library/#) ツールは、ステップをドラッグまたはクリックして WordPress Playground のブループリントを作成するためのビジュアルインターフェースを提供します。独自のステップを作成することもできます。 -- [ブループリント ビルダー](https://playground.wordpress.net/builder/builder.html) ツールを使用すると、ブループリントをオンラインで編集し、Playground インスタンスで直接実行できます。 - -::: +いくつかのプラグインを有効にした WordPress Playground インスタンスへのリンクを提供する場合、それらのプラグインを使って Playground インスタンスの初期設定をカスタマイズしたい場合もあるでしょう。Playground の[Blueprints](/blueprints/getting-started)を使えば、プラグインを読み込み／有効化し、 Playground インスタンスを設定できます。 -ブループリントのプロパティと [`steps`](/blueprints/steps) を通じて、Playground インスタンスの初期セットアップを構成し、プラグインの魅力的な機能を紹介するために必要なコンテンツと構成をプラグインに提供することができます。 +:::tip + +Playground プロジェクトでは、ブループリントを操作するために、以下の便利なツールとリソースを提供しています。 + +- [ブループリント ギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) では、WordPress Playground を使用して様々な設定で WordPress サイトを立ち上げる実際のコード例をご覧いただけます。 +- [WordPress Playground ステップ ライブラリ](https://akirk.github.io/playground-step-library/#) ツールは、ステップをドラッグまたはクリックして WordPress Playground のブループリントを作成するためのビジュアルインターフェースを提供します。独自のステップを作成することもできます。 +- [ブループリント ビルダー](https://playground.wordpress.net/builder/builder.html) ツールを使用すると、ブループリントをオンラインで編集し、Playground インスタンスで直接実行できます。 + +::: -:::info - -WordPress Playground を使った優れたデモでは、画像やその他のアセットを含む、プラグインとテーマのデフォルトコンテンツを読み込む必要がある場合があります。詳しくは、[デモ用のコンテンツの提供](/guides/providing-content-for-your-demo)ガイドをご覧ください。 - -::: +ブループリントのプロパティと [`steps`](/blueprints/steps) を通じて、Playground インスタンスの初期セットアップを構成し、プラグインの魅力的な機能を紹介するために必要なコンテンツと構成をプラグインに提供することができます。 -### `plugins` +:::info + +WordPress Playground を使った優れたデモでは、画像やその他のアセットを含む、プラグインとテーマのデフォルトコンテンツを読み込む必要がある場合があります。詳しくは、[デモ用のコンテンツの提供](/guides/providing-content-for-your-demo)ガイドをご覧ください。 + +::: -プラグインが他のプラグインに依存している場合は、`plugins` ショートカットを使用して、他の必要なプラグインと一緒にプラグインをインストールできます。 +### `plugins` ```json { @@ -273,18 +342,28 @@ If your plugin has dependencies on other plugins you can use the `plugins` short ``` [   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) +--> -### `landingPage` +プラグインが他のプラグインに依存している場合は、`plugins` ショートカットを使用して、他の必要なプラグインと一緒にプラグインをインストールできます。 + +```json +{ + "landingPage": "/wp-admin/plugins.php", + "plugins": ["gutenberg", "sql-buddy", "create-block-theme"], + "login": true +} +``` + +[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) -プラグインに設定ビューまたはオンボーディング ウィザードがある場合は、`landingPage` ショートカットを使用して、読み込み時に Playground インスタンス内の任意のページに自動的にリダイレクトできます。 +### `landingPage` ```json { @@ -295,24 +374,34 @@ If your plugin has a settings view or onboarding wizard, you can use the `landin ``` [   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) +--> -### `writeFile` +プラグインに設定ビューまたはオンボーディング ウィザードがある場合は、`landingPage` ショートカットを使用して、読み込み時に Playground インスタンス内の任意のページに自動的にリダイレクトできます。 + +```json +{ + "landingPage": "/wp-admin/admin.php?page=my-custom-gutenberg-app", + "login": true, + "plugins": ["https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip"] +} +``` + +[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) -[`writeFile` ステップ](/blueprints/steps#writeFile)を使用すると、GitHub または Gist に保存されている \*.php ファイルのコードを参照して、任意のプラグイン ファイルを即座に作成できます。 +### `writeFile` -以下は、ロード時にコードが自動的に実行されるように `mu-plugins` フォルダに配置された **[カスタム投稿タイプを生成するプラグイン](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)** の例です。 +[`writeFile` ステップ](/blueprints/steps#writeFile)を使用すると、GitHub または Gist に保存されている \*.php ファイルのコードを参照して、任意のプラグイン ファイルを即座に作成できます。 ```json { @@ -330,82 +419,102 @@ Here’s an example of a **[plugin that generates Custom Post Types](https://raw ] } ``` +--> -## プラグイン開発 +以下は、ロード時にコードが自動的に実行されるように `mu-plugins` フォルダに配置された **[カスタム投稿タイプを生成するプラグイン](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)** の例です。 + +```json +{ + "landingPage": "/wp-admin/", + "login": true, + "steps": [ + { + "step": "writeFile", + "path": "/wordpress/wp-content/mu-plugins/books.php", + "data": { + "resource": "url", + "url": "https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php" + } + } + ] +} +``` -### Playground を使用したローカルプラグインの開発とテスト +## プラグイン開発 -ローカル開発環境のプラグイン フォルダーから、そのプラグインが読み込まれアクティブ化された Playground インスタンスをローカルにすばやく読み込むことができます。 +### Playground を使用したローカルプラグインの開発とテスト -お好みのコマンドライン プログラムを使用して、プラグインのルート ディレクトリから [`@wp-playground/cli` コマンド](/developers/local-development/wp-playground-cli) を使用します。 +ローカル開発環境のプラグイン フォルダーから、そのプラグインが読み込まれアクティブ化された Playground インスタンスをローカルにすばやく読み込むことができます。 -[Visual Studio Code](https://code.visualstudio.com/) IDE では、プラグインのルート ディレクトリで作業しているときに [Visual Studio Code 拡張機能](/developers/local-development/vscode-extension) を使用することもできます。 +お好みのコマンドライン プログラムを使用して、プラグインのルート ディレクトリから [`@wp-playground/cli` コマンド](/developers/local-development/wp-playground-cli) を使用します。 -例えば： +[Visual Studio Code](https://code.visualstudio.com/) IDE では、プラグインのルート ディレクトリで作業しているときに [Visual Studio Code 拡張機能](/developers/local-development/vscode-extension) を使用することもできます。 ```bash git clone git@github.com:wptrainingteam/devblog-dataviews-plugin.git cd devblog-dataviews-plugin npx @wp-playground/cli server --auto-mount ``` +--> -### Playground インスタンスでローカルの変更を確認し、変更を GitHub リポジトリに直接 PR を作成します +例えば： + +```bash +git clone git@github.com:wptrainingteam/devblog-dataviews-plugin.git +cd devblog-dataviews-plugin +npx @wp-playground/cli server --auto-mount +``` -Google Chrome を使用すると、Playground インスタンスをローカルプラグインのコードとプラグインの GitHub リポジトリと同期できます。この接続により、以下のことが可能になります。 +### Playground インスタンスでローカルの変更を確認し、変更を GitHub リポジトリに直接 PR を作成します -- ローカルの変更をライブで（ Playground インスタンスで）確認する -- 変更内容を GitHub リポジトリに PR として作成する - - - -このワークフローの実際のデモを以下に示します。 -

+--> -:::info +Google Chrome を使用すると、Playground インスタンスをローカルプラグインのコードとプラグインの GitHub リポジトリと同期できます。この接続により、以下のことが可能になります。 -詳細については、[Playground について > ビルド > Playground インスタンスをローカル フォルダーと同期して GitHub プル リクエストを作成する](/about/build#synchronize-your-playground-instance-with-a-local-folder-and-create-github-pull-requests) を確認してください。 -::: +- ローカルの変更をライブで（ Playground インスタンスで）確認する +- 変更内容を GitHub リポジトリに PR として作成する + +このワークフローの実際のデモを以下に示します。 + + +

+ +:::info + +詳細については、[Playground について > ビルド > Playground インスタンスをローカル フォルダーと同期して GitHub プル リクエストを作成する](/about/build#synchronize-your-playground-instance-with-a-local-folder-and-create-github-pull-requests) を確認してください。 + +::: diff --git a/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md b/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md index b9424c0bfb..22b5777a52 100644 --- a/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md +++ b/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md @@ -6,12 +6,14 @@ description: Um guia para desenvolvedores de plugins sobre como usar o Playgroun O WordPress Playground é uma ferramenta inovadora que permite aos desenvolvedores de plugins construir, testar e exibir seus plugins diretamente em um ambiente de navegador. + + Este guia mostrará como usar o WordPress Playground para melhorar seu fluxo de trabalho de desenvolvimento de plugins, criar demonstrações ao vivo para exibir seu plugin e simplificar seus testes e revisão de plugins. - -Você também pode carregar qualquer plugin do diretório de plugins do WordPress definindo o passo [`installPlugin`](/blueprints/steps#InstallPluginStep) de um [Blueprint](/blueprints/getting-started) passado para a instância do Playground. ```json { @@ -78,10 +77,27 @@ Você também pode carregar qualquer plugin do diretório de plugins do WordPres } ``` - +Você também pode carregar qualquer plugin do diretório de plugins do WordPress definindo o passo [`installPlugin`](/blueprints/steps#InstallPluginStep) de um [Blueprint](/blueprints/getting-started) passado para a instância do Playground. + +```json +{ + "landingPage": "/wp-admin/plugins.php", + "login": true, + "steps": [ + { + "step": "installPlugin", + "pluginData": { + "resource": "wordpress.org/plugins", + "slug": "gutenberg" + } + } + ] +} +``` + [   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) -Com a propriedade `pluginData` do [passo blueprint `installPlugin`](/blueprints/steps#installPlugin), você pode definir um [recurso `url`](/blueprints/steps/resources#urlreference) que aponta para a localização do arquivo `.zip` contendo o plugin que você deseja carregar na instância do Playground. - - - -Para evitar problemas de CORS, o projeto Playground fornece um [proxy GitHub](https://github-proxy.com/) que permite gerar um `.zip` de um repositório (ou mesmo uma pasta dentro de um repo) contendo seu plugin. +Com a propriedade `pluginData` do [passo do blueprint `installPlugin`](/blueprints/steps#installPlugin), você pode definir um [recurso `git:directory`](/blueprints/steps/resources#gitdirectoryreference) que criará um plugin a partir dos arquivos de um repositório na instância do Playground. :::info -O [proxy GitHub](https://github-proxy.com/) é uma ferramenta incrivelmente útil para carregar plugins de repositórios GitHub, pois permite carregar um plugin de uma branch específica, um diretório específico, um commit específico ou um PR específico. +Durante os últimos meses, o [proxy do GitHub](https://playground.wordpress.net/proxy) foi uma ferramenta incrivelmente útil para carregar plugins de repositórios do GitHub, pois permitia carregar um plugin de uma branch específica, um diretório específico, um commit específico ou um PR específico. Mas com as melhorias recentes no Playground, esse recurso não é mais necessário. O Proxy do GitHub será descontinuado em breve, por favor atualize seus blueprints para o recurso `git:directory`. ::: -Por exemplo, o seguinte `blueprint.json` instala um plugin de um repositório GitHub aproveitando a ferramenta https://github-proxy.com: +Por exemplo, o seguinte `blueprint.json` instala um plugin de um repositório GitHub: ```json { @@ -138,8 +166,10 @@ Por exemplo, o seguinte `blueprint.json` instala um plugin de um repositório Gi { "step": "installPlugin", "pluginData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin" + "resource": "git:directory", + "url": "https://github.com/wptrainingteam/devblog-dataviews-plugin", + "ref": "HEAD", + "refType": "refname" } } ] @@ -147,10 +177,20 @@ Por exemplo, o seguinte `blueprint.json` instala um plugin de um repositório Gi ``` + +:::tip +Se o seu plugin estiver hospedado no GitHub, você poderá adicionar automaticamente botões de visualização às suas solicitações pull usando o GitHub Action Playground PR Preview. Isso permite que os revisores testem suas alterações instantaneamente, sem qualquer configuração. Consulte [Adicionando botões de visualização de PR com ações do GitHub](/guides/github-action-pr-preview) para obter detalhes. +::: + + -[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin%22}}]}) +[   Executar Blueprint   ](https://playground.wordpress.net/#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/wptrainingteam/devblog-dataviews-plugin%22,%22ref%22:%22HEAD%22,%22refType%22:%22refname%22}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) - -Combinando os passos [`writeFile`](/blueprints/steps#WriteFileStep) e [`activatePlugin`](/blueprints/steps#activatePlugin), você também pode iniciar uma instância do WP Playground com um plugin construído dinamicamente a partir de código armazenado em um gist ou [um arquivo no GitHub](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php): ```json { @@ -188,10 +225,35 @@ Combinando os passos [`writeFile`](/blueprints/steps#WriteFileStep) e [`activate } ``` - +Combinando os passos [`writeFile`](/blueprints/steps#WriteFileStep) e [`activatePlugin`](/blueprints/steps#activatePlugin), você também pode iniciar uma instância do WP Playground com um plugin construído dinamicamente a partir de código armazenado em um gist ou [um arquivo no GitHub](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php): + +```json +{ + "landingPage": "/wp-admin/plugins.php", + "login": true, + "steps": [ + { + "step": "login" + }, + { + "step": "writeFile", + "path": "/wordpress/wp-content/plugins/cpt-books.php", + "data": { + "resource": "url", + "url": "https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php" + } + }, + { + "step": "activatePlugin", + "pluginPath": "cpt-books.php" + } + ] +} +``` + [   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) -Se seu plugin tem dependências de outros plugins, você pode usar a abreviação `plugins` para instalar o seu junto com quaisquer outros plugins necessários. +### `plugins` +Se seu plugin tem dependências de outros plugins, você pode usar a abreviação `plugins` para instalar o seu junto com quaisquer outros plugins necessários. + ```json { "landingPage": "/wp-admin/plugins.php", @@ -288,16 +354,26 @@ Se seu plugin tem dependências de outros plugins, você pode usar a abreviaçã } ``` +[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) + -[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) - ### `landingPage` Se seu plugin tem uma visualização de configurações ou assistente de integração, você pode usar a abreviação `landingPage` para redirecionar automaticamente para qualquer página na instância do Playground ao carregar. @@ -310,12 +386,12 @@ Se seu plugin tem uma visualização de configurações ou assistente de integra } ``` +[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) + -[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) - ### `writeFile` Aqui está um exemplo de um **[plugin que gera Custom Post Types](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)**, colocado na pasta `mu-plugins` para garantir que o código seja executado automaticamente ao carregar: @@ -379,6 +472,12 @@ Com o IDE [Visual Studio Code](https://code.visualstudio.com/), você também po Por exemplo: @@ -397,22 +496,21 @@ npx @wp-playground/cli server --auto-mount -Com o Google Chrome, você pode sincronizar uma instância do Playground com o código do seu plugin local e o repo GitHub do seu plugin. Com essa conexão, você pode: - - - -- Ver ao vivo (na instância do Playground) suas alterações locais -- Criar PRs no repo GitHub com suas alterações - +Com o Google Chrome, você pode sincronizar uma instância do Playground com o código do seu plugin local e o repo GitHub do seu plugin. Com essa conexão, você pode: + +- Ver ao vivo (na instância do Playground) suas alterações locais +- Criar PRs no repo GitHub com suas alterações + Aqui está uma pequena demonstração deste fluxo de trabalho em ação: diff --git a/packages/docs/site/i18n/tl/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md b/packages/docs/site/i18n/tl/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md index 1ef1bb584d..cfbe0c6abe 100644 --- a/packages/docs/site/i18n/tl/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md +++ b/packages/docs/site/i18n/tl/docusaurus-plugin-content-docs/current/main/guides/for-plugin-developers.md @@ -4,26 +4,82 @@ slug: /guides/for-plugin-developers description: WordPress Playground para sa Mga Plugin Developer --- + + Ang WordPress Playground ay isang makabagong tool na nagpapahintulot sa mga plugin developer na magtayo, mag-test, at magpakita ng kanilang mga plugin nang direkta sa browser. + + Ang gabay na ito ay magpapakita kung paano gamitin ang WordPress Playground upang pagandahin ang iyong workflow sa pag-develop ng plugin, lumikha ng live na demo para ipakita ang iyong plugin, at pasimplehin ang iyong plugin testing at review. + + :::info Tuklasin kung paano [Mag-build](/about/build), [Mag-test](/about/test), at [Mag-launch](/about/launch) ng iyong mga produkto gamit ang WordPress Playground sa [About Playground](/about) na seksyon. ::: + + ## Paglunsad ng isang Playground instance gamit ang plugin + + ### Plugin sa WordPress Themes Directory + + Sa WordPress Playground, maaari kang mabilis maglunsad ng WordPress installation na may halos anumang plugin mula sa [WordPress Plugins Directory](https://wordpress.org/plugins/) na naka-install at naka-activate. Kailangan mo lamang idagdag ang `plugin` na [query parameter](/developers/apis/query-api) sa [Playground URL](https://playground.wordpress.net) at gamitin ang slug ng plugin mula sa WordPress directory bilang halaga. Halimbawa: https://playground.wordpress.net/?plugin=create-block-theme + + :::tip Maaari kang mag-install at mag-activate ng maraming plugin sa pamamagitan ng pag-uulit ng `plugin` parameter para sa bawat plugin na nais mong i-install at i-activate sa Playground instance. Halimbawa: https://playground.wordpress.net/?plugin=gutenberg&plugin=akismet&plugin=wordpress-seo ::: + + Maaari mo ring i-load ang anumang plugin mula sa WordPress plugins directory sa pamamagitan ng pag-set ng [`installPlugin` step](/blueprints/steps#InstallPluginStep) ng isang [Blueprint](/blueprints/getting-started) na ipapasa sa Playground instance. ```json @@ -42,27 +98,44 @@ Maaari mo ring i-load ang anumang plugin mula sa WordPress plugins directory sa } ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{"landingPage":"/wp-admin/plugins.php","login":true,"steps":[{"step":"installPlugin","pluginData":{"resource":"wordpress.org/plugins","slug":"gutenberg"}}]}) +[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22wordpress.org/plugins%22,%22slug%22:%22gutenberg%22}}]}) + + Ang mga Blueprint ay maaaring ipasa sa isang Playground instance [sa iba't ibang paraan](/blueprints/using-blueprints). + + ### Plugin mula sa GitHub Repository Ang plugin na naka-imbak sa isang GitHub repository ay maaari ring i-load sa isang Playground instance gamit ang Blueprints. -Sa pamamagitan ng `pluginData` property ng [`installPlugin` blueprint step](/blueprints/steps#InstallPluginStep), maaari mong tukuyin ang [`url` resource](/blueprints/steps/resources#urlreference) na tumuturo sa lokasyon ng `.zip` file na naglalaman ng plugin na nais mong i-load sa Playground instance. + -Upang maiwasan ang mga isyu sa CORS, nag-aalok ang proyekto ng [GitHub proxy](https://playground.wordpress.net/proxy) na nagpapahintulot sa iyo na bumuo ng `.zip` mula sa isang repository (o kahit isang folder sa loob nito) na naglalaman ng iyong plugin. +Sa pamamagitan ng `pluginData` property ng [`installPlugin` blueprint step](/blueprints/steps#InstallPluginStep), maaari mong tukuyin ang [`git:directory` resource](/blueprints/steps/resources#gitdirectoryreference) na bubuo ng plugin mula sa mga file mula sa isang repository sa Playground instance. + -Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng plugin mula sa isang GitHub repository gamit ang https://github-proxy.com tool: +:::info +Sa mga nakaraang buwan, ang [GitHub proxy](https://playground.wordpress.net/proxy) ay isang napaka-kapaki-pakinabang na tool upang mag-load ng mga plugin mula sa mga GitHub repository, dahil pinapayagan kang mag-load ng plugin mula sa isang partikular na branch, direktoryo, commit, o PR. Ngunit sa mga kamakailang pagpapabuti sa Playground, ang feature na ito ay hindi na kailangan. Ang GitHub Proxy ay hindi na ipagpapatuloy sa lalong madaling panahon, mangyaring i-update ang iyong mga blueprint sa `git:directory` resource. +::: + + + +Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng plugin mula sa isang GitHub repository: + +```json +{ + "landingPage": "/wp-admin/admin.php?page=add-media-from-third-party-service", + "login": true, + "steps": [ + { + "step": "installPlugin", + "pluginData": { + "resource": "git:directory", + "url": "https://github.com/wptrainingteam/devblog-dataviews-plugin", + "ref": "HEAD", + "refType": "refname" } } ] } ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{"landingPage":"/wp-admin/admin.php?page=add-media-from-third-party-service","login":true,"steps":[{"step":"installPlugin","pluginData":{"resource":"url","url":"https://github-proxy.com/proxy/?repo=wptrainingteam/devblog-dataviews-plugin"}}]}) + + +:::tip +Kung ang iyong plugin ay naka-host sa GitHub, maaari kang awtomatikong magdagdag ng mga preview button sa iyong mga pull request gamit ang Playground PR Preview GitHub Action. Hinahayaan nito ang mga reviewer na subukan ang iyong mga pagbabago kaagad nang walang anumang setup. Tingnan ang [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) para sa mga detalye. +::: + + + +[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/#{%22landingPage%22:%22/wp-admin/admin.php?page=add-media-from-third-party-service%22,%22login%22:true,%22steps%22:[{%22step%22:%22installPlugin%22,%22pluginData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/wptrainingteam/devblog-dataviews-plugin%22,%22ref%22:%22HEAD%22,%22refType%22:%22refname%22}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) + + ### Plugin mula sa Code sa File o Gist sa GitHub + + Sa pamamagitan ng kombinasyon ng [`writeFile`](/blueprints/steps#WriteFileStep) at [`activatePlugin`](/blueprints/steps#activatePlugin) na mga step, maaari ka ring maglunsad ng WP Playground instance na may plugin na binuo sa real-time mula sa code na naka-imbak sa isang gist o [file sa GitHub](https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php): ```json @@ -112,36 +256,94 @@ Sa pamamagitan ng kombinasyon ng [`writeFile`](/blueprints/steps#WriteFileStep) [   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22login%22:true,%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/cpt-books.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://raw.githubusercontent.com/WordPress/blueprints/trunk/blueprints/custom-post/books.php%22}},{%22step%22:%22activatePlugin%22,%22pluginPath%22:%22cpt-books.php%22}]}) + + :::info Ang [Install plugin from a gist](https://playground.wordpress.net/builder/builder.html?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-plugin-from-gist/blueprint.json#{%22meta%22:{%22title%22:%22Install%20plugin%20from%20a%20gist%22,%22author%22:%22zieladam%22,%22description%22:%22Install%20and%20activate%20a%20WordPress%20plugin%20from%20a%20.php%20file%20stored%20in%20a%20gist.%22,%22categories%22:[%22plugins%22]},%22landingPage%22:%22/wp-admin/plugins.php%22,%22preferredVersions%22:{%22wp%22:%22beta%22,%22php%22:%228.0%22},%22steps%22:[{%22step%22:%22login%22},{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/plugins/0-plugin.php%22,%22data%22:{%22resource%22:%22url%22,%22url%22:%22https://gist.githubusercontent.com/ndiego/456b74b243d86c97cda89264c68cbdee/raw/ff00cf25e6eebe4f5a4eaecff10286f71e65340b/block-hooks-demo.php%22}},{%22step%22:%22activatePlugin%22,%22pluginName%22:%22Block%20Hooks%20Demo%22,%22pluginPath%22:%220-plugin.php%22}]}) example sa [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) ay nagpapakita kung paano mag-load ng plugin mula sa code sa isang gist ::: + + ## Pagse-set up ng demo para sa iyong plugin gamit ang Blueprints + + Kapag nagbibigay ng link sa isang WordPress Playground instance na may ilang mga plugin na naka-activate, maaari mo ring i-customize ang paunang setup para sa Playground instance na iyon gamit ang mga plugin na iyon. Sa pamamagitan ng [Blueprints](/blueprints/getting-started) ng Playground, maaari mong i-load/activate ang mga plugin at i-configure ang Playground instance. + + +:::tip + +Narito ang ilang kapaki-pakinabang na tool at mapagkukunan na ibinigay ng proyekto ng Playground upang gumana sa mga blueprint: + +- Tingnan ang [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) upang galugarin ang mga halimbawa ng code sa totoong mundo ng paggamit ng WordPress Playground upang maglunsad ng site ng WordPress na may iba't ibang mga setup. +- Ang [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) tool ay nagbibigay ng visual na interface upang i-drag o i-click ang mga hakbang upang lumikha ng isang blueprint para sa WordPress Playground. Maaari ka ring lumikha ng iyong sariling mga hakbang! +- Ang [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool ay nagbibigay-daan sa iyong i-edit ang iyong blueprint online at patakbuhin ito nang direkta sa isang instance ng Playground. + ::: + + Sa pamamagitan ng mga katangian at [`steps`](/blueprints/steps) sa Blueprint, maaari mong i-configure ang paunang setup ng Playground instance, ibibigay ang iyong mga plugin ng kinakailangang content at configuration upang maipakita ang mga kapana-panabik na feature at functionality ng iyong plugin. + + :::info Isang mahusay na demo gamit ang WordPress Playground ay maaaring mangailangan na mag-load ka ng default na content para sa iyong plugin at theme, kabilang ang mga larawan at iba pang asset. Tingnan ang [Pagbibigay ng nilalaman para sa iyong demo](/guides/providing-content-for-your-demo) na gabay para matuto nang higit pa tungkol dito. ::: + + ### `plugins` + + Kung ang iyong plugin ay may dependencies sa ibang mga plugin, maaari mong gamitin ang shorthand na `plugins` upang i-install ang mga iyon kasama ang iyong plugin. ```json @@ -152,11 +354,29 @@ Kung ang iyong plugin ay may dependencies sa ibang mga plugin, maaari mong gamit } ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{"landingPage":"/wp-admin/plugins.php","plugins":["gutenberg","sql-buddy","create-block-theme"],"login":true}) +[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/plugins.php%22,%22plugins%22:[%22gutenberg%22,%22sql-buddy%22,%22create-block-theme%22],%22login%22:true}) + + ### `landingPage` -If your plugin has a settings view or onboarding wizard, you can use the `landingPage` shortcut to automatically redirect to any page in the Playground instance upon loading. + + +Kung ang iyong plugin ay may settings view o onboarding wizard, maaari mong gamitin ang `landingPage` shorthand upang awtomatikong mag-redirect sa anumang page sa Playground instance sa pag-load. ```json { @@ -165,3 +385,147 @@ If your plugin has a settings view or onboarding wizard, you can use the `landin "plugins": ["https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip"] } ``` + +[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22landingPage%22:%22/wp-admin/admin.php?page=my-custom-gutenberg-app%22,%22login%22:true,%22plugins%22:[%22https://raw.githubusercontent.com/WordPress/block-development-examples/deploy/zips/data-basics-59c8f8.zip%22]}) + + + +### `writeFile` + + + +Gamit ang [`writeFile` step](/blueprints/steps#writeFile), maaari kang lumikha ng anumang file ng plugin sa mabilisang paraan, na tumutukoy sa code mula sa isang \*.php file na nakaimbak sa GitHub o Gist. + + + +Narito ang isang halimbawa ng isang **[plugin na bumubuo ng Mga Uri ng Pasadyang Post](https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php)**, na inilagay sa folder na `mu-plugins` upang matiyak na awtomatikong tumatakbo ang code sa pag-load: + +```json +{ + "landingPage": "/wp-admin/", + "login": true, + "steps": [ + { + "step": "writeFile", + "path": "/wordpress/wp-content/mu-plugins/books.php", + "data": { + "resource": "url", + "url": "https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/custom-post/books.php" + } + } + ] +} +``` + + + +## Plugin Development + + + +### Lokal na pag-develop ng plugin at pagsubok sa Playground + + + +Mula sa folder ng isang plugin sa iyong lokal na kapaligiran sa pag-develop, maaari mong mabilis na i-load nang lokal ang isang halimbawa ng Playground na na-load at na-activate ang plugin na iyon. + + + +Gamitin ang [`@wp-playground/cli` command](/developers/local-development/wp-playground-cli) mula sa root directory ng iyong plugin gamit ang iyong ginustong command line program. + + + +Gamit ang [Visual Studio Code](https://code.visualstudio.com/) IDE, maaari mo ring gamitin ang [Visual Studio Code extension](/developers/local-development/vscode-extension) habang nagtatrabaho sa root directory ng iyong plugin. + + + +Halimbawa: + +```bash +git clone git@github.com:wptrainingteam/devblog-dataviews-plugin.git +cd devblog-dataviews-plugin +npx @wp-playground/cli server --auto-mount +``` + + + +### Tingnan ang iyong mga lokal na pagbabago sa isang Playground instance at direktang gumawa ng mga PR sa isang GitHub repo kasama ang iyong mga pagbabago + + + +Sa Google Chrome, maaari mong i-synchronize ang isang Playground instance sa iyong local plugin code at GitHub repo ng iyong plugin. Sa koneksyong ito maaari mong: + +- Makita nang live (sa Playground instance) ang iyong mga lokal na pagbabago +- Gumawa ng mga PR sa GitHub repo kasama ang iyong mga pagbabago + +Narito ang isang maliit na demo ng workflow na ito sa aksyon: + + +

+ + + +:::info + +Tingnan ang [About Playground > Build > Synchronize your playground instance with a local folder and create GitHub Pull Requests](/about/build#synchronize-your-playground-instance-with-a-local-folder-and-create-github-pull-requests) para sa karagdagang impormasyon. + +::: From ee826e2a6e96cca6f9d68fbe55f19428e33dc14f Mon Sep 17 00:00:00 2001 From: Fellyph Cintra Date: Tue, 9 Dec 2025 20:16:26 -0300 Subject: [PATCH 2/2] updating themes for developer --- .../docs/main/guides/for-theme-developers.md | 30 +-- .../main/guides/for-theme-developers.md | 62 ++--- .../main/guides/for-theme-developers.md | 48 ++-- .../main/guides/for-theme-developers.md | 224 +++++++++++++++--- 4 files changed, 269 insertions(+), 95 deletions(-) diff --git a/packages/docs/site/docs/main/guides/for-theme-developers.md b/packages/docs/site/docs/main/guides/for-theme-developers.md index 0e46e955e2..06505a494a 100644 --- a/packages/docs/site/docs/main/guides/for-theme-developers.md +++ b/packages/docs/site/docs/main/guides/for-theme-developers.md @@ -46,17 +46,13 @@ You can also load any theme from the WordPress themes directory by setting the [ A theme stored in a GitHub repository can also be loaded in a Playground instance with Blueprints. -In the `themeData` property of the [`installTheme` blueprint step](/blueprints/steps#InstallThemeStep), you can define a [`url` resource](/blueprints/steps/resources#urlreference) that points to the location of the `.zip` file containing the theme you want to load in the Playground instance. +With the `themeData` property of the [`installTheme` blueprint step](/blueprints/steps#InstallThemeStep), you can define a [`git:directory` resource](/blueprints/steps/resources#gitdirectoryreference) that will build a theme from the files from a repository in the Playground instance. -To avoid CORS issues, the Playground project provides a [GitHub proxy](https://playground.wordpress.net/proxy) that allows you to generate a `.zip` from a repository (or even a folder inside a repo) containing your or theme. - -:::tip -[GitHub proxy](https://playground.wordpress.net/proxy) is an incredibly useful tool to load themes from GitHub repositories as it allows you to load a theme from a specific branch, a specific directory, a specific commit or a specific PR. - -If your theme is hosted on GitHub, you can automatically add preview buttons to your pull requests using the Playground PR Preview GitHub Action. This lets reviewers test your changes instantly without any setup. See [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) for details. +:::info +For the past few months, the [GitHub proxy](https://playground.wordpress.net/proxy) was an incredibly useful tool to load themes from GitHub repositories, as it allows you to load a theme from a specific branch, a specific directory, a specific commit, or a specific PR. But with the recent improvements to Playground, this feature is no longer necessary. The GitHub Proxy will be discontinued soon, please update your blueprints to `git:directory` resource. ::: -For example the following `blueprint.json` installs a theme from a GitHub repository leveraging the https://github-proxy.com tool: +For example the following `blueprint.json` installs a theme from a GitHub repository: ```json { @@ -64,8 +60,10 @@ For example the following `blueprint.json` installs a theme from a GitHub reposi { "step": "installTheme", "themeData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler" + "resource": "git:directory", + "url": "https://github.com/Automattic/themes", + "ref": "trunk", + "path": "assembler" }, "options": { "activate": true @@ -75,7 +73,11 @@ For example the following `blueprint.json` installs a theme from a GitHub reposi } ``` -[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler%22},%22options%22:{%22activate%22:true}}]}) +:::tip +If your theme is hosted on GitHub, you can automatically add preview buttons to your pull requests using the Playground PR Preview GitHub Action. This lets reviewers test your changes instantly without any setup. See [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) for details. +::: + +[   Run Blueprint   ](https://playground.wordpress.net/#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/Automattic/themes%22,%22ref%22:%22trunk%22,%22path%22:%22assembler%22},%22options%22:{%22activate%22:true}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) A blueprint can be passed to a Playground instance [in several ways](/blueprints/using-blueprints). @@ -87,9 +89,9 @@ When providing a link to a WordPress Playground instance with a specific theme a Some useful tools and resources provided by the Playground project to work with blueprints are: -- Check the [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) to explore real-world code examples of using WordPress Playground to launch a WordPress site with a variety of setups. -- The [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) tool provides a visual interface to drag or click the steps to create a blueprint for WordPress Playground. You can also create your own steps! -- The [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool allows you edit your blueprint online and run it directly in a Playground instance. +- Check the [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) to explore real-world code examples of using WordPress Playground to launch a WordPress site with a variety of setups. +- The [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) tool provides a visual interface to drag or click the steps to create a blueprint for WordPress Playground. You can also create your own steps! +- The [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool allows you edit your blueprint online and run it directly in a Playground instance. ::: diff --git a/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md b/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md index 6506399a0f..6662d133e2 100644 --- a/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md +++ b/packages/docs/site/i18n/ja/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md @@ -72,7 +72,7 @@ You can also load any theme from the WordPress themes directory by setting the [ } ``` -[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22wordpress.org/themes%22,%22slug%22:%22twentytwenty%22},%22options%22:{%22activate%22:true,%22importStarterContent%22:true}}]}) +[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22wordpress.org/themes%22,%22slug%22:%22twentytwenty%22},%22options%22:{%22activate%22:true,%22importStarterContent%22:true}}]}) ### GitHub リポジトリ内のテーマ @@ -86,32 +86,26 @@ GitHub リポジトリに保存されているテーマは、Blueprints を使 A theme stored in a GitHub repository can also be loaded in a Playground instance with Blueprints. --> -[`installTheme` ブループリント ステップ](/blueprints/steps#InstallThemeStep) の `themeData` プロパティで、Playground インスタンスにロードするテーマを含む `.zip` ファイルの場所を指す [`url` リソース](/blueprints/steps/resources#urlreference) を定義できます。 +[`installTheme` ブループリント ステップ](/blueprints/steps#InstallThemeStep)の`themeData`プロパティを使用して、Playgroundインスタンス内のリポジトリのファイルからテーマを構築する[`git:directory`リソース](/blueprints/steps/resources#gitdirectoryreference)を定義できます。 -CORS の問題を回避するために、Playground プロジェクトでは [GitHub プロキシ](https://playground.wordpress.net/proxy) が提供されており、これを使用すると、自分のテーマを含むリポジトリ (またはリポジトリ内のフォルダー) から `.zip` を生成できます。 - - - -:::tip -[GitHub プロキシ](https://playground.wordpress.net/proxy) は、特定のブランチ、特定のディレクトリ、特定のコミット、または特定の PR からテーマを読み込むことができるため、GitHub リポジトリからテーマを読み込むのに非常に便利なツールです。 +:::info +ここ数ヶ月、[GitHubプロキシ](https://playground.wordpress.net/proxy)はGitHubリポジトリからテーマを読み込むための非常に便利なツールでした。特定のブランチ、特定のディレクトリ、特定のコミット、または特定のPRからテーマを読み込むことができました。しかし、Playgroundの最近の改善により、この機能は不要になりました。GitHubプロキシはまもなく廃止されるため、ブループリントを`git:directory`リソースに更新してください。 ::: -たとえば、次の `blueprint.json` は、https://github-proxy.com ツールを使用して GitHub リポジトリからテーマをインストールします。 +たとえば、次の `blueprint.json` は GitHub リポジトリからテーマをインストールします。 ```json @@ -120,8 +114,10 @@ For example the following `blueprint.json` installs a theme from a GitHub reposi { "step": "installTheme", "themeData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler" + "resource": "git:directory", + "url": "https://github.com/Automattic/themes", + "ref": "trunk", + "path": "assembler" }, "options": { "activate": true @@ -131,7 +127,17 @@ For example the following `blueprint.json` installs a theme from a GitHub reposi } ``` -[   Run Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler%22},%22options%22:{%22activate%22:true}}]}) +:::tip +テーマがGitHubでホストされている場合、Playground PR Preview GitHub Actionを使用して、プルリクエストにプレビューボタンを自動的に追加できます。これにより、レビュアーは設定なしですぐに変更をテストできます。詳細については、[GitHub Actionsを使用したPRプレビューボタンの追加](/guides/github-action-pr-preview)を参照してください。 +::: + + + +[   Run Blueprint   ](https://playground.wordpress.net/#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/Automattic/themes%22,%22ref%22:%22trunk%22,%22path%22:%22assembler%22},%22options%22:{%22activate%22:true}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) ブループリントは、[いくつかの方法](/blueprints/using-blueprints)で Playground インスタンスに渡すことができます。 @@ -155,9 +161,9 @@ When providing a link to a WordPress Playground instance with a specific theme a Playground プロジェクトでは、ブループリントを操作するために、以下の便利なツールとリソースを提供しています。 -- [ブループリント ギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) では、WordPress Playground を使用して様々な設定で WordPress サイトを立ち上げる実際のコード例をご覧いただけます。 -- [WordPress Playground ステップ ライブラリ](https://akirk.github.io/playground-step-library/#) ツールは、ステップをドラッグまたはクリックして WordPress Playground のブループリントを作成するためのビジュアルインターフェースを提供します。独自のステップを作成することもできます。 -- [ブループリント ビルダー](https://playground.wordpress.net/builder/builder.html) ツールを使用すると、ブループリントをオンラインで編集し、Playground インスタンスで直接実行できます。 +- [ブループリント ギャラリー](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) では、WordPress Playground を使用して様々な設定で WordPress サイトを立ち上げる実際のコード例をご覧いただけます。 +- [WordPress Playground ステップ ライブラリ](https://akirk.github.io/playground-step-library/#) ツールは、ステップをドラッグまたはクリックして WordPress Playground のブループリントを作成するためのビジュアルインターフェースを提供します。独自のステップを作成することもできます。 +- [ブループリント ビルダー](https://playground.wordpress.net/builder/builder.html) ツールを使用すると、ブループリントをオンラインで編集し、Playground インスタンスで直接実行できます。 ::: @@ -211,7 +217,7 @@ With the [`resetData`](/blueprints/steps#resetData) step, you can remove the def ] ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L16) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L16) ### `writeFile` @@ -235,7 +241,7 @@ One of the things you can do through this step is to enable pretty permalinks fo ] ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L19) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L19) ### `updateUserMeta` @@ -261,7 +267,7 @@ With the [`updateUserMeta`](/blueprints/steps#updateUserMeta) step, you can upda ] ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L24) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L24) ### `setSiteOptions` @@ -288,7 +294,7 @@ With the [`setSiteOptions`](/blueprints/steps#setSiteOptions) step, you can set ] ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L50) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L50) `setSiteOptions` ステップの代わりに使用できる [`siteOptions`](/blueprints/steps/shorthands#siteoptions) ショートカットもあります。 @@ -308,7 +314,7 @@ With the [`plugins`](/blueprints/steps/shorthands#plugins) shorthand you can set "plugins": ["todo-list-block", "markdown-comment-block"] ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L60) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L60) [`installPlugin`](/blueprints/steps#installPlugin) ステップを使用して、Playground インスタンスのプラグインをインストールしてアクティブ化することもできますが、簡単な方法が推奨されます。 @@ -328,7 +334,7 @@ With the [`login`](/blueprints/steps/shorthands#login) shorthand you can launch "login": true, ``` -[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L10) +[   Run Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json)   [   See blueprint.json   ](https://github.com/WordPress/blueprints/blob/eb6da7dfa295a095eea2e424c0ae83a219803a8d/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json#L10) [`login`](/blueprints/steps#login) ステップを使用して、特定のユーザーでログインした状態で Playground インスタンスを起動することもできます。 @@ -387,7 +393,7 @@ npx @wp-playground/cli server --auto-mount Playground インスタンスを GitHub リポジトリに接続し、[Create Block Theme](https://wordpress.org/plugins/create-block-theme/)プラグインを活用することで、Playground インスタンス内の WordPress UI から行った変更を反映させたプルリクエストを作成できます。また、そのテーマに変更を加えて zip ファイルをエクスポートすることもできます。 このワークフローを使用するには、[Create Block Theme](https://wordpress.org/plugins/create-block-theme/) プラグインを Playground インスタンスにインストールして有効化する必要があることに注意してください。 diff --git a/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md b/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md index 89f5def9e7..008a9fbc49 100644 --- a/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md +++ b/packages/docs/site/i18n/pt-BR/docusaurus-plugin-content-docs/current/main/guides/for-theme-developers.md @@ -89,32 +89,26 @@ A theme stored in a GitHub repository can also be loaded in a Playground instanc Um tema armazenado em um repositório GitHub também pode ser carregado em uma instância do Playground com Blueprints. -Na propriedade `themeData` do [passo blueprint `installTheme`](/blueprints/steps#InstallThemeStep), você pode definir um [recurso `url`](/blueprints/steps/resources#urlreference) que aponta para a localização do arquivo `.zip` contendo o tema que você deseja carregar na instância do Playground. +Com a propriedade `themeData` do [passo do blueprint `installTheme`](/blueprints/steps#InstallThemeStep), você pode definir um [recurso `git:directory`](/blueprints/steps/resources#gitdirectoryreference) que criará um tema a partir dos arquivos de um repositório na instância do Playground. - -Para evitar problemas de CORS, o projeto Playground fornece um [proxy GitHub](https://github-proxy.com/) que permite gerar um `.zip` de um repositório (ou mesmo uma pasta dentro de um repo) contendo seu tema. - - -:::tip -O [proxy GitHub](https://github-proxy.com/) é uma ferramenta incrivelmente útil para carregar temas de repositórios GitHub, pois permite carregar um tema de uma branch específica, um diretório específico, um commit específico ou um PR específico. +:::info +Durante os últimos meses, o [proxy do GitHub](https://playground.wordpress.net/proxy) foi uma ferramenta incrivelmente útil para carregar temas de repositórios do GitHub, pois permitia carregar um tema de uma branch específica, um diretório específico, um commit específico ou um PR específico. Mas com as melhorias recentes no Playground, esse recurso não é mais necessário. O Proxy do GitHub será descontinuado em breve, por favor atualize seus blueprints para o recurso `git:directory`. ::: -Por exemplo, o seguinte `blueprint.json` instala um tema de um repositório GitHub aproveitando a ferramenta https://github-proxy.com: +Por exemplo, o seguinte `blueprint.json` instala um tema de um repositório GitHub: ```json { @@ -122,8 +116,10 @@ Por exemplo, o seguinte `blueprint.json` instala um tema de um repositório GitH { "step": "installTheme", "themeData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler" + "resource": "git:directory", + "url": "https://github.com/Automattic/themes", + "ref": "trunk", + "path": "assembler" }, "options": { "activate": true @@ -134,10 +130,20 @@ Por exemplo, o seguinte `blueprint.json` instala um tema de um repositório GitH ``` + +:::tip +Se o seu tema estiver hospedado no GitHub, você pode adicionar automaticamente botões de visualização às suas solicitações pull usando o GitHub Action Playground PR Preview. Isso permite que os revisores testem suas alterações instantaneamente, sem qualquer configuração. Consulte [Adicionando botões de visualização de PR com ações do GitHub](/guides/github-action-pr-preview) para obter detalhes. +::: + + -[   Executar Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler%22},%22options%22:{%22activate%22:true}}]}) +[   Executar Blueprint   ](https://playground.wordpress.net/#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/Automattic/themes%22,%22ref%22:%22trunk%22,%22path%22:%22assembler%22},%22options%22:{%22activate%22:true}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) + Ang WordPress Playground ay isang makabagong tool na nagpapahintulot sa mga theme developer na magtayo, mag-test, at magpakita ng kanilang mga theme nang direkta sa browser. Ang gabay na ito ay magpapakita kung paano gamitin ang WordPress Playground upang pagandahin ang iyong workflow sa pag-develop ng theme, lumikha ng live na demo para ipakita ang iyong theme, at pasimplehin ang proseso ng review ng theme. :::info @@ -22,20 +30,28 @@ Tuklasin kung paano [Mag-build](/about/build), [Mag-test](/about/test), at [Mag- ::: + + ## Paglunsad ng Playground instance gamit ang theme ### Theme sa WordPress Themes Directory Sa WordPress Playground, maaari kang mabilis maglunsad ng WordPress installation gamit ang anumang theme mula sa [WordPress Themes Directory](https://wordpress.org/themes/). Idagdag lamang ang `theme` [query parameter](/developers/apis/query-api) sa [Playground URL](https://playground.wordpress.net) tulad nito: https://playground.wordpress.net/?theme=disco. + + Maaari mo ring i-load ang anumang theme mula sa WordPress themes directory sa pamamagitan ng pag-set ng [`installTheme` step](/blueprints/steps#InstallThemeStep) ng isang [Blueprint](/blueprints/getting-started) na ipapasa sa Playground instance. ```json @@ -56,25 +72,41 @@ Maaari mo ring i-load ang anumang theme mula sa WordPress themes directory sa pa } ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22wordpress.org/themes%22,%22slug%22:%22twentytwenty%22},%22options%22:{%22activate%22:true,%22importStarterContent%22:true}}]}) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22wordpress.org/themes%22,%22slug%22:%22twentytwenty%22},%22options%22:{%22activate%22:true,%22importStarterContent%22:true}}]}) + + ### Theme mula sa GitHub Repository Ang theme na naka-imbak sa isang GitHub repository ay maaari ring i-load sa isang Playground instance gamit ang Blueprints. -Sa `themeData` property ng [`installTheme` blueprint step](/blueprints/steps#InstallThemeStep), maaari mong tukuyin ang [`url` resource](/blueprints/steps/resources#urlreference) na tumuturo sa lokasyon ng `.zip` file na naglalaman ng theme na nais mong i-load sa Playground instance. + + +Sa pamamagitan ng `themeData` property ng [`installTheme` blueprint step](/blueprints/steps#InstallThemeStep), maaari mong tukuyin ang [`git:directory` resource](/blueprints/steps/resources#gitdirectoryreference) na bubuo ng theme mula sa mga file mula sa isang repository sa Playground instance. -Upang maiwasan ang mga isyu sa CORS, nag-aalok ang proyekto ng [GitHub proxy](https://playground.wordpress.net/proxy) na maaari kang gumamit upang bumuo ng `.zip` mula sa isang repository (o kahit isang folder sa loob nito) na naglalaman ng theme. + -:::tip -Ang [GitHub proxy](https://playground.wordpress.net/proxy) ay napaka-kapaki-pakinabang na tool upang mag-load ng themes mula sa mga GitHub repository dahil pinapayagan kang mag-load mula sa isang partikular na branch, direktoryo, commit, o PR. +:::info +Sa mga nakaraang buwan, ang [GitHub proxy](https://playground.wordpress.net/proxy) ay isang napaka-kapaki-pakinabang na tool upang mag-load ng mga theme mula sa mga GitHub repository, dahil pinapayagan kang mag-load mula sa isang partikular na branch, direktoryo, commit, o PR. Ngunit sa mga kamakailang pagpapabuti sa Playground, ang feature na ito ay hindi na kailangan. Ang GitHub Proxy ay hindi na ipagpapatuloy sa lalong madaling panahon, mangyaring i-update ang iyong mga blueprint sa `git:directory` resource. ::: -Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng theme mula sa isang GitHub repository gamit ang https://github-proxy.com tool: + + +Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng theme mula sa isang GitHub repository: ```json { @@ -82,8 +114,10 @@ Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng theme mula sa i { "step": "installTheme", "themeData": { - "resource": "url", - "url": "https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler" + "resource": "git:directory", + "url": "https://github.com/Automattic/themes", + "ref": "trunk", + "path": "assembler" }, "options": { "activate": true @@ -93,39 +127,85 @@ Halimbawa, ang sumusunod na `blueprint.json` ay nag-i-install ng theme mula sa i } ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/builder/builder.html#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22url%22,%22url%22:%22https://github-proxy.com/proxy/?repo=Automattic/themes&branch=trunk&directory=assembler%22},%22options%22:{%22activate%22:true}}]}) + + +:::tip +Kung ang iyong theme ay naka-host sa GitHub, maaari kang awtomatikong magdagdag ng mga preview button sa iyong mga pull request gamit ang Playground PR Preview GitHub Action. Hinahayaan nito ang mga reviewer na subukan ang iyong mga pagbabago kaagad nang walang anumang setup. Tingnan ang [Adding PR Preview Buttons with GitHub Actions](/guides/github-action-pr-preview) para sa mga detalye. +::: + +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/#{%22steps%22:[{%22step%22:%22installTheme%22,%22themeData%22:{%22resource%22:%22git:directory%22,%22url%22:%22https://github.com/Automattic/themes%22,%22ref%22:%22trunk%22,%22path%22:%22assembler%22},%22options%22:{%22activate%22:true}}],%22$schema%22:%22https://playground.wordpress.net/blueprint-schema.json%22,%22meta%22:{%22title%22:%22Empty%20Blueprint%22,%22author%22:%22https://github.com/akirk/playground-step-library%22}}) + + Ang isang blueprint ay maaaring ipasa sa isang Playground instance [sa iba't ibang paraan](/blueprints/using-blueprints). + + ## Pag-set up ng demo theme gamit ang Blueprints Kapag nagbibigay ng link sa isang WordPress Playground instance na may naka-activate na tema, maaaring gusto mo ring i-customize ang paunang setup ng iyon theme. Sa pamamagitan ng [Blueprints](/blueprints/getting-started), maaari mong i-load, i-activate, at i-configure ang theme. + + :::tip Ilang kapaki-pakinabang na tool at resources mula sa proyekto ng Playground para magtrabaho sa blueprints: -- Suriin ang [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) upang tuklasin ang mga totoong halimbawa ng kodigo ng paggamit ng WordPress Playground upang maglunsad ng WordPress site na may iba't ibang setup. -- Ang [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) ay nagbibigay ng visual na interface upang i-drag o i-click ang mga step upang lumikha ng blueprint. Maaari ka ring gumawa ng sarili mong step! -- Ang [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool ay nagpapahintulot sa iyo na i-edit ang iyong blueprint online at patakbuhin ito nang direkta sa isang Playground instance. +- Suriin ang [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) upang tuklasin ang mga totoong halimbawa ng kodigo ng paggamit ng WordPress Playground upang maglunsad ng WordPress site na may iba't ibang setup. +- Ang [WordPress Playground Step Library](https://akirk.github.io/playground-step-library/#) ay nagbibigay ng visual na interface upang i-drag o i-click ang mga step upang lumikha ng blueprint. Maaari ka ring gumawa ng sarili mong step! +- Ang [Blueprints builder](https://playground.wordpress.net/builder/builder.html) tool ay nagpapahintulot sa iyo na i-edit ang iyong blueprint online at patakbuhin ito nang direkta sa isang Playground instance. ::: + + Sa pamamagitan ng properties at [`steps`](/blueprints/steps) sa blueprint, maaari mong i-configure ang paunang setup ng iyong theme sa Playground instance. + + :::info Upang magbigay ng mahusay na demo ng iyong theme gamit ang Playground, maaaring gusto mong i-load ito kasama ang default na content na nagpapakita ng mga feature ng iyong theme. Tingnan ang [Pagbibigay ng Nilalaman para sa Iyong Demo](/guides/providing-content-for-your-demo) na gabay para matuto pa. ::: + + ### `resetData` Gamit ang [`resetData`](/blueprints/steps#resetData) step, maaari mong alisin ang default na content ng isang WordPress installation upang mag-import ng sarili mong content. @@ -138,12 +218,17 @@ Gamit ang [`resetData`](/blueprints/steps#resetData) step, maaari mong alisin an ] ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) + + ### `writeFile` Gamit ang [`writeFile`](/blueprints/steps#writeFile) step, maaari kang magsulat ng data sa isang file sa tinukoy na path. Maaari mong gamitin ito upang magsulat ng custom PHP code sa isang PHP file sa loob ng `mu-plugins` folder ng Playground WordPress instance, kaya ang code ay awtomatikong na-eexecute kapag na-load ang WordPress instance. @@ -158,12 +243,16 @@ Gamit ang [`writeFile`](/blueprints/steps#writeFile) step, maaari kang magsulat ] ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) + - Gamit ang [`updateUserMeta`](/blueprints/steps#updateUserMeta) step, maaari mong i-update ang anumang user metadata. Halimbawa, maaari mong i-update ang metadata ng default na `admin` user ng anumang WordPress installation: @@ -182,12 +271,16 @@ Gamit ang [`updateUserMeta`](/blueprints/steps#updateUserMeta) step, maaari mong ] ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) + - Gamit ang [`setSiteOptions`](/blueprints/steps#setSiteOptions) step, maaari mong itakda ang [site options](https://developer.wordpress.org/apis/options/#available-options-by-category) gaya ng site name, description, o page na gamitin para sa posts. @@ -207,67 +300,134 @@ Gamit ang [`setSiteOptions`](/blueprints/steps#setSiteOptions) step, maaari mong ] ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) -### `plugins` + + +Mayroon ding [`siteOptions`](/blueprints/steps/shorthands#siteoptions) shorthand na maaaring gamitin sa halip na `setSiteOptions` step. +### `plugins` + + + Gamit ang shorthand na [`plugins`](/blueprints/steps/shorthands#plugins), maaari mong itakda ang listahan ng mga plugin na nais mong i-install at i-activate kasama ng iyong theme sa Playground instance. ```json "plugins": ["todo-list-block", "markdown-comment-block"] ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) -### `login` + + +Maaari mo ring gamitin ang [`installPlugin`](/blueprints/steps#installPlugin) step upang i-install at i-activate ang mga plugins para sa iyong Playground instance ngunit inirerekomenda ang shorthand na paraan. +### `login` + + + Gamit ang shorthand na [`login`](/blueprints/steps/shorthands#login), maaari mong ilunsad ang iyong Playground instance na naka-log in na sa admin user. ```json "login": true ``` -[   Patakbuhin ang Blueprint   ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) +[ Patakbuhin ang Blueprint ](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/wordpress/blueprints/trunk/blueprints/install-activate-setup-theme-from-gh-repo/blueprint.json) + + Maaari mo ring gamitin ang [`login`](/blueprints/steps#login) step upang ilunsad ang iyong Playground instance na naka-log in sa anumang partikular na user. + + :::tip Ang ["Stylish Press"](https://github.com/WordPress/blueprints/tree/trunk/blueprints/stylish-press) at ["Loading, activating, and configuring a theme from a GitHub repository"](https://github.com/WordPress/blueprints/tree/trunk/blueprints/install-activate-setup-theme-from-gh-repo) na halimbawa mula sa [Blueprints Gallery](https://github.com/WordPress/blueprints/blob/trunk/GALLERY.md) ay mahusay na sanggunian para sa pag-load, pag-activate, pag-import ng content, at pag-configure ng block theme sa isang Playground instance. ::: + + ## Pag-develop ng Theme + + ### Lokal na pag-develop at testing ng theme gamit ang Playground -Mula sa root folder ng code ng isang block theme, maaari mong mabilis i-load sa lokal ang isang Playground instance na may theme na iyon na naka-load at naka-activate. Gawin ito sa pamamagitan ng paglulunsad, sa loob ng theme directory, ng [`wp-now` command](/developers/local-development/wp-now) mula sa iyong paboritong command line program o ang [Visual Studio Code extension](/developers/local-development/vscode-extension) mula sa IDE na [Visual Studio Code](https://code.visualstudio.com/). + + +Mula sa root folder ng code ng isang block theme, maaari mong mabilis i-load sa lokal ang isang Playground instance na may theme na iyon na naka-load at naka-activate. Gawin ito sa pamamagitan ng paglulunsad, sa loob ng theme directory, ng [`@wp-playground/cli` command](/developers/local-development/wp-playground-cli) mula sa iyong paboritong command line program o ang [Visual Studio Code extension](/developers/local-development/vscode-extension) mula sa IDE na [Visual Studio Code](https://code.visualstudio.com/). + + Halimbawa: ``` git clone git@github.com:WordPress/community-themes.git cd community-themes/blue-note -npx @wp-now/wp-now start +npx @wp-playground/cli server --auto-mount ``` + + ### Idisenyo ang iyong theme gamit ang WordPress UI at i-save ang iyong mga pagbabago bilang Pull Requests + + Maaari mong ikonekta ang iyong Playground instance sa isang GitHub repository at gumawa ng Pull Request na naglalaman ng mga pagbabagong ginawa mo sa pamamagitan ng WordPress UI sa Playground instance, gamit ang plugin na [Create Block Theme](https://wordpress.org/plugins/create-block-theme/). Maaari ka ring gumawa ng mga pagbabago sa theme na iyon at i-export bilang zip. + + Tandaan na kakailanganin mong may naka-install at naka-activate na plugin na [Create Block Theme](https://wordpress.org/plugins/create-block-theme/) sa Playground instance upang magamit ang workflow na ito.

+ + :::tip Check [About Playground > Build > Save changes done on a Block Theme and create GitHub Pull Requests](/about/build#save-changes-done-on-a-block-theme-and-create-github-pull-requests) for more info.