集成自定义支付网关到WooCommerce结账区块的指南

118830

在开始之前，确保你已经查看了如何创建WooCommerce支付网关的完整指南（重要的是在阅读这篇文章之前先阅读那个）。但是，如果你正在使用WooCommerce的最新版本（我认为是从8.3开始），你可能会发现你的自定义支付方式没有出现在结账区块中。

图片[1]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

比如说，如果你试图在商店里禁用除了你自定义的支付方式以外的所有支付方式，你可能会遇到以下的错误信息：

图片[2]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

虽然使用旧版的

短代码时一切正常，但很明显，以前的支付网关教程现在可能不够全面了。

不过别担心，我们有了一个新教程来填补这个空白。我会一步步带你了解如何为WooCommerce的购物车和结账区块添加一个自定义支付方式，以确保它与最新版本兼容。

到本教程结束时，我们的目标是：

图片[3]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

当然，我也会教你一些额外的小技巧，比如给你的支付方式加上一个自定义图标。

服务器端集成 

首先，我们将从服务器端的集成开始。我知道你们很多人可能更喜欢使用PHP来开发，而不是JavaScript和React，所以我们就从简单的部分开始吧。

注册一个块支持 PHP 类 

区块支持PHP类”是一个PHP类，用于处理我们的支付网关，除了主要的支付网关类外。我们将用以下简单的代码片段来注册它，这个过程和我们之前在woocommerce_payment_gateways钩子中注册主网关类的方式很相似。

add_action( 'woocommerce_blocks_loaded', 'rudr_gateway_block_support' );
function rudr_gateway_block_support() {
// if( ! class_exists( 'Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType' ) ) {
// return;
// }
// 在这里引入 "gateway block support class" 文件
require_once __DIR__ . '/includes/class-wc-misha-gateway-blocks-support.php';
// 注册我们刚才引入的 PHP 类
add_action(
'woocommerce_blocks_payment_method_type_registration',
function( Automattic\WooCommerce\Blocks\Payments\PaymentMethodRegistry $payment_method_registry ) {
$payment_method_registry->register( new WC_Misha_Gateway_Blocks_Support );
}
);
}
add_action( 'woocommerce_blocks_loaded', 'rudr_gateway_block_support' );

function rudr_gateway_block_support() {

// if( ! class_exists( 'Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType' ) ) {

// return;

// }

// 在这里引入 "gateway block support class" 文件

require_once __DIR__ . '/includes/class-wc-misha-gateway-blocks-support.php';

// 注册我们刚才引入的 PHP 类

add_action(

'woocommerce_blocks_payment_method_type_registration',

function( Automattic\WooCommerce\Blocks\Payments\PaymentMethodRegistry $payment_method_registry ) {

$payment_method_registry->register( new WC_Misha_Gateway_Blocks_Support );

}

);

}
add_action( 'woocommerce_blocks_loaded', 'rudr_gateway_block_support' );

function rudr_gateway_block_support() {

// if( ! class_exists( 'Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType' ) ) {

// return;

// }

// 在这里引入 "gateway block support class" 文件

require_once __DIR__ . '/includes/class-wc-misha-gateway-blocks-support.php';

// 注册我们刚才引入的 PHP 类

add_action(

'woocommerce_blocks_payment_method_type_registration',

function( Automattic\WooCommerce\Blocks\Payments\PaymentMethodRegistry $payment_method_registry ) {

$payment_method_registry->register( new WC_Misha_Gateway_Blocks_Support );

}

);

}

请记住以下几点：

  • 我去掉了class_exists()这个条件，因为我们现在不需要它了。这是因为结账区块已经成为WooCommerce的一部分，不再是一个单独的插件。
  • 我们的区块支持PHP类将被放在一个独立的文件中，我们会在接下来的步骤中详细讨论这个文件，它的名字是class-wc-misha-gateway-blocks-support.php。

块支持 PHP 类 

在这一部分，我将会创建一个名为WC_Misha_Gateway_Blocks_Support的PHP类，这个类将扩展WooCommerce的AbstractPaymentMethodType类。同时，请记住我们已经有了一个名为WC_Misha_Gateway的类，它扩展了WC_Payment_Gateway。

对于我自己，我会把这个新的类文件放到includes/class-wc-misha-gateway-blocks-support.php中。

<?php
use Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType;
final class WC_Misha_Gateway_Blocks_Support extends AbstractPaymentMethodType {
  
  private $gateway;
  
  protected $name = 'misha'; // payment gateway id
  public function initialize() {
    // get payment gateway settings
    $this->settings = get_option( "woocommerce_{$this->name}_settings", array() );
    
    // you can also initialize your payment gateway here
    // $gateways = WC()->payment_gateways->payment_gateways();
    // $this->gateway  = $gateways[ $this->name ];
  }
  public function is_active() {
    return ! empty( $this->settings[ 'enabled' ] ) && 'yes' === $this->settings[ 'enabled' ];
  }
  public function get_payment_method_script_handles() {
    wp_register_script(
      'wc-misha-blocks-integration',
      plugin_dir_url( __DIR__ ) . 'build/index.js',
      array(
        'wc-blocks-registry',
        'wc-settings',
        'wp-element',
        'wp-html-entities',
      ),
      null, // or time() or filemtime( ... ) to skip caching
      true
    );
    return array( 'wc-misha-blocks-integration' );
  }
  public function get_payment_method_data() {
    return array(
      'title'        => $this->get_setting( 'title' ),
      // almost the same way:
      // 'title'     => isset( $this->settings[ 'title' ] ) ? $this->settings[ 'title' ] : 'Default value';
      'description'  => $this->get_setting( 'description' ),
      // if $this->gateway was initialized on line 15
      // 'supports'  => array_filter( $this->gateway->supports, [ $this->gateway, 'supports' ] ),
      // example of getting a public key
      // 'publicKey' => $this->get_publishable_key(),
    );
  }
  //private function get_publishable_key() {
  //  $test_mode   = ( ! empty( $this->settings[ 'testmode' ] ) && 'yes' === $this->settings[ 'testmode' ] );
  //  $setting_key = $test_mode ? 'test_publishable_key' : 'publishable_key';
  //  return ! empty( $this->settings[ $setting_key ] ) ? $this->settings[ $setting_key ] : '';
  //}
}
<?php
use Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType;
final class WC_Misha_Gateway_Blocks_Support extends AbstractPaymentMethodType {
  
  private $gateway;
  
  protected $name = 'misha'; // payment gateway id
  public function initialize() {
    // get payment gateway settings
    $this->settings = get_option( "woocommerce_{$this->name}_settings", array() );
    
    // you can also initialize your payment gateway here
    // $gateways = WC()->payment_gateways->payment_gateways();
    // $this->gateway  = $gateways[ $this->name ];
  }
  public function is_active() {
    return ! empty( $this->settings[ 'enabled' ] ) && 'yes' === $this->settings[ 'enabled' ];
  }
  public function get_payment_method_script_handles() {
    wp_register_script(
      'wc-misha-blocks-integration',
      plugin_dir_url( __DIR__ ) . 'build/index.js',
      array(
        'wc-blocks-registry',
        'wc-settings',
        'wp-element',
        'wp-html-entities',
      ),
      null, // or time() or filemtime( ... ) to skip caching
      true
    );
    return array( 'wc-misha-blocks-integration' );
  }
  public function get_payment_method_data() {
    return array(
      'title'        => $this->get_setting( 'title' ),
      // almost the same way:
      // 'title'     => isset( $this->settings[ 'title' ] ) ? $this->settings[ 'title' ] : 'Default value';
      'description'  => $this->get_setting( 'description' ),
      // if $this->gateway was initialized on line 15
      // 'supports'  => array_filter( $this->gateway->supports, [ $this->gateway, 'supports' ] ),
      // example of getting a public key
      // 'publicKey' => $this->get_publishable_key(),
    );
  }
  //private function get_publishable_key() {
  //  $test_mode   = ( ! empty( $this->settings[ 'testmode' ] ) && 'yes' === $this->settings[ 'testmode' ] );
  //  $setting_key = $test_mode ? 'test_publishable_key' : 'publishable_key';
  //  return ! empty( $this->settings[ $setting_key ] ) ? $this->settings[ $setting_key ] : '';
  //}
}
<?php
use Automattic\WooCommerce\Blocks\Payments\Integrations\AbstractPaymentMethodType;
final class WC_Misha_Gateway_Blocks_Support extends AbstractPaymentMethodType {
	
	private $gateway;
	
	protected $name = 'misha'; // payment gateway id
	public function initialize() {
		// get payment gateway settings
		$this->settings = get_option( "woocommerce_{$this->name}_settings", array() );
		
		// you can also initialize your payment gateway here
		// $gateways = WC()->payment_gateways->payment_gateways();
		// $this->gateway  = $gateways[ $this->name ];
	}
	public function is_active() {
		return ! empty( $this->settings[ 'enabled' ] ) && 'yes' === $this->settings[ 'enabled' ];
	}
	public function get_payment_method_script_handles() {
		wp_register_script(
			'wc-misha-blocks-integration',
			plugin_dir_url( __DIR__ ) . 'build/index.js',
			array(
				'wc-blocks-registry',
				'wc-settings',
				'wp-element',
				'wp-html-entities',
			),
			null, // or time() or filemtime( ... ) to skip caching
			true
		);
		return array( 'wc-misha-blocks-integration' );
	}
	public function get_payment_method_data() {
		return array(
			'title'        => $this->get_setting( 'title' ),
			// almost the same way:
			// 'title'     => isset( $this->settings[ 'title' ] ) ? $this->settings[ 'title' ] : 'Default value';
			'description'  => $this->get_setting( 'description' ),
			// if $this->gateway was initialized on line 15
			// 'supports'  => array_filter( $this->gateway->supports, [ $this->gateway, 'supports' ] ),
			// example of getting a public key
			// 'publicKey' => $this->get_publishable_key(),
		);
	}
	//private function get_publishable_key() {
	//	$test_mode   = ( ! empty( $this->settings[ 'testmode' ] ) && 'yes' === $this->settings[ 'testmode' ] );
	//	$setting_key = $test_mode ? 'test_publishable_key' : 'publishable_key';
	//	return ! empty( $this->settings[ $setting_key ] ) ? $this->settings[ $setting_key ] : '';
	//}
}

让我们先来看看这个类的属性和方法：

属性:

  • $name：这是支付网关的唯一标识符。
  • $gateway：这里可以存放支付网关对象的实例，但这不是强制的，因此我在代码中没有包括这部分。

方法:

  • is_active()：这个方法用来检查支付方式是否激活。
  • get_payment_method_script_handles()：这里是添加JavaScript文件的地方，这些文件包含客户端部分的集成代码。
  • get_payment_method_data()：这个方法提供了所有你需要在前端使用的数据，以关联数组的形式呈现。

你还可以利用index.asset.php来获取脚本的版本和依赖项。

public function get_payment_method_script_handles() {
  $asset_path   = plugin_dir_path( __DIR__ ) . 'build/index.asset.php';
  $version      = null;
  $dependencies = array();
  if( file_exists( $asset_path ) ) {
    $asset        = require $asset_path;
    $version      = isset( $asset[ 'version' ] ) ? $asset[ 'version' ] : $version;
    $dependencies = isset( $asset[ 'dependencies' ] ) ? $asset[ 'dependencies' ] : $dependencies;
  }
  
  wp_register_script( 
    'wc-misha-blocks-integration', 
    plugin_dir_url( __DIR__ ) . 'build/index.js', 
    $dependencies, 
    $version, 
    true 
  );
  return array( 'wc-misha-blocks-integration' );
}
public function get_payment_method_script_handles() {
  $asset_path   = plugin_dir_path( __DIR__ ) . 'build/index.asset.php';
  $version      = null;
  $dependencies = array();
  if( file_exists( $asset_path ) ) {
    $asset        = require $asset_path;
    $version      = isset( $asset[ 'version' ] ) ? $asset[ 'version' ] : $version;
    $dependencies = isset( $asset[ 'dependencies' ] ) ? $asset[ 'dependencies' ] : $dependencies;
  }
  
  wp_register_script( 
    'wc-misha-blocks-integration', 
    plugin_dir_url( __DIR__ ) . 'build/index.js', 
    $dependencies, 
    $version, 
    true 
  );
  return array( 'wc-misha-blocks-integration' );
}
public function get_payment_method_script_handles() {
	$asset_path   = plugin_dir_path( __DIR__ ) . 'build/index.asset.php';
	$version      = null;
	$dependencies = array();
	if( file_exists( $asset_path ) ) {
		$asset        = require $asset_path;
		$version      = isset( $asset[ 'version' ] ) ? $asset[ 'version' ] : $version;
		$dependencies = isset( $asset[ 'dependencies' ] ) ? $asset[ 'dependencies' ] : $dependencies;
	}
	
	wp_register_script( 
		'wc-misha-blocks-integration', 
		plugin_dir_url( __DIR__ ) . 'build/index.js', 
		$dependencies, 
		$version, 
		true 
	);
	return array( 'wc-misha-blocks-integration' );
}

声明兼容性 

当你的支付方式不支持WooCommerce的结账区块时，这部分特别重要。

当用户在Gutenberg编辑器里编辑结账页面时，他们会看到一个提示信息：

图片[4]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

方法如下：

add_action( 'before_woocommerce_init', 'rudr_cart_checkout_blocks_compatibility' );
function rudr_cart_checkout_blocks_compatibility() {
    if( class_exists( '\Automattic\WooCommerce\Utilities\FeaturesUtil' ) ) {
        \Automattic\WooCommerce\Utilities\FeaturesUtil::declare_compatibility(
        'cart_checkout_blocks',
        __FILE__,
        false // true (compatible, default) or false (not compatible)
      );
    }
    
}
add_action( 'before_woocommerce_init', 'rudr_cart_checkout_blocks_compatibility' );
function rudr_cart_checkout_blocks_compatibility() {
    if( class_exists( '\Automattic\WooCommerce\Utilities\FeaturesUtil' ) ) {
        \Automattic\WooCommerce\Utilities\FeaturesUtil::declare_compatibility(
        'cart_checkout_blocks',
        __FILE__,
        false // true (compatible, default) or false (not compatible)
      );
    }
    
}
add_action( 'before_woocommerce_init', 'rudr_cart_checkout_blocks_compatibility' );
function rudr_cart_checkout_blocks_compatibility() {
    if( class_exists( '\Automattic\WooCommerce\Utilities\FeaturesUtil' ) ) {
        \Automattic\WooCommerce\Utilities\FeaturesUtil::declare_compatibility(
				'cart_checkout_blocks',
				__FILE__,
				false // true (compatible, default) or false (not compatible)
			);
    }
		
}

客户端集成 

设置项目 

我想让这个教程保持非常简单，所以我会使用@wordpress/scripts来完成。

在构建过程中，你当然可以进行更深入的配置，比如设置WooCommerce的混合构建，这样你就能使用import { registerPaymentMethod } from ....这样的代码。

这是我的文件夹结构看起来的样子：

图片[5]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

为 WooCommerce Checkout 区块注册自定义付款方式 

这是/src/index.js文件的内容，以便于您更好地理解

import { decodeEntities } from '@wordpress/html-entities';
const { registerPaymentMethod } = window.wc.wcBlocksRegistry
const { getSetting } = window.wc.wcSettings
const settings = getSetting( 'misha_data', {} )
const label = decodeEntities( settings.title )
const Content = () => {
  return decodeEntities( settings.description || '' )
}
const Label = ( props ) => {
  const { PaymentMethodLabel } = props.components
  return <PaymentMethodLabel text={ label } />
}
registerPaymentMethod( {
  name: "misha",
  label: <Label />,
  content: <Content />,
  edit: <Content />,
  canMakePayment: () => true,
  ariaLabel: label,
  supports: {
    features: settings.supports,
  }
})
import { decodeEntities } from '@wordpress/html-entities';
const { registerPaymentMethod } = window.wc.wcBlocksRegistry
const { getSetting } = window.wc.wcSettings
const settings = getSetting( 'misha_data', {} )
const label = decodeEntities( settings.title )
const Content = () => {
  return decodeEntities( settings.description || '' )
}
const Label = ( props ) => {
  const { PaymentMethodLabel } = props.components
  return <PaymentMethodLabel text={ label } />
}
registerPaymentMethod( {
  name: "misha",
  label: <Label />,
  content: <Content />,
  edit: <Content />,
  canMakePayment: () => true,
  ariaLabel: label,
  supports: {
    features: settings.supports,
  }
})
import { decodeEntities } from '@wordpress/html-entities';
const { registerPaymentMethod } = window.wc.wcBlocksRegistry
const { getSetting } = window.wc.wcSettings
const settings = getSetting( 'misha_data', {} )
const label = decodeEntities( settings.title )
const Content = () => {
	return decodeEntities( settings.description || '' )
}
const Label = ( props ) => {
	const { PaymentMethodLabel } = props.components
	return <PaymentMethodLabel text={ label } />
}
registerPaymentMethod( {
	name: "misha",
	label: <Label />,
	content: <Content />,
	edit: <Content />,
	canMakePayment: () => true,
	ariaLabel: label,
	supports: {
		features: settings.supports,
	}
})

也许深入探讨registerPaymentMethod()和registerExpressPaymentMethod()会很有帮助，但我打算在我的博客的下一篇教程里更详细地讲解这些例子。

最后，恭喜你完成了这一步！

图片[6]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

如果您想知道付款方式标题和说明的来源：

图片[7]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

添加付款方式图标 

因为我承诺会给你更多的例子，而你可能不想等待下一篇教程，所以我们现在就开始吧。

我要做的是在WooCommerce结账区块的自定义支付网关旁边展示一个图标：

图片[8]-集成自定义支付网关到WooCommerce结账区块的指南-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

首先，我们来调整我们的区块支持PHP类，特别是get_payment_method_data()方法，在那里我们会增加一个新的参数：

public function get_payment_method_data() {
  return array(
    'title'        => $this->get_setting( 'title' ),
    'description'  => $this->get_setting( 'description' ),
    'icon'         => plugin_dir_url( __DIR__ ) . 'assets/icon.png',
    
    ...
public function get_payment_method_data() {
  return array(
    'title'        => $this->get_setting( 'title' ),
    'description'  => $this->get_setting( 'description' ),
    'icon'         => plugin_dir_url( __DIR__ ) . 'assets/icon.png',
    
    ...
public function get_payment_method_data() {
	return array(
		'title'        => $this->get_setting( 'title' ),
		'description'  => $this->get_setting( 'description' ),
		'icon'         => plugin_dir_url( __DIR__ ) . 'assets/icon.png',
		
		...

然后我建议为其创建另一个 React 组件：

const Icon = () => {
  return settings.icon 
    ? <img src={settings.icon} style={{ float: 'right', marginRight: '20px' }} /> 
    : ''
}
const Label = () => {
  return (
        <span style={{ width: '100%' }}>
            {label}
            <Icon />
        </span>
    );
};
const Icon = () => {
  return settings.icon 
    ? <img src={settings.icon} style={{ float: 'right', marginRight: '20px' }} /> 
    : ''
}
const Label = () => {
  return (
        <span style={{ width: '100%' }}>
            {label}
            <Icon />
        </span>
    );
};
const Icon = () => {
	return settings.icon 
		? <img src={settings.icon} style={{ float: 'right', marginRight: '20px' }} /> 
		: ''
}
const Label = () => {
	return (
        <span style={{ width: '100%' }}>
            {label}
            <Icon />
        </span>
    );
};

如果没有提供图标的图片链接，那么<img>标签就不会显示，这真是太好了！


联系我们
文章看不懂？联系我们为您免费解答！免费助力个人，小企站点！
① 电话：020-2206-9892
② QQ咨询：1025174874
③ 邮件：info@361sale.com
④ 工作时间：周一至周五，9:30-18:30，节假日休息
© 转载声明
本文作者：Harry

本文链接：https://www.361sale.com/6209
文章版权归作者所有，转载务必注明来源。

THE END
WordPress资讯WordPressWordPress资讯
# WooCommerce自定义支付# 结账区块集成
喜欢就支持一下吧
点赞0 分享
Harry的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应
相关推荐
评论 共1条

请登录后发表评论

    只看作者
用户封面
Harry的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应
贼将鼠胆的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应钻石会员

贼将鼠胆徽章-小有名气-光子波动网 | 专业WordPress修复服务，全球范围，快速响应4月18日 16:430

名字取挺好
善良的农村人的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

善良的农村人4月18日 11:390

当插件与主题冲突导致页面加载缓慢时，可以通过禁用插件逐个排查冲突、更新插件和主题版本、调整插件设置减少资源消耗、使用兼容性检查工具如 "Health Check & Troubleshooting" 排查问题，并启用缓存插件和优化工具来提升网站性能，确保插件与主题的兼容性和网站的快速加载。
骑大姑扒大姨的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

骑大姑扒大姨4月17日 19:320

当 WordPress 显示“对不起，您无权访问此页面”时，通常是因为账户权限被错误更改。可通过两种方式解决：如果能访问数据库，可在 phpMyAdmin 中修改用户权限字段恢复管理员身份；如果无法登录后台或操作数据库，也可以通过 FTP 临时在主题的 functions.php 中添加代码，创建一个新的管理员账户登录后台修复权限。两种方法都能有效恢复访问权限，操作前建议先备份网站数据。
雷克塞的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

雷克塞4月16日 17:391

如果 Elementor 编辑器一直卡在加载界面或者出现空白，别急，这种情况其实挺常见的，通常是缓存、插件冲突、主题问题或内存不足引起的。你可以一步步试着排查： 先打开 Elementor 的“安全模式”，看看是不是有插件或主题冲突。 把缓存插件暂时关闭，同时清一下浏览器和网站缓存。 尝试把主题切换成 WordPress 默认主题，比如 Twenty Twenty-Four，测试一下编辑器能不能正常打开。 查看 Elementor > 系统信息里的 PHP 内存是否至少有 256M，如果不够，可以让服务器管理员帮忙调高。 用浏览器的开发者工具（按 F12）看看有没有红色报错，能帮你更快定位问题。 确保 Elementor 和你安装的插件都是最新版，有时版本不匹配也会出问题。 最后在 Elementor > 工具里点一下“重新生成 CSS”，有时候能解决加载问题。 如果这些方法你都试过了还不行，那就需要看下服务器的错误日志，或者发给 Elementor 的技术支持帮忙看一下也行。这个问题大多数时候都能解决，不用太担心。
小兵的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

小兵4月15日 16:170

WordPress 编辑器保存内容后丢失，常见原因包括插件或主题冲突、缓存问题、数据库写入失败、REST API 被阻断或浏览器干扰。建议依次排查插件、清除缓存、切换默认主题、检查站点健康及调试日志，逐步定位问题。
贼将鼠胆的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应钻石会员

贼将鼠胆徽章-小有名气-光子波动网 | 专业WordPress修复服务，全球范围，快速响应4月14日 17:590

如果在 WordPress 中自定义字体无法生效，可能是由于字体文件路径不正确、CSS 选择器应用错误、字体格式不兼容或 CSS 优先级问题。确保字体文件正确加载并使用兼容的格式，同时检查 CSS 规则是否正确应用到目标元素。如果主题设置覆盖了自定义字体，还需调整相关设置。另外，清除缓存并使用浏览器开发者工具检查是否有其他 CSS 规则覆盖了字体设置。
浙江斑鬣狗的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

浙江斑鬣狗4月14日 17:111

数据库操作：使用 SQL 查询删除 wp_postmeta 表中与 All in One SEO 相关的所有元数据。 插件重置功能：在 All in One SEO 插件设置中查找重置或清除数据的选项。 WordPress CLI：使用命令行工具批量删除与插件相关的元数据。 手动删除：通过 WordPress 后台编辑页面逐个删除 SEO 信息。
raincloud2024的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

奇怪呀徽章-人气佳作-光子波动网 | 专业WordPress修复服务，全球范围，快速响应4月12日 16:000

网络问题