如何在 wordpress 页面上包含带有自己的 css 和 javascript 的 php 页面？ [关闭]

Posted 2023-02-24

【中文标题】如何在 wordpress 页面上包含带有自己的 css 和 javascript 的 php 页面？ [关闭]

【英文标题】：How do I include a php page with its own css and javascript on a wordpress page? [closed]

【发布时间】：2016-11-24 00:41:17

【问题描述】：

我用 php 创建了一个动态表，我想把它放在 WordPress 页面上。 我可以在浏览器中本地打开 PHP 以及用于创建表格的 CSS 和 javascript。

当我尝试将 PHP 文件包含在带有短代码的 WordPress 页面中时，它会使用 WordPress CSS 并且 JavaScript 甚至没有运行。实现这一点的最佳方法是什么？有没有可能？

【问题讨论】：

您可以使用条件语句在头部运行css，在页脚运行js，在单页模板中运行php代码，并将其连接到您创建的新页面。因此，创建一个新页面，例如“我的新 PHP 页面”（废话名称，但您明白了），您的条件取决于该页面的标题，然后添加代码位。然后在您创建的这个新的“我的新 PHP 页面”中包含一个 php。

更多内容包括：php.net/manual/en/function.include.php

找到了，这个问题之前在这里问过：***.com/questions/2810124/… 答案非常好，比我的更详细。

这将创建一个带有 php 代码的新页面。我想要的是使用现有页面并将动态表添加到其中。页面的css必须相同，我只是想添加一个有自己的css和javascript的表。

新模板具有默认模板的所有功能，以及您的额外代码。除非您使用插件，否则您需要创建另一个模板或使用条件来调用 php 包含和您需要的其他代码；例如，你不能在帖子中运行这些。

【参考方案1】：

如果您需要或想要使用简码，这意味着它可以随时在任何页面或帖子上运行，因此您应该始终包含必要的 JS 和 CSS。您可以使用包含 wp_enqueue_script() 调用和 wp_enqueue_style() 调用的函数在 WordPress 中包含 JS 和 CSS。包含这些调用的函数应该挂钩到wp_enqueue_scripts（这个链接有很好的例子），它应该位于你的 WP 主题的 functions.php 文件中或包含在 functions.php 文件中的文件中。

然后短代码函数本身可以正常构建，位于主题的functions.php文件或functions.php文件包含的文件中。如果您不确定如何执行此操作，以下是使用输出缓冲的示例。

add_shortcode('shortcode_name_here', 'shortcode_function_name_here');
function shortcode_function_name_here()

    // Begin output buffering
    ob_start();

    // Build table example, replace with your code beginning here
    // WP_Query, grab up to 100 blog posts, no paging
    $query_args =  array ( 
        'posts_per_page' => 100, 
        'post_type' => 'post', 
        'no_found_rows' => true,
    );

    $wp_query = new WP_Query( $query_args );

    if( $wp_query->have_posts() ) :

        ?>
        <table>
           <tr>
                <th>Titles</th>
            </tr>
            <?php while( $wp_query->have_posts() ) : the_post(); ?>
                <tr>
                    <td><?php the_title(); ?></td>
                </tr>
            <?php endwhile; ?>
        </table>
        <?php

    // Alternative message if there's no posts       
    else:

        ?>
        <h3>Sorry, but we have nothing for you.</h3>
        <?php

    endif;

    // End build table example, end your custom code here
    // End buffering, save, return
    $output = ob_get_clean();
    return $output;

【参考方案2】：

我认为您不能使用简码添加 html/JS/PHP。但是，您可以直接在 wp-content 目录中或通过添加您自己的插件将 PHP 添加到 wordpress 文件中。更简单的方法是通过仪表板访问 Wordpress 文件：转到仪表板，单击左侧工具栏上的 Appearance 选项卡和 Editor 工具提示。从那里您可以修改主题的模板文件并创建新的 PHP 文件。