Προσθήκη custom widget στο Dashboard του WordPress

WordPress Dashboard

Φαντάζομαι πως όλοι όσοι έχετε ανοίξει το admin panel του WordPress θα έχετε δει το Dashboard το οποίο μοιάζει με τη παραπάνω εικόνα. Όλα αυτά τα boxes είναι widgets τα οποία μπορούμε να εμφανίσουμε / κρύψουμε και να τοποθετήσουμε με drag & drop όπως εμείς θέλουμε. Το WordPress μας δίνει τη δυνατότητα να βάλουμε και δικά μας, custom widgets σε αυτή την οθόνη. Ας δούμε λοιπόν πως μπορούμε να προσθέσουμε ένα απλό widget με οδηγίες χρήσης του WordPress για τον πελάτη μας.

Functions.php ή Plugin?

Aυτή είναι μια ερώτηση που πρέπει να σας απασχολεί κάθε φορά που προσθέτετε λειτουργικότητα στο WordPress. Το functions.php σχετίζεται άμεσα με το theme, που σημαίνει πως αν αλλάξει το theme έχει πάρει μαζί του και τη λειτουργικότητα του functions.php ενώ το plugin παραμένει ως έχει.

Συνήθως σε sites πελατών είναι δύσκολο να αλλάξει το theme, αλλά εμείς για να δούμε πως φτιάχνουμε και ένα πολύ εύκολο και μικρό plugin για το WordPress θα το κάνουμε έτσι.

Φτιάχνουμε λοιπόν ένα νέο φάκελο στο κατάλογο plugins του WordPress όπου και θα αποθηκεύσουμε τα αρχεία του plugin μας. Ας τον πούμε ci-client-instructions. Εκεί δημιουργούμε ένα νέο αρχείο php με το όνομα ci-client-instructions.php. Εκεί μέσα τώρα γράφουμε τον παρακάτω κώδικα:

/*
Plugin Name: Client Instructions
Plugin URI: Your plugin instructions website
Description: A good description about your plugin
Version: 1.0
Author: Gerasimos Tsiamalos
Author URI: http://www.theportraitofageek.com/
*/

function ci_client_instructions() {
echo "Εδώ γράφουμε τις οδηγίες για τον πελάτη μας";
}

function ci_do_client_instructions() {
wp_add_dashboard_widget('ci_client_instructions_widget', 'Client Instructions', 'ci_client_instructions');
}

add_action('wp_dashboard_setup', 'ci_do_client_instructions');

?>

Αφού συμβουλευτήκαμε το Codex, μάθαμε πως πρέπει να κάνουμε 3 πράγματα για να προσθέσουμε ένα widget στο Dashboard:

  1. Χρειαζόμαστε μια function με το περιεχόμενο του widget (ci_client_instructions())
  2. Χρειαζόμαστε άλλη μια function για να “ενημερώσουμε” το WordPress ότι έχουμε ένα νέο widget around (ci_do_client_instructions()). Εκεί μέσα χρησιμοποιούμε τη function wp_add_dashboard_widget του WordPress για να προσθέσουμε το widget.
  3. Και τέλος πρέπει να πούμε στο WordPress πότε να προσθέσει το widget στο dashboard. Χρησιμοποιούμε το hook wp_dashboard_setup και φυσικά όταν έρθει η ώρα του να τρέξει, δημιουργεί και το  δικό μας widget.

That’s all!

Πιθανές βελτιώσεις

Βλέπουμε ότι στη 1η function, εκεί δηλαδή που θα γράψουμε τις οδηγίες προς τον πελάτη μας παίζουμε με echo. Αν θέλουμε να προσθέσουμε, κείμενο, λίστες ακόμα και video τότε καλό θα ήταν να γράψουμε τις οδηγίες σε ένα άλλο αρχείο .php και να κρατήσουμε καθαρό το plugin μας. Κάπως έτσι:

function ci_client_instructions() {
require_once(WP_PLUGIN_DIR . "/ci-client-instructions/ci-instructions.php");
}

Φτιάχνουμε λοιπόν ένα ακόμη αρχείο μέσα στο φάκελο του plugin και το ονομάζουμε ci-instructions.php. Εκεί γράφουμε τις οδηγίες μας. Το δικό μου παράδειγμα εμφανίζεται έτσι:

Download

Αν θέλετε να παίξετε μπορείτε να κατεβάσετε το μικρό plugin που μόλις φτιάξαμε και να το χρησιμοποιείτε σαν σκελετό για τις οδηγίες χρήσης προς τους πελάτες σας.

1 comment

Leave a Reply

Your email address will not be published. Required fields are marked *