高级自定义字段 wordpress 自定义类

【问题标题】：advanced custom fields wordpress custom class高级自定义字段 wordpress 自定义类
【发布时间】：2017-08-28 11:42:15
【问题描述】：

相对较新的 wordpress 和 ACF，

基本上我有一个自定义字段，它是一个按钮，我需要根据它们所在的页面将其更改为不同的颜色，例如

第 1 页 - 按钮必须为蓝色
第 2 页 - 按钮必须是红色的

但它们都使用相同的 ACF 按钮

有没有办法做到这一点，还是我需要为每个页面创建单独的？

提前致谢。

【问题讨论】：

参考这个链接，stackoverflow.com/questions/41366193/…
好像只和wordpress的管理面板有关？还是我看错了？
您可以为这些按钮提供单独的类，同时在 wordpress 高级自定义字段编辑器中创建页面。然后，您可以轻松地根据 style.css 中的类覆盖按钮颜色。
您还可以在每个页面上创建一个颜色选择器 ACF 并使用它来选择该页面的颜色。只需使用一些内联样式打印出颜色，按钮将根据用户选择进行着色。

标签： php wordpress advanced-custom-fields

【解决方案1】：

Wordpress 为每个页面/帖子的正文元素添加独特的类 - 这可以帮助您实现所需。

首先检查页面的正文元素 - 第 1 页可能有一个类 page-1，第 2 页可能有一个类 page-2。

然后您可以使用 CSS 规则来定位您的按钮：

/* Target Page 1 Button */
.page-1 .btn {
  background-color: red;
}
/* Target Page 2 Button */
.page-2 .btn {
  background-color: blue;
}

或者，您可以使用 WordPress is_page() 函数将唯一的类添加到由页面确定的按钮：

<?php
// e.g. in functions.php
function extraButtonClass() {
  // Target by page slug or ID
  if(is_page('page-1')) {
    return ' red';
  } elseif(is_page('page-2')) {
    return ' blue';
  } else {
    return null;
  }
}

// In template:
<button class="btn<?php echo extraButtonClass(); ?>">My Button</button>

【讨论】：