Git Product home page Git Product logo

vojay-dev / wp-plugin-boilerplate Goto Github PK

View Code? Open in Web Editor NEW
29.0 1.0 10.0 1.54 MB

WordPress plugin development boilerplate to jumpstart WordPress plugin projects with Docker and Github Actions (includes examples for an admin page, shortcode and Gutenberg block)

Home Page: http://vojay.de/

License: Apache License 2.0

Dockerfile 3.41% Makefile 9.95% Shell 25.68% PHP 42.35% JavaScript 18.61%
boilerplate docker docker-compose php wordpress wordpress-development wordpress-plugin wordpress-site

wp-plugin-boilerplate's Introduction

WordPress plugin development boilerplate

Logo

This project is a WordPress plugin development boilerplate to jumpstart WordPress plugin projects. It utilizes Docker for a local environment and includes an automated setup of WordPress with a configurable admin user and password.

Plugin example

With the boilerplate you get a simple template to get started with a plugin, which includes a dedicated admin page, an example shortcode to be rendered on any page as well as a custom Gutenberg block.

Furthermore it includes a build script and Github Workflow to generate an installable plugin release.

Environment:

  • Docker
  • Linux, macOS

Simply create a fork of this repo and get started by implementing your plugin in an efficient environment.

Setup

  • Fork the project
  • Adjust the plugin name in .env
  • Enable access to the GITHUB_TOKEN for the Github workflow to create releases: Repository settings -> Actions -> General -> Workflow permission -> select Read and write permissions.

Workflow settings

Commands to interact with Docker as well as building the plugin are encapsulated in the Makefile.

Start local WordPress via Docker

make wp-start

This starts a local WordPress and database container. It uses the latest WordPress version and installs the WordPress CLI to automatically setup an admin user with the configured user and password in .env. After the setup is complete, you will get details on how to access WordPress in the log output.

Start WordPress

After starting the Docker setup, you can reach WordPress locally via:

Your plugin is already installed automatically and can be activated!

Plugin example

Stop local WordPress via Docker

make wp-stop

Build plugin

make

This command will trigger the bin/build.sh script with the configured plugin name in .env to create an installable WordPress plugin .zip file.

Build plugin

Also the Github workflow in .github/workflows/build.yml will automatically build the plugin and create a release with the .zip file on any push to main.

Release plugin

Plugin development

The source of your plugin is in src/. There are already examples added, to get started quickly:

  • src/index.php: General setup and global variables / functions
  • src/admin.php: Admin page
  • src/frontend.php: Code to render the custom shortcode
  • src/block.js: Custom Gutenberg block example
  • src/script.js: Custom JS code loaded with your plugin
  • src/style.css: Custom CSS code loaded with your plugin

With the given example, you will get a custom admin page, a shortcode [my-plugin] that will be rendered with a "Hello World!" example as well as a custom Gutenberg block that simply renders a text.

Shortcode:

Shortcode example 1 Shortcode example 2

Gutenberg block:

Gutenberg example

Admin page:

Admin example

From here, you can get started with your plugin within an efficient local environment including a build workflow.

If you use this boilerplate, feel free to star ⭐️ this repo and add your project to this README. Knowledge shared is knowledge squared!

wp-plugin-boilerplate's People

Contributors

vojay-dev avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.