【问题标题】:WordPress Plugin to create a React Public page on activation用于在激活时创建 React Public 页面的 WordPress 插件
【发布时间】:2023-02-01 14:37:09
【问题描述】:

我正在构建一个 WordPress 插件,它创建一个管理菜单并将值存储在 WordPress 后端,然后在公共页面上显示这个存储的值。但是代码没有创建我想加载自定义反应页面的公共页面。

在根目录中,我有这样的 wp-react-kickoff.php 文件

<?php
/**
 * Plugin Name: Batmobile Design
 * Author: Batman
 * Author URI: 
 * Version: 1.0.0
 * Description: WordPress React KickOff.
 * Text-Domain: wp-react-kickoff
 */

if( ! defined( 'ABSPATH' ) ) : exit(); endif; // No direct access allowed.

/**
* Define Plugins Contants
*/
define ( 'WPRK_PATH', trailingslashit( plugin_dir_path( __FILE__ ) ) );
define ( 'WPRK_URL', trailingslashit( plugins_url( '/', __FILE__ ) ) );

/**
 * Loading Necessary Scripts
 */
add_action( 'admin_enqueue_scripts', 'sd_scripts' );
function sd_scripts() {
    wp_enqueue_script( 'wp-react-kickoff', WPRK_URL . 'dist/bundle.js', [ 'jquery', 'wp-element' ], wp_rand(), true );
    wp_localize_script( 'wp-react-kickoff', 'appLocalizer', [
        'apiUrl' => home_url( '/wp-json' ),
        'nonce' => wp_create_nonce( 'wp_rest' ),
    ] );
}

require_once WPRK_PATH . 'classes/class-create-admin-menu.php';
require_once WPRK_PATH . 'classes/class-create-settings-routes.php';
require_once WPRK_PATH . 'classes/class-public-page.php';

然后我在其中创建了一个名为 classes 的文件夹

class-create-admin-menu.php, 
class-create-settings-routes.php, 
class-public-page.php, 
wprk-public-page-template.php.

专门用于创建公共页面的代码如下所示

<?php
/**
 * This file will create Public Page
 */


function wprk_create_public_page() {
    $page = [
        'post_type' => 'Automatic page',
        'post_title' => 'WP React KickOff Public Page',
        'post_content' => 'asasasas',
        'post_status' => 'publish',
        'post_author' => 1,
    ];
    $page_id = wp_insert_post( $page );
    update_post_meta( $page_id, '_wp_page_template', 'wprk-public-page-template.php' );
}

register_activation_hook( __FILE__, 'wprk_create_public_page' );

还有我的 wprk-public-page-template.php

<div id="wprk-public-app"></div>
<?php
wp_enqueue_script( 'wp-react-Kickoff', WPRK_URL . 'dist/bundle.js', [], wp_rand(), true );
wp_localize_script( 'wp-react-Kickoff', 'appLocalizer', [
        'apiUrl' => home_url( '/wp-json' ),
        'nonce' => wp_create_nonce( 'wp_rest' ),
    ] );

在 ReactFolder 中,我有 App.js,两个设置(这是用于管理菜单,它工作正常)和公共页面都是这样呈现的

import React from 'react';
import PublicPage from './components/PublicPage';
import Settings from './components/Settings';

function App() {
    return(
        <React.Fragment>
            <Settings />
            <PublicPage />
        </React.Fragment>
    )
}
export default App;

为了测试,让公共页面看起来像这样

import axios from 'axios';

const apiUrl = appLocalizer.apiUrl;
const nonce = appLocalizer.nonce;



import React from 'react';

function PublicPage(props) {
    return (
        <div>
            <h1>hello world asasa</h1>
        </div>
    );
}

export default PublicPage;

我对编程很陌生。有人可以帮我确定为什么没有创建公共页面吗?

如果您需要其他信息来排除故障,请告诉我?

【问题讨论】:

    标签: php reactjs wordpress custom-wordpress-pages wordpress-shortcode


    【解决方案1】:

    您在创建页面函数中的 post_type 参数无效。

    如果你有一个自定义的帖子类型,你会想要使用 slug,否则,如果我理解正确的话,你想要创建一个标准的 wordpress 页面,帖子类型是page

    function wprk_create_public_page() {
        $page = [
            'post_type' => 'page',
            'post_title' => 'WP React KickOff Public Page',
            'post_content' => 'asasasas',
            'post_status' => 'publish',
            'post_author' => 1,
        ];
        $page_id = wp_insert_post( $page );
        update_post_meta( $page_id, '_wp_page_template', 'wprk-public-page-template.php' );
    }
    
    register_activation_hook( __FILE__, 'wprk_create_public_page' );
    

    【讨论】:

    • 嘿!感谢您的回复。我想使用 React 创建一个自定义的 wordpress 页面。这就像带有仪表板、图表等的自定义 React 页面
    • 这不起作用?
    • 这奏效了。我还有一个问题:所以这个新页面目前是在管理员设置页面下方创建的(只有管理员可以访问)。我想将其创建为特定 URL 的公共页面。如何实现这一目标。
    • 我为此创建了一个新问题 -> stackoverflow.com/questions/75203782/…
    猜你喜欢
    • 2016-08-26
    • 1970-01-01
    • 1970-01-01
    • 2017-11-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-05-09
    • 1970-01-01
    相关资源
    最近更新 更多