wordpress 如果高级自定义字段中没有输入,则隐藏Elementor小部件

iqxoj9l9  于 12个月前  发布在  WordPress
关注(0)|答案(1)|浏览(193)

所以问题基本上是,如果有一个没有输入的自定义字段,我可以自动使Elementor小部件不可见吗?
范例:如果用户没有在与该元素关联的ACF字段中键入任何内容,则与ACF关联的动态标记的标题元素在页面上变为不可见。不可见我的意思是隐藏在页面上,然后使其再次出现,并在用户稍后决定在那里输入内容时填充。
多谢了,多谢了
我正在寻找一种方法,不意味着PHP编码。如果真的没有任何解决方案,那么我们可以去PHP,否则坚持一些切换按钮,如果可能的话,为了简单起见。

rkkpypqq

rkkpypqq1#

首先,您需要编辑WordPress主题的functions.php文件或自定义插件。这涉及PHP编码以检查ACF字段值并有条件地打印CSS以隐藏Elementor小部件。
例如:

function hide_elementor_heading_based_on_acf_field() {
    if (is_page()) {
        $field_value = get_field('your_acf_field_name');
        if (empty($field_value)) {
            echo '<style>.elementor-widget-your-heading-widget-class { display: none; }</style>';
        }
    }
}
add_action('wp_head', 'hide_elementor_heading_based_on_acf_field');

字符串
在这段代码中,用ACF字段名替换“acf_field_name”,用elementor小部件的css类替换.elementor-widget-your-heading-widget-class
比第二个JavaScript动态更新:你将需要JavaScript动态显示或(未知)可能隐藏标题元素基于您的ACF字段值。所以也许你可以这样做:

document.addEventListener("DOMContentLoaded", function() {
    var acfField = document.querySelector('[data-acf-field="my_acf_heading"]'); // Adjust the selector to target your ACF field
    var elementorHeading = document.querySelector('.elementor-widget-heading'); // Adjust the selector to target your Elementor Heading widget

    function updateHeadingVisibility() {
        if (acfField && elementorHeading) {
            if (acfField.textContent.trim() === '') {
                elementorHeading.style.display = 'none';
            } else {
                elementorHeading.style.display = 'block';
            }
        }
    }

    // Initial check
    updateHeadingVisibility();


ACF字段和元素或小部件的JavaScript选择器需要特定于您的设置,您可能需要检查输出以获得正确的选择器。

相关问题