it-swarm.com.de

Übergeben von Werten von einem Widget an eine Funktion innerhalb eines Plugins

Ich habe ein Plugin, das mit vielen Widgets erstellt wird. Ein Widget-Bundle. Jedes Widget erstellt seinen eigenen benutzerdefinierten CSS-Code.

Anstatt chaotischen Quellcode zu haben, in dem 15 verschiedene Sätze von Inline-CSS-Code angezeigt werden, möchte ich den benutzerdefinierten generierten CSS-Code von jedem Widget an eine benutzerdefinierte Haupt-CSS-Datei übergeben, die ich mit WordPress AJAX erstellt habe.

Ich werde die Funktionen anzeigen, die ich eingerichtet habe, um dies zu ermöglichen.

Die AJAX erstellte CSS-Datei

Die folgende CSS-Datei wird mit WordPress AJAX erstellt. Damit kann ich benutzerdefinierte CSS-Anweisungen in die Datei einfügen. Es enthält auch einen Filter, in dem ich hoffe, das zusätzlich erzeugte CSS von den Widgets an diese Funktion (Datei) zu übergeben.

/**
 * Echo the CSS for the custom widgets style
 */
public function advanced_widget_pack_css() {
    if(empty($_GET['action']) || $_GET['action'] != 'advanced_widget_pack_gen_css') return;
    if(!isset($_GET['ver'])) return;

    $css_text = '';

    /* ============================= */
    /* Archives Widget               */
    /* ============================= */
    $css_text .= ".awp_archives_colour { color:".awp_option('awp_archives_dropdown_inst_colour')." !important }\n"; 

    /**
     * Filter for any incoming CSS
     */
    $css_text = apply_filters('advanced_widget_pack_css', $css_text);

    header("Content-type: text/css");
    echo $css_text;
    exit();
}

Eine der Widget-Klassen mit benutzerdefiniertem CSS-Code

Der folgende Code ist ein Ausschnitt aus einem der vielen Widgets, die im Plugin verwendet werden. Das Widget erstellt benutzerdefinierten CSS-Code und speichert ihn in der Variablen $sc_css. Ich möchte von hier aus den Inhalt der Variablen $sc_css übergeben oder den Inhalt an die zuvor erstellte Funktion advanced_widget_pack_css() anhängen.

class Advanced_Widget_Pack_Widget_Archives extends WP_Widget {

    public function __construct(){
        // This filter hooks the custom genrated css code to the advanced_widget_pack_css function
        add_filter('advanced_widget_pack_css', array(&$this,'awp_pass_css_code'));
    }

    public function form($instance) {}

    public function widget($args, $instance){

        extract($args);

        // All the widget code is contained here....

        // Styling for the shortcode
        if($is_awp_sc == 'true'){

            /* Generate unique id if shortcode - used for styling */
            $sc_id = mt_Rand(1, 100000);

            $sc_css =  ".awp_archive_widget_sc".$sc_id." { border:".$awp_archives_border_width.' '.$awp_archives_border_style.' '.$awp_archives_border_color." !important }\n";
            $sc_css .= $awp_archives_border_radius == 'round' ? '.awp_archive_widget_sc'.$sc_id.' { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px }' : ''.''." \n";

            $sc_css .= ".awp_archive_widget_sc".$sc_id." li a, .awp_archive_widget_sc".$sc_id." li { font-size:".$awp_archives_font_size." !important }\n";
            $sc_css .= ".awp_archive_widget_sc".$sc_id." li a { color:".$awp_archives_link_std." !important }\n";
            $sc_css .= ".awp_archive_widget_sc".$sc_id." li a:hover { color:".$awp_archives_link_hover." !important }\n";

            // This should pass the variable
            echo $this->awp_pass_css_code($sc_css);
        }

        // The widget code gets outputted here
    }

    // This function is created to pass the content of the variable $sc_css to the advanced_widget_pack_css function
    function awp_pass_css_code( $sc_css ) {
        return $sc_css;
    }
}

Die Probleme

Ich habe versucht, dies zu erreichen, indem ich den Inhalt der Variablen $sc_css an eine Funktion im Widget übergeben und ihn dann über einen WordPress-Filter mit der Funktion advanced_widget_pack_css() verknüpft habe.

Das Problem besteht darin, dass der Inhalt der Variablen immer leer ist, wenn sie an das von AJAX generierte Stylesheet übergeben werden.

1
Jason

Zunächst kann ich sagen, warum Ihr Code nicht funktioniert.

Das benutzerdefinierte CSS wird in der Funktion widget erstellt, die von WordPress in dem Moment aufgerufen wird, in dem das Widget angezeigt wird.

Ich vermute, dass Sie auf Dokument bereit eine Ajax-Anfrage senden, die die Funktion advanced_widget_pack_css() aufruft. Aber jede Ajax-Anfrage ist eine völlig neue http-Anfrage, bei der der einzige Bereich eine Funktion ausführt, aber kein Widget einbettet.

Aus diesem Grund ruft die neue Anfrage über Ajax niemals die Methode widget() in Ihrer Widget-Klasse auf und daher werden natürlich keine CSS hinzugefügt.

Denken Sie eine Minute darüber nach, was Sie tun.

Angenommen, Ihr Workflow funktioniert, schlägt fehl, wenn der Benutzer kein js aktiviert hat. Und selbst wenn die js aktiviert sind, wird die Seite ohne benutzerdefiniertes CSS geladen, das auf Ajax-Anforderung geladen werden sollte (und Ajax in WordPress ist nicht sehr schnell ...).

  • wenn nein, ist es auch kein CSS
  • auch wenn js seite ohne css lädt, so hast du für eine sekunde oder länger ein nicht gestyltes widget
  • browser dürfen das CSS nicht zwischenspeichern

Ihr Code funktioniert also nicht (und ich habe Ihnen erklärt, warum), aber selbst wenn Sie einen Weg finden, wie er funktioniert, ist dies keine großartige Lösung.

Was kann eine Lösung sein?

Isolieren Sie im Widget zunächst die Funktion, die das benutzerdefinierte CSS generiert .

Danach sollten Sie die Funktion nicht mehr für die Methode widget() aufrufen, sondern für die Methode update. Auf diese Weise wird das CSS jedes Mal generiert, wenn das Widget aktualisiert wird , und Sie können das neu generierte CSS speichern, um es in einer CSS-Datei zu speichern .

Als bewährte Methode empfiehlt es sich, diese Datei im Upload-Ordner zu speichern, da Sie sicher sind, dass der Ordner von WP aus beschreibbar ist.

Pseudocode:

class Advanced_Widget_Pack_Widget_Archives extends WP_Widget {

   function generate_css( $instance ) {
     // some code here to generate css from instance arguments...
     return $sc_css;
   }

   function update( $new_instance, $old_instance ) {
     // some code here to update the widget instance...
     $css = $this->generate_css( $new_instance );
     $upload_dir = wp_upload_dir();
     $path = $upload_dir['basedir'] . '/myplugin/myplugin-customwidget.css';
     if ( ! file_exists($upload_dir['basedir'] . '/myplugin') )
       mkdir($upload_dir['basedir'] . '/myplugin');
     file_put_contents($path, $css);
   }

}

Danach können Sie die soeben mit WordPress erstellte Datei in eine Warteschlange einreihen ...

Alternativ zu dieser Methode können Sie das CSS in der widget() -Methode generieren (wie Sie es bereits tun) und im Markup einfach als Inline-Stil ausgeben.

1
gmazzap

Eine schnelle Lösung für Sie besteht darin, alle Ihre generierten CSS-Daten in einem serialisierten Array in der WordPress-Datenbank zu speichern und mit get_option/set_option abzurufen/festzulegen.

0
Nicü