在 Wordpress 简码中嵌入 PHP 文件 + 目录

Question

我正在尝试创建一个 Wordpress 插件，它将我创建的 PHP/HTML 文件嵌入到带有网站页眉/页脚的帖子中。

我尝试使用常规 iFrame 以及插件 Advanced iFrame 来嵌入它，它可以工作并包含目录的 javascript/CSS 文件。但是，每当页面调整大小（UI 元素滑入和滑出）时，iframe 和 Advanced iFrame 并不总是能正确处理它。

然后我考虑创建一个插件简码，这就是我目前所拥有的：

<?php
/*
Plugin Name: Calculator
Plugin URI: 
Description: Calculator
Version: 1.0
Author: Andrew
*/

add_shortcode("calculator", "create");

function create() {    
    include(plugin_dir_path(__FILE__).'calculator.php'); 
}
?>

在页面本身中，我包含了[calculator] 短代码。当我加载页面时，它会加载标题，但是下面的所有内容（通常会生成短代码）都是一个空白页面。甚至不包括页脚。

插件文件夹的结构如下：

calculator/
    plugin.php //What is shown above
    calculator.php //Contains HTML UI and PHP code
    calculator.js //Contains UI functions
    calculator_style.css //CSS referenced relatively in calculator.php
    fonts/
        //various fonts for calculator_style.css
    js/
        jquery-1.9.0.min.js //jQuery referenced relatively in calculator.php
        //Other various JS files for calculator.php
    fpdf/
        fpdf.php //FPDF, used to create a PDF printout in calculator.php
        fonts/ 
            //various fonts for FPDF

我对 Wordpress 插件不是很熟悉，但我希望将calculator.php 嵌入到帖子中，并且仍然能够正确引用其 CSS/JS 文件。

我还希望不必重新编写calculator.php 文件来使用Wordpress PHP 函数来引用插件文件夹中的本地文件。

这可以使用简码吗？还是有另一种/更好的方式在 Wordpress 帖子中嵌入目录/PHP 文件？

编辑：更多信息，这就是calculator.php 的样子。

<?php
    require './fpdf/fpdf.php';

    $jsonData = json_decode($_POST['data'], true);  
    if ($jsonData != NULL) {    
        //Create PDF and return if the page is given POST data
    }
?>
<form id="pdfSave" action="" method="POST" enctype="multipart/form-data">
    <div><input id="name" class="boxField" type="text"></div>
    <div><input id="company" class="boxField" type="text"></div>
    <div><input id="phone" class="boxField" type="text"></div>
    <div><input id="email" class="boxField" type="text"></div>
    <div><input id="logo" name="final-logo" class="boxField" type="file"></div>
</form>
<button id="loanInfoSettings" class="boxButtonBack" onclick="saveForm();">Save</button>
//Other HTML calculator-UI stuff

所以本质上，当用户第一次加载页面时，还没有发送任何 POST 数据，因此显示了 HTML 计算器，其中包括各种功能和一个表单。用户完成后，单击保存按钮，该按钮调用同一页面并向其发送 POST 数据。这一次，当页面加载 POST 数据时，会生成 PDF 而不是显示 HTML。

所以我需要一种方法来包含calculator.php，当加载Wordpress帖子时，会显示HTML计算器和表单，当通过JavaScript提交表单时，要么是帖子，要么只是嵌入的calculator.php，使用 POST 数据刷新并生成 PDF。

编辑 2：我已经尝试过显示它：

static function handle_shortcode($atts) {;
    self::$add_script = true;
    wp_enqueue_style('calculatorstyle');
    // actual shortcode handling here
include(plugins_url( 'netsheet.php', __FILE__ ));
}

我还读到输出缓冲区应该是用来输出PHP文件的，所以我尝试了

static function handle_shortcode($atts) {;
    self::$add_script = true;
    wp_enqueue_style('calculatorstyle');
ob_start();
include(plugins_url( 'netsheet.php', __FILE__ ));
return ob_get_clean();
}

编辑 3：只做包含：

static function handle_shortcode($atts) {;
    self::$add_script = true;
    wp_enqueue_style('calculatorstyle');
    // actual shortcode handling here
    include 'netsheet.php';
}

导致页面在到达短代码时停止渲染，从而产生一个页眉，然后是一个没有页脚的空白区域。

Answer 1

是的，短代码是一个很好的工具，可以通过插件来完成。问题是你不能把所有东西都塞进include('calculator.php')。这应该只处理标记，它不应该输出任何内容，因为它必须返回一个字符串。

这里是改编自 How to load JavaScript like a WordPress Master 的示例插件。我已经添加了 CSS enqueue，但它不能使用绝地技巧在标题中打印它，但仍然有效。一个重要的注意事项是你必须使用 WP 捆绑的 jQuery（不是你自己的）并使用WP noConflict 模式。

<?php
/**
 * Plugin Name: Shorcode Jedi
 * Plugin URL: http://scribu.net/wordpress/optimal-script-loading.html
 * Author: scribu
 */

class My_Shortcode {
    static $add_script;

    static function init() {
        add_shortcode( 'myshortcode', array( __CLASS__, 'handle_shortcode' ) );
        add_action( 'init', array( __CLASS__, 'register_script_and_style' ) );
        add_action( 'wp_head', array( __CLASS__, 'print_styles' ), 999 );
        add_action( 'wp_footer', array( __CLASS__, 'print_script' ) );
    }

    static function handle_shortcode($atts) {;
        self::$add_script = true;
        wp_enqueue_style('my-style');
        // actual shortcode handling here
        return 'Hello, World!';
    }

    static function register_script_and_style() {
        wp_register_script( 'my-script', plugins_url( 'my-script.js', __FILE__ ), array('jquery'), '1.0', true );
        wp_register_style( 'my-style', plugins_url( 'my-style.css', __FILE__) );
    }

    static function print_script() {
        if ( ! self::$add_script )
            return;
        wp_print_scripts('my-script');
    }
}
My_Shortcode::init();

另一种方法是创建一个主题模板来做几乎相同的事情，但我认为短代码插件更便携，因为它可以在小部件、帖子和页面中使用。