l-1

WordPress笔记

主页/WordPress笔记/博客文章/综合文章/如何使用GitHub和部署工具自动部署WordPress主题的更改

如何使用GitHub和部署工具自动部署WordPress主题的更改

Bug编译狮

Bug编译狮

要使用GitHub和部署工具（如Jekyll、Hugo或静态网站生成器）自动部署WordPress主题的更改，你需要遵循以下步骤：

  1. 初始化GitHub仓库：

    • 在本地计算机上创建一个新的Git仓库。 
      mkdir my-theme-repo
cd my-theme-repo
git init

  2. 克隆远程仓库到本地：

    • 将你的WordPress主题上传到GitHub并将其添加为远程仓库。 
      git remote add origin https://github.com/yourusername/my-theme.git
git pull origin main  # 如果你的主题没有主分支，可以使用 `master` 替代

  3. 配置WordPress主题：

    • 打开你的WordPress主题文件夹中的functions.php文件。
    • 添加或修改以下代码来启用自动更新功能： 
      // 自动更新主题
if ( ! function_exists( 'mytheme_auto_update' ) ) :
 require_once get_template_directory() . '/inc/auto-update.php';
endif;

  4. 创建自定义插件：

    • 创建一个名为auto-update.php的新文件。

    • 在该文件中编写以下PHP代码来实现自动更新功能：

      <?php
/**
* @package My Theme
*/

class MyTheme_Auto_Update {
 public static $instance = null;

 private function __construct() {}

 public static function instance() {
     if (!isset(self::$instance)) {
         self::$instance = new self();
     }
     return self::$instance;
 }

 public function register_hooks() {
     add_action('after_setup_theme', array($this, 'init_auto_update'));
 }

 public function init_auto_update() {
     update_option('autoptimize_cache', false);
     wp_register_script('mytheme-autoupdate', plugins_url('/js/update.js', __FILE__), array(), null, true);

     wp_enqueue_script('mytheme-autoupdate');
     wp_localize_script(
         'mytheme-autoupdate',
         'mytheme_autoupdate_options',
         array(
             'baseurl' => admin_url('admin-ajax.php'),
         )
     );

     add_action('wp_ajax_nopriv_mytheme_autoupdate', array($this, 'ajax_update_check'));
     add_action('wp_ajax_mytheme_autoupdate', array($this, 'ajax_update_check'));

     add_filter('template_include', array($this, 'load_new_version'), 9999);
 }

 public function ajax_update_check() {
     $version = file_get_contents(get_stylesheet_directory() . '/style.css');

     if ($version != get_option('mytheme_latest_version')) {
         echo json_encode(array('status' => 'update_available', 'message' => __('A newer version is available.', 'mytheme')));
         wp_die();
     } else {
         echo json_encode(array('status' => 'no_update', 'message' => __('No updates available.', 'mytheme')));
         wp_die();
     }
 }

 public function load_new_version($template) {
     $latest_version = get_option('mytheme_latest_version');
     $newest_version = file_get_contents(get_stylesheet_directory() . '/style.css');

     if ($latest_version < $newest_version) {
         wp_redirect(home_url());
     }

     return $template;
 }
}

MyTheme_Auto_Update::instance()->register_hooks();
    • 这个插件会在每次用户访问时检查是否有新版本可用。

  5. 测试自动更新功能：

    • 确保你的WordPress主题目录结构正确，并且所有相关文件都在正确的路径下。
    • 浏览器打开你的WordPress站点，然后刷新页面查看是否能自动加载新版本。

  6. 部署到GitHub Pages：

    • 使用部署工具（如GitHub Actions、Netlify等）部署你的GitHub仓库到GitHub Pages。
    • 设置部署脚本，确保每次推送时都能自动部署最新的主题。

通过以上步骤，你可以使用GitHub和部署工具来自动管理WordPress主题的更新，从而保持你的网站始终最新。

黑板前的Bug语法讲师

黑板前的Bug语法讲师

1. 安装GitHub

首先，你需要安装一个GitHub客户端或API密钥，以便通过它与GitHub服务器建立连接并获取信息。

示例代码：

curl https://api.github.com/user/repos | jq '.[].name' > wordpress-repo-name.txt

解释：

此命令使用curl和jq（基于Perl）来从GitHub API获取用户的所有仓库列表。然后，它将这些名称存储在一个文本文件中，名为wordpress-repo-name.txt。

2. 创建并提交变更

一旦你有了一个新的WordPress主题，你可以创建一个新仓库并将该主题推送到GitHub上。以下是如何操作的步骤：

示例代码：

git init
git add . # 将当前目录下的所有文件添加到暂存区
git commit -m "Initial commit"
git push origin master

解释：

  • git init: 初始化一个新的Git仓库。
  • git add .: 将当前目录下所有的文件都添加到暂存区。
  • git commit -m "Initial commit": 这里，“Initial commit”是你想要的主题的简短描述。
  • git push origin master: 将本地仓库的内容推送到远程GitHub仓库中的master分支。

3. 使用GitHub Actions部署WordPress

现在，你可以使用GitHub Actions来自动化WordPress的部署过程。GitHub Actions允许你使用CI/CD工具执行一系列的任务，如构建、测试和部署应用。

示例代码：

on:
  push:
    branches:
      - master

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v2
      - name: Install dependencies
        run: npm install
      - name: Build WordPress theme
        run: npm run build
      - name: Deploy to GitHub Pages
        uses: actions/upload-artifact@v2
        with:
          name: wordpress-theme
          path: ./build

解释：

  • on: push: 当push事件发生时触发此动作。
  • branches: master: 检查是否为master分支。
  • steps:：列出要执行的步骤。
    • - name: Checkout code: 下载仓库。
    • - name: Install dependencies: 安装依赖项。
    • - name: Build WordPress theme: 构建主题。
    • - name: Deploy to GitHub Pages: 将构建后的主题上传到GitHub Pages。

总结

以上展示了如何使用GitHub和GitHub Actions自动部署WordPress主题的更改。通过这种方式，你可以更轻松地管理主题的版本控制和发布流程，同时确保每次更新都能自动部署到生产环境。

, ,

最新更新