在Wordpress Shortcode中嵌入PHP文件+目录

时间:2013-10-23 19:54:38

标签: php wordpress iframe plugins shortcode

我正在尝试创建一个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';
}

导致页面在到达短代码时停止渲染,从而产生一个标题,后面跟一个没有页脚的空白空格。

1 个答案:

答案 0 :(得分:0)

是的,短代码是使用插件执行此操作的好工具。问题是你不能把所有东西塞进include('calculator.php')。这应该只处理标记,不应输出任何内容,因为必须返回一个字符串。

这是一个改编自How to load JavaScript like a WordPress Master的示例插件。我已经添加了CSS enqueue,但它不能使用Jedi技巧在标题中打印它,但仍然有效。一个重要的注意事项是你必须使用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();

另一种方法是创建一个几乎相同的主题模板,但我认为Shortcode Plugin更易于移植,因为它可以在小部件,帖子和页面中使用。