/* ========================================= */
/* 二、禁止图片点击放大(文章封面+内容图) */
/* ========================================= */
/* 文章封面图:禁止点击、鼠标默认样式 */
.single-head-cover .single-cover img,
.single-head-cover .imgbox-container img {
pointer-events: none !important; /* 禁止点击交互 */
cursor: default !important; /* 鼠标样式恢复默认 */
}
/* 文章内容内所有图片:禁止点击放大 */
.single-content img {
pointer-events: none !important;
cursor: default !important;
}
/* 灯箱/相册/WP自带图片模块:禁止点击 */
body .zoom-img,
body .lightbox-gallery,
body .gallery-item,
body .wp-block-image img {
pointer-events: none !important;
}
放置后台 自定义CSS 中, 此方法 会误伤!
/**
* 为子比主题增加条件性CSS
* 排除整个商城系统(所有商品相关页面)
*/
function zib_add_conditional_disable_image_click_css() {
// 判断是否是商城相关的任何页面
$is_shop_related = false;
// 1. 排除商品列表页(你的 /shop 页面)
$current_page_id = get_queried_object_id();
if ($current_page_id == 458) {
$is_shop_related = true;
}
// 2. 排除所有商品详情页(重要!)
if (is_singular('shop_goods')) { // 子比主题的商品文章类型
$is_shop_related = true;
}
// 3. 排除商品分类页
if (is_tax('shop_cat')) {
$is_shop_related = true;
}
// 4. 排除商品标签页
if (is_tax('shop_tag')) {
$is_shop_related = true;
}
// 5. 根据URL路径排除所有 /shop/ 开头的页面
$request_uri = $_SERVER['REQUEST_URI'];
if (strpos($request_uri, '/shop') === 0 || strpos($request_uri, '/shop/') !== false) {
$is_shop_related = true;
}
// 如果是商城相关页面,不输出限制CSS(图片可以点击)
if ($is_shop_related) {
return;
}
// 非商城页面,输出限制CSS(图片禁止点击)
?>
<style>
.single-head-cover .single-cover img,
.single-head-cover .imgbox-container img,
.single-content img,
body .zoom-img,
body .lightbox-gallery,
body .gallery-item,
body .wp-block-image img {
pointer-events: none !important;
cursor: default !important;
}
</style>
<?php
}
add_action('wp_head', 'zib_add_conditional_disable_image_click_css', 99);
此段代码,添加至 function.php中, 只是禁用文章图片点击,放开shop页面图片点击放大及灯箱效果!
