如何修改WordPress Uncode主题特定页面（非主菜单）的元素悬停颜色

解决方案 #

你可以通过添加带页面专属类前缀的自定义CSS实现，不会影响站点其他页面样式，操作步骤如下：

1. 确认页面专属类
   打开你的博客页、商店页，按下F12调出开发者工具，查看<body>标签的类属性：
   • 博客页默认会带有blog类
   • WooCommerce商店页默认会带有post-type-archive-product类
     Uncode主题还可能额外添加uncode-blog、uncode-shop专属类，任选一个唯一对应页面的类即可。
2. 写入自定义CSS
   进入WordPress后台，依次点击「外观」-「自定义」-「额外CSS」，将以下代码粘贴进去，颜色值可以按需修改：

   /* 调整博客页悬停文字颜色 */
   .blog a:hover {
     color: #1a1a1a !important;
   }
   
   /* 调整商店页悬停文字颜色 */
   .post-type-archive-product a:hover {
     color: #1a1a1a !important;
   }
   

   如果你只需要修改特定元素（比如仅文章标题、仅产品标题）的悬停颜色，可以用开发者工具选中对应元素，复制它的hover状态选择器，在前面加上页面类前缀即可，优先级更高也不会误改其他元素。
3. 生效验证
   保存修改后，清空Uncode主题缓存、浏览器缓存，如果站点接入了CDN也需要同步清缓存，刷新页面即可看到修改效果。

内容的提问来源于stack exchange，提问作者Can Kaplan