Custom post types στο WordPress. – Crash course

Καλησπέρα!!Ναι καλά καταλάβατε θα κάνουμε ένα post που θα αναλύσουμε αρκετά τα custom post types στο WordPress.Ο λόγος που στον τίτλο λέω τη λέξη «reloaded» είναι γιατί έχω γράψει περίπου ένα χρόνο πριν ένα crash course για τα custom post types το οποίο έκανε ένα εκτενές παράδειγμα δημιουργίας ενός custom post type, μίας custom taxonomy και μία custom post type archive page και όλα αυτά σε πακέτο plugin.

Ναι, θα ξανακάνω ανάλυση αλλά πλέον θα χρησιμοποιήσω και εργαλεία όπως το generateWP για να με βοηθήσουν στον κώδικα (εμ τι τα έχω αναφέρει αν είναι να μην τα χρησιμοποιώ….).. Letsyyy GOOO!

Τι θα μαγειρέψουμε με custom post types;

Λοιπόν, θα κάνουμε τα εξής: Θα χρησιμοποιήσουμε το Twenty Fourteen Theme που έρχεται μαζί με το WordPress και θα φτιάξουμε ένα custom post type που θα είναι τύπου “Singer” , ναι τραγουδιάρικο θα είναι και θα βάλουμε και custom taxonomies στο παιχνίδι .Όλα αυτά θα τα κάνουμε με τον πιο User friendly τρόπο αλλά όχι με τον πολύ εύκολο πχ με τη χρήση ενός plugin που δημιουργεί custom post types γιατί έτσι θα χάσουμε τη χαρά της δημιουργίας.Σημείωση: Θα εξηγώ όπου κρίνω ότι είναι αναγκαίο.Σε αντίθετη περίπτωση θα παραθέτω και Links από το documentation του WordPress.Επίσης θα είναι και στιγμές που θα εξηγώ απευθείας με comments μέσα στον κώδικα.Without further ado , ξεκινάμε!

Σχετικά με τα custom post types

Σε αυτή τη φάση δούμε τι είναι τα custom post types και στη συνέχεια θα πούμε λίγο πιο αναλυτικά τι θα δούμε στο άρθρο αυτό.

Τι είναι τα custom post types;

Θα απαντήσουμε σε αυτή την ερώτηση εξηγώντας απλά τι είναι τα post types στο WordPress. Το WordPress λοιπόν μπορεί και παρουσιάζει διάφορους τύπους περιεχομένου. Δύο απο αυτούς τους τύπους περιεχομένου είναι τα: posts και τα pages (σελίδες).Αυτό που κάποιοι δεν γνωρίζουν είναι ότι και τα navigation menusτα revisions(τα drafts που αποθηκεύονται κάθε φορά που κάνουμε save ένα post ή page) και τα διάφορα επισυναπτόμενα αρχεία (attachments) ,πχ φωτογραφίες που συνοδεύουν ένα post για παράδειγμα , όλα είναι τύποι περιεχομένου το οποίο αγγλιστί ονομάζουμε «Post Type«. Αυτοί λοιπόν οι 5 Post Types που αναφέραμε έρχονται με το WordPress πακέτο.Τι φαντάζεστε λοιπόν ότι είναι τα Custom Post Types;

Τα custom post types είναι «προσαρμοσμένοι τύποι περιεχομένου», κοινώς είναι τύποι περιεχομένου που φτιάχνουμε εμείς.Για παράδειγμα στο άρθρο θα δημιουργήσουμε τον Post Type με το όνομα «Singer» και στην ουσία η κάθε δημοσίευση που θα κάνουμε με αυτόν τον τύπο θα είναι τύπου «Singer». Μην μπερδεύεστε θα τα δούμε και σε πολύ λίγο.

Απλά χαρακτηριστικά των custom post types;

Φανταστείτε τα post types ότι είναι posts αλλά άλλου τύπου.Είναι απλό αν το κατανοήσετε.Είναι σαν να κάνετε post αλλά δεν είναι στην ουσία post αλλά είναι ένα «Singer». Το ίδιο θα γινόταν αν είχατε ένα real estate site και χρησιμοποιούσατε το Custom Post Type:Property.Ένα χαρακτηριστικό των custom post types είναι ότι μπορούν να έχουν ξεχωριστές σελίδες γι αυτά.Παράδειγμα, μπορεί να έχουν διαφορετικό “single.php“,”category.php“ κλπ και φυσικά εκεί είναι και το ζήτημα της χρήσης τους, ότι δηλαδή τα χρησιμοποιούμε για να δείξουμε με διαφορετικό τρόπο τα πράγματα που εμείς θέλουμε.Επίσης μπορεί να έχουν κατηγορίες (όπως τα posts , αλλά και tags) και μπορούν να έχουν τις ήδη υπάρχουσες οι άλλες οι οποίες θα είναι custom και αυτές…Για παράδειγμα ένας custom post type «Singer» θα μπορεί να έχει custom categories ή αλλιώς custom taxonomies το genre (που θα είναι το είδος μουσικής που ανήκει ο singer) καθώς και το country η οποία θα είναι η χώρα που θα ανήκει ο «Singer». Possibilities are endless.. 🙂

Πριν διαβάσω παρακάτω να ξέρω κάτι;

Παρακάτω θα γράψουμε απλό σχετικά κώδικα σε PHP χρησιμοποιώντας επί το πλείστον το WordPress Codex. Αν δεν γνωρίζετε HTML-CSS (απλή) τότε θα είναι δύσκολο να ακολουθήσετε.

Custom Post Types επί το έργον.

Εδώ και μετά τα παραπάνω θεωρητικά ας πιάσουμε τα πρακτικά τώρα.Θα χρειαστούμε μία εγκατάσταση WordPress, το «twenty-fourteen» theme, ένα html-editor/IDE και καλή διάθεση.Επειδή τα έχουμε όλα ξεκινάμε.

Πώς θα δημιουργήσω τον custom post type;

Για να δημιουργήσω ένα custom post type θα χρησιμοποιήσω το εργαλείο generateWP. Στη συνέχεια τον κώδικα που θα πάρω θα τον τοποθετήσω στο αρχείο «functions.php» που βρίσκεται στο theme directory του twenty-fourteen theme.

Πάω λοιπόν στο website του generateWP και πατάω το link για το «Custom Post Type».Βλέπω την παρακάτω εικόνα:

Παρατηρείτε ότι έχει κάποια Links σαν menu με μπλε χρώμα που στην ουσία είναι αυτά που θα ακολουθήσουμε για να δημιουργήσουμε τον κώδικα για τον custom post type μας.Πιο κάτω βλέπετε ένα κουμπί που λέει «update code» και κάθε φορά που προσθέτουμε κάτι μπορούμε να το πατάμε και θα βλέπουμε τον κώδικα παρακάτω να γίνεται update.Ας δούμε συνοπτικά τα links

  1. General:Εδώ δίνουμε το όνομα της function που θα μας φτιάξει τα custom post types και επιλέγουμε αν θέλουμε να υποστηρίζει και child themes. Αυτό το τσεκάρουμε όταν φτιάχνουμε theme στο οποίο θα έχει και child themes και θα επιλέξουμε το custom post type αυτό να το έχουμε και στο child. Επίσης βάζουμε και το textdomain (είναι στο αρχείο Styles.css και αυτό δίνει τη δυνατότητα στο να μπορέσουμε να μεταφράσουμε τα διάφορα strings του Custom Post Type.
  2. Post Type:
  3. Εδώ είναι τα βασικά στοιχεία για τον custom post type που δημιουργούμε.To «key» είναι μοναδικό και στην ουσία είναι το slug του custom post type.Το πεδίο «Link to taxonomies» συνδέει τον custom post type με της categories, τα tags που υπάρχουν ήδη και αναφέρονται στα «posts» ή μπορούμε να βάλουμε δικά μας custom taxonomies.Εδώ λοιπόν αφήστε κενό το πεδίο.Τέλος το «Hierarchical» σας δίνει τη δυνατότητα να κάνετε τα custom post types σας με ιεραρχική δομή δηλαδή να έχουν και «Sub Post Types» όπως δηλαδή είναι οι σελίδες (Pages) που μπορούν να έχουν και υποσελίδες .Εμείς δεν θα τα έχουμε hierarchical, θα είναι δηλαδή όπως είναι τα posts μας.
  4. Οptions: Κάποιες σημαντικές επιλογές για το WordPress Admin.Τα checkboxes είναι αυτά που θέλουμε να βλέπουμε όταν προσθέτουμε ένα post από τον συγκεκριμένο Post Type ή όταν το επεξεργαζόμαστε.Για παράδειγμα αν δεν επιλέξω το «Featured image» τότε για κάθε post που ανήκει στο συγκεκριμένο post type δεν θα μπορώ να βάλω featured image.Tα υπόλοιπα είναι self-explained.
  5. Visibility:Διαβάστε τις περιγραφές των επιλογών και θα καταλάβετε.Σχετικά με το «Admin Sidebar Icon» αφήστε το κενό και θα το δούμε μετά.Είναι το εικονίδιο που είναι στο wp admin δίπλα στο όνομα του post type στο menu, πχ στα posts έχει μία καρφίτσα.
  6. Query, Permalinks , Capabilities:Αφήστε τα όπως είναι , είναι πιο advanced επιλογές και σας δίνει και διάφορες πληροφορίες για το τι είναι το καθένα.

Μετά από τα παραπάνω και θεωρώντας ότι το custom post type μας είναι «Singer» πατήστε το κουμπί «Update Code» και αν συμπληρώσατε σωστά τα πεδία -τα πεδία options τα διαλέγω όλα- ο κώδικας θα είναι σας τον παρακάτω:

Ο κώδικας για το Custom Post Type

// Register Custom Post Type
function custom_post_type_singer() {
 
	$labels = array(
		'name'                => _x( 'Singers', 'Post Type General Name', 'twentyfourteen' ),
		'singular_name'       => _x( 'Singer', 'Post Type Singular Name', 'twentyfourteen' ),
		'menu_name'           => __( 'Singer', 'twentyfourteen' ),
		'parent_item_colon'   => __( 'Parent Singer:', 'twentyfourteen' ),
		'all_items'           => __( 'All Singers', 'twentyfourteen' ),
		'view_item'           => __( 'View Singer', 'twentyfourteen' ),
		'add_new_item'        => __( 'Add New Singer', 'twentyfourteen' ),
		'add_new'             => __( 'New Singer', 'twentyfourteen' ),
		'edit_item'           => __( 'Edit Singer', 'twentyfourteen' ),
		'update_item'         => __( 'Update Singer', 'twentyfourteen' ),
		'search_items'        => __( 'Search Singers', 'twentyfourteen' ),
		'not_found'           => __( 'No Singers found', 'twentyfourteen' ),
		'not_found_in_trash'  => __( 'No Singer found in Trash', 'twentyfourteen' ),
	);
	$args = array(
		'label'               => __( 'singer', 'twentyfourteen' ),
		'description'         => __( 'Singer information pages', 'twentyfourteen' ),
		'labels'              => $labels,
		'supports'            => array( 'title', 'editor', 'excerpt', 'author', 'thumbnail', 'comments', 'trackbacks', 'revisions', 'custom-fields', 'page-attributes', 'post-formats', ),
		'hierarchical'        => false,
		'public'              => true,
		'show_ui'             => true,
		'show_in_menu'        => true,
		'show_in_nav_menus'   => true,
		'show_in_admin_bar'   => true,
		'menu_position'       => 5,
		'menu_icon'           => '',
		'can_export'          => true,
		'has_archive'         => true,
		'exclude_from_search' => false,
		'publicly_queryable'  => true,
		'capability_type'     => 'page',
	);
	register_post_type( 'singer', $args );
 

// Hook into the 'init' action
add_action( 'init', 'custom_post_type_singer', 0 );

Βλέπουμε ότι στο dashboard μας προστέθηκε ο νέος Post Type!Αν κλικάρω πάνω του τότε θα δω ότι μου ανοίγει αντίστοιχη σελίδα όπως θα μου άνοιγε αν πατούσα στο Link «Posts».Παρατηρώ ότι το εικονίδιο είναι κενό.Θα σας παραθέσω λοιπόν ένα εξαιρετικό και πανεύκολο στο να το ακολουθήσετε άρθρο στο οποίο θα δείτε πώς μπορούμε να προσθέσουμε εικονίδιο δίπλα στον custom post type.Το άρθρο θα το βρείτε εδώ: Προσθέστε τα dashIcons στο WordPress Admin για τα custom post types

Φανταστείτε από δω και πέρα λοιπόν ότι τα posts που ανήκουν στον custom post type μας είναι τύπου «Singer». Βέβαια παρατηρούμε ότι δεν έχουμε κάποια κατηγοριοποίηση.Έτσι και εμείς, θα προσθέσουμε custom taxonomies για τον Singer μας.Μία custom taxonomy που θα ονομάζεται «Music Genre» και μία «Singer Country» όπου θα είναι κατηγορία που θα κατηγοριοποιεί τους singers ανάλογα με το που μένουν.Πάμε στο generateWP να φτιάξουμε τα custom taxonomies.

Custom Taxonomies για τον custom post type μας.

Στο generateWP θα επιλέξουμε το «taxonomy generator» και μάλιστα θα το κάνουμε δύο φορές ,μία φορά για κάθε μία taxonomy.Προσοχή, τα keys-slugs ας πούμε ότι θα είναι «music_genre» και «singer_country».Προσέξτε: Στο πεδίο «Taxonomy» , στην επιλογή «Link to custom Post Type» επιλέξτε το «Custom Post Type». Εάν όλα έγιναν καλώς τότε ο κώδικας για την custom taxonomy «music-genre» είναι ο εξής:

// Register Custom Taxonomy
function custom_taxonomy_genre_tax()  {
 
	$labels = array(
		'name'                       => _x( 'Music Genres', 'Taxonomy General Name', 'twentyfourteen' ),
		'singular_name'              => _x( 'Music Genre', 'Taxonomy Singular Name', 'twentyfourteen' ),
		'menu_name'                  => __( 'Music Genre', 'twentyfourteen' ),
		'all_items'                  => __( 'All Music Genres', 'twentyfourteenn' ),
		'parent_item'                => __( 'Parent Music Genres', 'twentyfourteen' ),
		'parent_item_colon'          => __( 'Parent Music Genre:', 'twentyfourteenn' ),
		'new_item_name'              => __( 'New Music Genre Name', 'twentyfourteen' ),
		'add_new_item'               => __( 'Add New Music Genre', 'twentyfourteen' ),
		'edit_item'                  => __( 'Edit Music Genre', 'twentyfourteen' ),
		'update_item'                => __( 'Update Music Genre', 'twentyfourteen' ),
		'separate_items_with_commas' => __( 'Separate Music Genres with commas', 'twentyfourteen' ),
		'search_items'               => __( 'Search Music Genres', 'twentyfourteen' ),
		'add_or_remove_items'        => __( 'Add or remove Music Genre', 'twentyfourteen' ),
		'choose_from_most_used'      => __( 'Choose from the most used Music Genre', 'twentyfourteen' ),
	);
	$args = array(
		'labels'                     => $labels,
		'hierarchical'               => true,
		'public'                     => true,
		'show_ui'                    => true,
		'show_admin_column'          => true,
		'show_in_nav_menus'          => true,
		'show_tagcloud'              => true,
	);
	register_taxonomy( 'music_genre', 'custom_post_type', $args );
 
// Hook into the 'init' action
add_action( 'init', 'custom_taxonomy_genre_tax', 0 );

Προσοχή: Στη γραμμή 29 στο σημείο που λέει «custom_post_type» θα το αλλάξετε με το slug του Post Type που θέλετε να ενώσετε αυτήν την taxonomy. Στο παράδειγμα μας το “slug” είναι «singer» .

1 register_taxonomy( ‘music_genre’, ‘singer’, $args );

Αν σώσετε το αρχείο functions.php και εν συνεχεία κάνετε refresh το WordPress Admin κάτω από τον custom post type τύπου singer θα δείτε:
Με τον ίδιο ακριβώς τρόπο δημιουργείτε και την άλλη custom taxonomy!

// Register Custom Taxonomy
function custom_taxonomy_country_tax()  {
 
    $labels = array(
        'name'                       => _x( 'Singer Countries', 'Taxonomy General Name', 'twentyfourteen' ),
        'singular_name'              => _x( 'Singer Country', 'Taxonomy Singular Name', 'twentyfourteen' ),
        'menu_name'                  => __( 'Singer Country', 'twentyfourteen' ),
        'all_items'                  => __( 'All Singer Countries', 'twentyfourteen' ),
        'parent_item'                => __( 'Parent Singer Country', 'twentyfourteen' ),
        'parent_item_colon'          => __( 'Parent Singer Country:', 'twentyfourteen' ),
        'new_item_name'              => __( 'New Singer Country Name', 'twentyfourteen' ),
        'add_new_item'               => __( 'Add Singer Country Genre', 'twentyfourteen' ),
        'edit_item'                  => __( 'Edit Singer Country', 'twentyfourteen' ),
        'update_item'                => __( 'Update Singer Country', 'twentyfourteen' ),
        'separate_items_with_commas' => __( 'Separate Singer Countries with commas', 'twentyfourteen' ),
        'search_items'               => __( 'Search Singer Countries', 'twentyfourteen' ),
        'add_or_remove_items'        => __( 'Add or remove Singer Countries', 'twentyfourteen' ),
        'choose_from_most_used'      => __( 'Choose from the most used Singer Countries', 'twentyfourteen' ),
    );
    $args = array(
        'labels'                     => $labels,
        'hierarchical'               => true,
        'public'                     => true,
        'show_ui'                    => true,
        'show_admin_column'          => true,
        'show_in_nav_menus'          => true,
        'show_tagcloud'              => true,
    );
    register_taxonomy( 'singer_country', 'singer', $args );
 
// Hook into the 'init' action
add_action( 'init', 'custom_taxonomy_country_tax', 0 );

Προβάλλοντας τον custom post type μας.

Αφού ρυθμίσαμε όλα τα παραπάνω, τώρα αυτό που μας μένει είναι να βάλουμε κάποια περιεχόμενα για να δούμε πώς μπορούμε να προβάλλουμε τον custom post type μας.Φτιάξτε ένα post τύπου «Singer» και προσθέστε 2-3 terms στα δύο taxonomies τα οποία δημιουργήσαμε.

Παρατηρήστε ότι στον editor έχουν εμφανιστεί στα δεξιά οι δύο νέες taxonomies 🙂

Εγώ λοιπόν πρόσθεσα την «Britney Spears» (xoxoxo) και επέλεξα την επιλογή «USA» για την χώρα και «Pop» για το είδος μουσικής.Αν κάνω publish το post και πατήσω το view singer τότε θα δω ότι όντως το άρθρο μου υπάρχει στο url : “http://127.0.0.1/projects/WpTuts/singer/britney-spears/”. Παρατηρήστε το “singer” στο url !

Βέβαια παρατηρήστε και το άλλο, ότι το post αυτό χρησιμοποιεί το template που χρησιμοποιούν και τα απλά posts.Προσέξτε τώρα :Μπορούμε να έχουμε εντελώς ξεχωριστή εμφάνιση για το post που ανήκει σε ένα custom post type.

Custom Post Type page templates.

Στο WordPress υπάρχει η δυνατότητα να φτιάχνουμε και custom templates για τα αρχεία μας. Γνωρίζουμε ότι το κάθε Post εμφανίζεται μόνο του χρησιμοποιώντας το αρχείο “single.php“ Εαν δούμε εδώ θα καταλάβουμε πώς πρέπει να ονοματίσουμε το αρχείο που θέλουμε για παράδειγμα να προβάλλει ένα post από ένα συγκεκριμένο post-type: Στην περίπτωση μας, το αρχείο θα το ονομάσουμε «single-singer.php».Αν το κάνουμε αυτό το αρχείο και το τοποθετήσουμε μέσα στο theme directory όταν θα πατήσουμε «View Singer» τότε θα δούμε αυτά που έχουμε στο αρχείο αυτό και το WordPress δεν θα χρησιμοποιήσει το “single.php”.

<?php
  echo 'Singers Page';
?>

Άρα καταλαβαίνετε ότι με τον τρόπο αυτό μπορούμε στην ουσία κάποια συγκεκριμένα post types να τα κάνουμε εμφανισιακά να μην έχουν καμία σχέση με το υπόλοιπο website.Μπορείτε επίσης να αντιγράψετε τον κώδικα από το «single.php» στο «single-singer.php» και να αλλάξετε μετά ότι εσείς θέλετε.

Σχετικά με το archiving των custom taxonomies.

Στο link που παρέθεσα λίγο πιο πάνω σας δίνει οδηγίες για το πώς μπορείτε να κάνετε custom archives pages για custom taxonomies.By DEFAULT μία custom taxonomy θα χρησιμοποιεί το «category.php» για να «μαζέψει» όλα τα άρθρα που την αφορούν. Επιπροσθέτως αν πάτε στα menus στο admin (Appearance Settings) θα δείτε ότι μπορείτε πλέον να προσθέσετε και custom taxonomies σε αυτά!!!Για παράδειγμα εγώ πρόσθεσα την taxonomy «Pop» στο menu του twentyfourteen theme.

τσι όταν πατάω σε αυτό μου ανοίγει σελίδα custom κατηγορίας που μέσα είναι όλα τα posts που έχουν κατηγοριοποιηθεί ως «Pop»

Πώς κάνω τον custom Post Type μου να εμφανιστεί στην αρχική σελίδα του twentyfourteen theme;

Φτάσαμε λίγο πριν το τέλος και τώρα θα δούμε ένα modification που θα κάνουμε για να δούμε το post τύπου «singer» στην αρχική σελίδα του twenty-fourteen theme.

Θα κάνω μία μικρή αλλαγή στο index.php αρχείο.Ανοίξτε το παρακαλώ και πριν ξεκινήσει το WordPress Loop κάντε την εξής προσθήκη: Για να σας βοηθήσω πηγαίνετε στη γραμμή και προσθέστε :

 $args = array(
    'post_type'=>array('post', 'singer')
 );
 $mainQ = new WP_Query($args);   
 $args = array(
          'post_type'=>array('post', 'singer')
         );
 $mainQ = new WP_Query($args);   

Στην ουσία θα πειράξουμε την WP Query που είναι υπεύθυνη για την εμφάνιση των posts.Αφού το κάνουμε αυτό, πάμε και αλλάζουμε το «if» αλλά και το «while» του WordPress Loop σε :

PHP
if ( $mainQ->have_posts() ) :
// Start the Loop.
	while ( $mainQ->have_posts() ) : $mainQ->the_post();
	endwhile;
endif; wp_reset_postdata();

Επίλογος για τα custom post types.

Το κείμενο αυτό ξεπέρασε τις 2500 λέξεις.Αν έπρεπε να κάτσω να γράψω αληθινά αναλυτικά θα έπρεπε να γράψω 10 σελίδες .Είναι αλήθεια ότι οι παραπάνω τρόποι λειτουργούν .Ίσως μέσα στο κείμενο να βρίσκετε κάποια λαθάκια ή να μην καταλαβαίνετε κάτι.Κάντε λοιπόν σχόλια και ρωτήστε.Σας ευχαριστώ πολύ!

5 1 vote
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x