使用 Wordpress 在 Javascript 中使用 PHP

Question

我找到了几篇关于在 JS 中使用 PHP 的文章，但到目前为止没有任何帮助，所以这是我的问题。我需要将 wordpress 帖子内容(标题、摘录和缩略图)调用到 JS“预览”功能中(本质上是使用 ThumbnailGridExpandingPreview 调用帖子)。我已经能够从帖子缩略图和标题打开“扩展预览”，但是我无法将帖子内容添加到预览中。

我正在尝试将 php 调用添加到“grid.js”文件中的预览函数，但是我不确定如何“缩小”php 代码。请参阅下面的代码。

原始代码:

this.$title = $( '<h3></h3>' );

下面是我尝试称呼帖子标题的方式:

this.$title = $( '<h3><?php echo get_the_title(); ?></h3>' );

任何帮助将不胜感激!提前致谢。

Answer 1

一些说明: PHP 是一种服务器端语言；这意味着它只能在服务器端被解析和执行。也就是说，您在这里有两个选择，一个更优雅，另一个有点蹩脚(我只会在非常罕见和有限的情况下使用它):

1. 优雅的解决方案:Wordpress Ajax。在您的 functions.php 文件中设置一个 ajax 可调用函数，该函数返回数据填充的 html:

   一个。将 ajax 可调用操作添加到您的 functions.php 文件:

   add_action("wp_ajax_[function_name]", "function_name");
   //If the action wants users to be logged in, you can specify a different function to be called in case a user is not:
   //add_action("wp_ajax_nopriv_[function_name]", "[function_name_for_non_logged_users]");
   

   指定要调用的函数(为非登录用户指定第二个，以备不时之需)

   function function_name() {
     //It is good practice to use nonce verification
     if (!wp_verify_nonce( $_REQUEST['nonce'], "function_name_nonce")) {
       exit("[Your scary message against bad people]");
     }
   
     // Make your query here.
     $post_id = $_REQUEST["post_id"];
     $post = get_post($id, ARRAY_A);
   
     // Return your data. Here I go with a simple JSON.
     $result = json_encode($result);
     echo $result;
   }
   

   在模板中的某处编写前端代码(很明显，让它可用​​于您的 grid.js 调用)。您需要用您的帖子数据填充 $post。我倾向于使用全局包装器:

   <script type="text/javascript">
       <?php 
       $nonce = wp_create_nonce('function_name_nonce');
       $endpoint = admin_url('admin-ajax.php');
       ?>
       var Globals = {
         nonce: "<?php echo $nonce; ?>", 
         postId: "<?php echo $post->ID; ?>", 
         endpoint: "<?php echo $endpoint; ?>"
       }
   </script>
   

   从现在开始，由您来进行 ajax 调用(我没有对您的代码的任何引用)，但这非常简单:

   $.ajax({
     type: "post",
     dataType: "json",
     url: Globals.endpoint,
     data: {
       action: "function_name", 
       post_id: Globals.postId, 
       nonce: Globals.nonce
     },
     success: function(response) {
       //Aaaaand here's your post data
       console.log(response);
     }
   });
   

   参见 http://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_(action)为此。

   这是一个很好的教程(在谷歌首页找到的):http://wp.smashingmagazine.com/2011/10/18/how-to-use-ajax-in-wordpress/

2. 蹩脚的解决方案:生成数据填充的 JS 代码(我会坚持使用 JS 对象)。在这种情况下，您将需要在页面(模板或任何其他可以访问 PHP 的内容)内添加一个脚本标记，您将在其中输出 JS 有效代码:

   var title = "<?php the_title(); ?>";