web-dev-qa-db-fra.com

J'ai besoin d'ajouter une "couverture" personnalisée à chaque nouvelle installation post-plugin ou personnalisée?

Je crée un site qui est fondamentalement comme un livre en ligne, et chaque article est un chapitre. Chaque chapitre reçoit une "page de garde" personnalisée, spécialement conçue, qui ne peut pas vraiment être conçue dans le Wordpress WYSIWYG. Certains aspects de chaque couverture peuvent être modélisés (comme un h1, un h2 et un paragraphe - tous les chapitres en auront), mais tout le reste sera spécial pour chaque chapitre. Cette "couverture" aura également des CSS spécifiques qui ne concernent que ce chapitre.

Idéalement, je serai capable de concevoir et de coder ces couvertures en dehors de Wordpress et d’être en mesure de pouvoir indiquer à chaque message quelle couverture utiliser. Que cela signifie que Wordpress importe réellement ce code ou l'inclut simplement dans un PHP, cela n'a pas d'importance. Je voudrais juste que cela soit aussi simple que possible.

Suggestions?

pluginscustom-post-typescustomizationinclude
2
Brandon Durham

Une autre solution, qui n’appelle pas les attributs de page:

Explication: liste de choses à faire

Allez télécharger le RW_Meta_Box Library . Je suis l'un des auteurs/contributeurs.

Les plugins

Ici vous pouvez voir deux petits plugins (que j'ai écrits spécialement pour votre question).

Contribution

Le premier est une dépendance de la bibliothèque RW Meta Box. Il vous suffit de modifier ce dont vous avez besoin (vérification du nombre d'utilisateurs) et de le télécharger dans votre dossier de plugins. La modification que vous devez apporter est assez simple: recherchez le rôle ou la capacité de l'utilisateur et ajoutez-le là où vous pouvez actuellement lire 'edit_theme_options'. Cela devrait correspondre aux capacités de vos concepteurs mais pas à vos auteurs.

Il ajoute deux méta-boîtes textarea.

<?php
! defined( 'ABSPATH' ) AND exit;
/** Plugin Name: (#65707) »kaiser« Add Meta Boxes */

function wpse65707_add_meta_boxes()
{
    // Don't add it for all users, but only for your designers
    if (
        ! current_user_can( 'edit_theme_options' ) # CHANGE ME!!!
        OR ! class_exists( 'RW_Meta_Box' )
    )
        return;

    $prefix = 'wpse65707_';
    $meta_boxes[] = array(
        // Meta box id, UNIQUE per meta box
         'id' => 'cover'
        // Meta box title - Will appear at the drag and drop handle bar
        ,'title' => 'Designers Space'
        // Post types, accept custom post types as well - DEFAULT is array('post'); (optional)
        ,'pages' => array( 'post' )
        // Where the meta box appear: normal (default), advanced, side; optional
        ,'context' => 'normal'
        // Order of meta box: high (default), low; optional
        ,'priority' => 'high'
        // List of meta fields
        ,'fields' => array(
            array(
                 'name' => 'Styles'
                ,'desc' => "Only valid CSS here"
                ,'id'   => "{$prefix}styles"
                ,'type' => 'textarea'
                ,'std'  => "h1 { color: #009ee0; }"
                ,'cols' => "40"
                ,'rows' => "8"
            ),
            array(
                 'name' => 'MarkUp'
                ,'desc' => "Only valid HTML here"
                ,'id'   => "{$prefix}markup"
                ,'type' => 'textarea'
                ,'std'  => "<h1>Hello Me!</h1>"
                ,'cols' => "40"
                ,'rows' => "8"
            )
        )
    );

    # Add additional Meta Boxes here.
    # For example a drop-down with a list of users that
    # have a custom role of "Designer"
    # (Hint) Use the "Members" plugin for that and 
    # WP_User_Query to get the users as values

    foreach ( $meta_boxes as $meta_box )
        new RW_Meta_Box( $meta_box );
}
# Performance: Only load on post edit & new admin UI screens.
add_action( 'load-post-new.php', 'wpse65707_add_meta_boxes' );
add_action( 'load-post.php', 'wpse65707_add_meta_boxes' );

Sortie

Celui-ci se soucie maintenant de notre production.

Le 1st sa tâche consiste à ajouter nos styles au wp_head- hook. De cette façon, nous avons la possibilité d’injecter le style personnalisé ajouté par Designer.

Les deuxdakota du Nord Pour ce faire, il ajoute l’ID de publication en cours au filtre post_class pour la balise de modèle post_class();. De cette façon, nous pouvons facilement cibler uniquement le contenu actuel de notre publication, sans rien.

Le 3rd la fonctionnalité est un analyseur. Cet analyseur permet à vos concepteurs d’ajouter des balises de modèle via une couche d’abstraction: Custom %Template Tags%. Ainsi, tout ce qui est défini dans le wpse65707_custom_post_styles_parser sera remplacé par la balise set template. La fonction elle-même est un rappel de filtre pour the_content, vous n'avez donc pas besoin de changer quoi que ce soit pour que cela fonctionne avec le thème que vous utilisez.

<?php
! defined( 'ABSPATH' ) AND exit;
/** Plugin Name: (#65707) »kaiser« Custom Post Styles */

// Add custom styles to the `wp_head` hook in the header.php file.
function wpse65707_custom_post_styles()
{
    $styles = get_post_meta( get_the_ID(), 'wpse65707_styles', true );
    $styles = str_replace( 
         '%ID%'
        ,get_the_ID()
        ,$styles
    );

    return print "<style type='text/css>{$styles}</style>";
}
add_action( 'wp_head', 'wpse65707_custom_post_styles' );

// Add the plain ID to the post classes for easier styling
// Prevents overriding everything else outside
function wpse65707_post_class ( $classes )
{
    $classes[] = get_the_ID();
    return $classes;
} 
add_filter ( 'post_class' , 'wpse65707_post_class' );

// Parse the content to add Template tags on the fly
function wpse65707_custom_post_styles_parser( $content )
{
    $markup = get_post_meta( get_the_ID(), 'wpse65707_markup', true );
    return strtr(
         $markup
        ,array(
             '%CONTENT%' => $content
            ,'%AUTHOR%'  => get_the_author()
            // Add other template tags here
         )
    );
}
add_filter( 'the_content', 'wpse65707_custom_post_styles_parser' );

Modèles: single.php & header.php

Les seules choses importantes pour que cela fonctionne avec un thème sont les balises de modèle suivantes à l'intérieur de ces deux fichiers:

  • header.php doit avoir une balise wp_head().
  • single.php doit utiliser la fonction post_class(); sur la balise HTML post container div/article.
  • single.php doit utiliser the_content(); pour afficher son contenu.

Comment ça marche maintenant?

C'est simple: chaque balise de modèle autorisée dans wpse65707_custom_post_styles_parser() sera échangée avec ce que votre concepteur a écrit.

// Example content for the "MarkUp"-Meta Box
<h1>Hello Me!</h1>
<h2>A fairy tale by %AUTHOR%</h2>
This is story of love and joy.
%CONTENT%
<p>We hope you liked it.</p>

Désormais, %CONTENT% est remplacé par le contenu de publication réel et %AUTHOR%, avec le nom complet de l'auteur. N'hésitez pas à l'étendre.

L'important est la balise seulement que vos concepteurs doivent utiliser pour préfixer leurs styles: La balise %ID%. Cela garantit qu'ils ne ciblent rien en dehors du conteneur d'article actuel.

C'est tout les gens!

2
kaiser

MarkUp personnalisé: modèles de publication

Utiliser des modèles de page.

function wpse65707_post_templates()
{
   add_post_type_support( 'post', 'page-attributes' );
}
add_action( 'init', 'wpse65707_post_templates' );

Ensuite, téléchargez simplement un nouveau modèle pour chaque mise en page personnalisée.

Apparence personnalisée: styles conditionnels

Pour ajouter css à un article, ajoutez simplement une nouvelle feuille de style, que vous avez mise en file d'attente uniquement pour cette page.

function wpse65707_single_styles()
{
    if ( ! is_single() )
        return;

    wp_enqueue_style(
         'style_'.get_the_ID()
        ,get_stylesheet_directory_uri().'/single-styles/style-'.get_the_ID().'.css'
        ,array()
        ,filemtime( get_stylesheet_directory().'/single-styles/style-'.get_the_ID().'.css' )
    );
}
add_action( 'wp_enqueue_scripts', 'wpse65707_single_styles' );

De cette façon, vous pouvez simplement ajouter un dossier nommé ~/single-styles à votre thème, puis un fichier nommé style-IDHERE.css à ce dossier qui ne met en file d'attente que pour cette page. C'est donc quelque chose qui se situe dans la lignée des feuilles de style contextuelles.

S'amuser!

1
kaiser