Das Laden einer externen Seitenvorlage und eines Warteschlangenskripts vom Plugin verursacht einen verbotenen Fehler

Ich habe ein Plugin, das auf der folgenden Seite ein Panel erstellt:

mysite.com/wp-content/plugins/myplugin/includes/mypanel.php

Ich möchte dieses Panel auf der folgenden Seite verwenden

mysite.com/mypanel

Die Lösung, die ich versucht habe, war die Verwendung mypanel.phpals Seitenvorlage wie folgt:

add_filter( 'page_template', 'wpa3396_page_template' );
function wpa3396_page_template( $page_template )
{
    if ( is_page( 'mypanel' ) ) {
        $page_template = dirname( __FILE__ ) . '/includes/mypanel.php';
    }
    return $page_template;
}

Auf diese Weise wird die Seite angezeigt, aber kein Javascript funktioniert. Also habe ich versucht, das Javascript des Plugins in Funktionen PHP zu importieren.

add_action('wp_enqueue_scripts','Load_Template_Scripts_wpa83855');
function Load_Template_Scripts_wpa83855(){

    if ( strpos(get_page_template(), 'mypanel.php') !== false ) {
        wp_enqueue_script('wtd', $_SERVER['DOCUMENT_ROOT'].'/wp-content/plugins/myplugin/js/wtd.js');
    }

}

Was zu 403 verbotenen Fehlern führte. Ich habe versucht, einen .htaccess-Ordner zur Seite des Plugins hinzuzufügen, aber es gab weiterhin Fehler.

Bitte sagen Sie mir, wie Sie dieses Problem richtig lösen können.

EDIT: Nach einigen Antworten unten (danke an alle). Ich habe meine Codes auf die Seite meines Plugins verschoben und keinen verbotenen Fehler mehr. Aber meine Schaltflächen funktionieren nicht und ich habe das Gefühl, dass meine JS-Datei nicht über die Seite läuft.

Meine js-Datei beginnt mit: jQuery(document).ready(function()

Hier der endgültige Code auf der Plugin-Seite:

/* Make tisort-tasarla page as template */
add_filter( 'page_template', 'wpa3396_page_template' );
function wpa3396_page_template( $page_template )
{
    if ( is_page( 'tisort-tasarla' ) ) {
        $page_template = dirname( __FILE__ ) . '/includes/tshirt-designer-design-template.php';
    }
    return $page_template;
}
/* Add Javascript to T-Shirt Design Page */

add_action('wp_enqueue_scripts','Load_Template_Scripts_wpa83855');
function Load_Template_Scripts_wpa83855(){

    if ( is_page( 'tisort-tasarla' ) ) {
        wp_enqueue_script( 'wtd', plugins_url( '/js/wtd.js' , __FILE__ ), array( 'jquery' ));        
    }    
}

Ihr CODE ist in Ordnung. Der Grund für die Fehlermeldung 403 ist, dass $_SERVER['DOCUMENT_ROOT']der absolute Pfad an Ihr Webstamm und nicht an die URL zurückgegeben wird.

JavaScript muss als URL hinzugefügt werden. Sie können also die Load_Template_Scripts_wpa83855Funktion in Ihrem Plugin verwenden und dann Folgendes verwenden:

wp_enqueue_script( 'wtd', plugins_url( '/js/wtd.js' , __FILE__ ) );

CODE zum Hinzufügen von JavaScript.

Hinweis: Natürlich können Sie den CODE noch besser machen, indem Sie eine Logik verwenden, wie sie @nathan in seiner Antwort verwendet hat , dh hinzufügen:

add_action('wp_enqueue_scripts','Load_Template_Scripts_wpa83855');

innerhalb der wpa3396_page_template()Funktion im if ( is_page( 'mypanel' ) ) {}Bedingungsblock; aber das ist nicht der Grund des Fehlers. Auf den Serverpfad kann nicht über den Browser zugegriffen werden. Aus diesem Grund gibt der Server einen Access ForbiddenFehler zurück.

Vollständiger CODE (aktualisiert):

Hier ist der vollständige CODE für Ihre Bequemlichkeit (fügen Sie ihn in Ihre Haupt-Plugin-Datei ein):

add_filter( 'page_template', 'wpse_262042_page_template' );
function wpse_262042_page_template( $page_template ) {
    if( is_page( 'mypanel' ) ) {
        add_action( 'wp_enqueue_scripts', 'wpse_262042_enqueue_scripts' );
        $page_template = plugin_dir_path( __FILE__ ) . 'includes/mypanel.php';
    }
    return $page_template;
}

function wpse_262042_enqueue_scripts() {
    wp_enqueue_script( 'wtd', plugins_url( 'js/wtd.js' , __FILE__ ), array( 'jquery' ) );
}

Wenn Sie bereits eine Seite namens "mypanel" haben oder haben möchten, können Sie den page_templateFilter verwenden, um die auf dieser Seite verwendete Vorlage zu filtern. Ich gehe davon aus, dass Sie das tun.

Wir können den page_templateFilter verwenden, um eine benutzerdefinierte Vorlage für diese Seite zu verwenden. Bei Verwendung dieses Filters können wir eine Aktion hinzufügen, um für diese Seite spezifische Skripte in die Warteschlange zu stellen.

add_filter( 'page_template', 'wpse_262042_page_template', 10, 1 );
function wpse_262042_page_template( $page_template ) {
  if( is_page( 'mypanel' ) ) {
    add_action( 'wp_enqueue_scripts', 'wpse_262042_enqueue_scripts' );
    $page_template = plugin_dir_path( __FILE__ ) . 'includes/mypanel.php';
  }
  return $page_template;
}
function wpse_262042_enqueue_scripts() {
  wp_enqueue_script( 'wpse-262042', plugins_url( '/js/wpse-262042.js', __FILE__ ) );
}

In der /includes/mypanel.phpTemplate - Datei, stellen Sie sicher anrufen wp_head()und wp_footer()ansonsten die Warteschlange eingereiht Skripten werden nicht gedruckt.