Question

好的，我想在主要内容区域的页脚中加载一个小部件，但我不希望它在页面加载时加载。

我理想的做法是将小部件加载到其位置，然后点击此处加载按钮＆＃34; （持有一段文本/代码），但实际上并没有加载小部件内容，直到该按钮被点击为止。

有任何简单的方法吗？

感谢。

Answer 1

如果没有看到有效的方式或现场网站，这就是我能给你的所有反馈。您基本上需要向.php文件发出AJAX请求，您可以使用get请求执行此操作。 PHP文件需要返回短代码的输出，因此根据您使用的库插件，它们可能具有特定于PHP的实现，否则do_shortcode()允许您在PHP中运行短代码。

然后将AJAX请求绑定到按钮上的单击事件，并将输出呈现给另一个容器，并隐藏按钮。

请确保将JS包装在文档就绪函数中，如下所示，因为默认情况下WordPress启用了无冲突模式，这会使您的$用法失效。在您的HTML中包含jQuery之后，您当然需要包含此内容，理想情况下，将此代码粘贴到footer.php文件的底部，位于结束</body>标记之上。

所有这一切都是切换＆＃34;隐藏＆＃34;在画廊部分

<强> HTML

<div class="gallery-container"> 

  <button id="showGallery">Show Gallery</button>

  <div id="galleryShortcode"></div>

</div>

PHP

<?php echo do_shortcode('shortcodeHere'); ?>

<强>的jQuery

jQuery(document).ready(function($) {

  $('#showGallery').on('click', function() {

    $.get( "shortcode-return.php", function( data ) {
      $( "#galleryShortcode" ).html( data );
    });

   $(this).hide(); //hide the button after data is rendered into element

  });


});

如何在点击时加载Wordpress小部件

1 个答案: