GitHub

This tutorial will guide you through the process of creating a new GitHub repository for a WordPress plugin called “Info Block,” which allows you to distribute your custom block across various websites using GitHub and Self-Hoster plugin integration.

Create GitHub Repository

1. Give it a name
2. Choose if repository needs to be:
   • Public – Everyone can see it
   • Private – Only you can see it after you logint

1

2

Create Gutenberg block

Open a terminal and prepare your plugin directory:

• Drag your plugin folder into the terminal to set the working directory.
• npx @wordpress/create-block@latest hoster-info-block

Exclude Unnecessary Files from GitHub Repo

Configure .gitignore to exclude node modules and other unnecessary files.

• In your repository, create a .gitignore file and add entries for node_modules/, and other directories/files that should not be tracked by Git.
• Commit the changes to .gitignore.

GitHub Actions for Automatic Releases

.gitignore
plugin-root-file.php
├── assets/
│   └── style.css
├── inc/
│   └── updater.php
└── .github/
    └── workflows/
        └── release.yml

Create GitHub workflows for automated releases:

• In your GitHub repository, navigate to the ‘Actions’ tab and set up a new workflow.
• Configure the workflow to handle build processes, such as compiling code or packaging the release.
• Include steps to tag each release, which will trigger the workflow to build and publish your plugin.

GitHub Secrets for Authentication

Create a GitHub token for automation:

• Go to your GitHub settings, navigate to ‘Developer settings’, and then to ‘Personal access tokens’.
  https://github.com/settings/tokens
• Generate a new token with the necessary permissions (e.g., repo, workflow) and name it appropriately.
• Save this token as a secret in your GitHub repository under ‘Settings’ > ‘Secrets’. This token will authenticate GitHub actions to perform tasks like pushing updates.

Add token to the repository

Under repo > Settings on the left side find Secrets and variables and click on the “Actions”

1

Then click on the New repository secret

Add a name to the secret and paste password from your “Personal access token”.

I usually call Secret name and Personal token the same to be easier to track.

In release.yml replace “GITHUB_TOKEN” to “YOUR_SECRET_NAME”

Step 6: Deploy and Test Your Plugin

To trigger the release create a new tag same as version number. 0.0.1, 0.0.2 …

Once tag is submitted it will trigger Github action that will create release zip.

Public Repository

Fetch Github releases

Switch from media library to GitHub Repository by toggling on “GitHub Repository“

1

1

2

1

2

Monitor automatic updates:

• With each new tag pushed to GitHub, the workflow triggers the build and release processes.
• Self-Hoster detects the new release and automatically fetches updates, allowing users to update their installed plugin through the WordPress dashboard.

Connect GitHub Account

Not connected

Connected

With connected account you can fetch public and private repositories

To connect the account you will need to do 3 steps.

1. Open GitHub Settings page
2. Create GutHub App
3. Grand permissions

Private Repository