web-dev-qa-db-fra.com

Wordpress Changer les modèles de poste, mais pas de liste déroulante, mais la sélection d'image

J'ai parcouru WordPress Codex, et je trouve quelque chose comme ça →

function is_page_template( $template = '' ) {
    $page_template = get_page_template_slug( get_queried_object_id() );


if ( empty( $template ) )
    return (bool) $page_template;

if ( $template == $page_template )
    return true;

if ( is_array( $template ) ) {
    if ( ( in_array( 'default', $template, true ) && ! $page_template )
        || in_array( $page_template, $template, true )
    ) {
        return true;
    }
}

return ( 'default' === $template && ! $page_template );
}

Je pense que si nous collons ce qui précède dans le fichier functions.php, nous aurons des options de modèle de publication, non?

mais que se passe-t-il si nous voulons une sélection de modèle de type de message avec des images comme celle-ci → enter image description here Ceci est une image tirée de la page de post genèse.

WordPress fournit-il de tels arrangements? Je suis un débutant, donc je ne comprenais pas comment puis-je accomplir cela?

Bien que la logique soit claire pour moi →

Étape 1: Créez une méta dans le backend qui aura certaines options de sélection comme celle-ci → enter image description hereenter image description hereenter image description here

** Étape 2 ** → nous devons connecter notre option sélectionnée dans cette méta pour imprimer une classe. Par exemple, supposons que les images sont en ordre, puis si la seconde est sélectionnée (deuxième image), alors echo "sidebar-wrap2", qui est une classe.

Actuellement, c'est le HTML →

<aside class="main-sidebar col">
    <?php dynamic_sidebar( 'sidebar1' ); ?>
</aside>





<aside class="main-sidebar col <?php If certain condition true {echo "sidebar-wrap2"} ?> ">
    <?php dynamic_sidebar( 'sidebar1' ); ?>
</aside>

Bien que je ne sache pas quelle sera cette condition, et comment l'écrire.

Je suis un novice en codage, alors pardonnez-moi s'il vous est impossible de présenter ma question correctement. Merci!

2
The WP Novice

C’est une fonctionnalité en profondeur que vous essayez d’obtenir, mais j’ai énuméré ci-dessous des informations qui vous aideront à ajouter cette fonctionnalité.

  1. Construisez une meta_box personnalisée avec vos options pour le type de message créer une méta-boîte est un bon point de départ que vous pourrez en rechercher davantage pour d'autres exemples.
  2. Création d'un bouton radio d'image Images du bouton radio
  3. Vous devez sélectionner cette option dans la zone d'affichage de votre publication et vérifier quelle option a été enregistrée pour afficher la mise en page souhaitée.

Vous aurez besoin d'inclure une sorte de code, comme ci-dessous, dans lequel vous renverrez votre publication si vous êtes dans single.php, mais j'ajouterais cette page comme thème enfant si vous n'êtes pas l'auteur du thème pour les mises à jour futures.

// Get our option for post ID from the options meta box change "$field_name" to your option name you use in the meta box
$post_id = get_post_meta(get_the_ID(),$field_name,true);

// Check our option and change the display to what option is set

if($post_id == 'sidebar1'){
  dynamic_sidebar( 'sidebar1' );
}
if($post_id == 'sidebar2'){
  dynamic_sidebar( 'sidebar2' );
}
else{
 // Added for when an option is not set
}

enter image description here

MISE À JOUR 2:

Voici un code de plug-in qui créera la boîte à méta et ajoutera le jeu de boutons d'option d'image et enregistrera les données. Il définira également la bordure rouge de l'option sélectionnée, le cas échéant. Vous voudrez aussi faire certaines des choses ci-dessous pour utiliser ceci sur un site actif.

  1. Enregistrez le code dans un fichier php et ajoutez-le dans un dossier prêt à être téléchargé sur un site
  2. Éditez les détails du plugin ainsi que le code par défaut tel que custom_meta_box_markup
  3. Copiez le fichier css dans un fichier séparé et utilisez également le dossier des images, puis créez un lien vers vos propres images.

Le code:

<?php
    /**
    * Plugin Name: Post options panel
    * Plugin URI: url to plugin
    * Description: Adds posts options layout
    * Version: 1.0
    * Author: My name
    * Author URI: My url
    * License: A "Slug" license name e.g. GPL12
    */

    // Dont call me direct!
    if ( ! defined( 'ABSPATH' ) ) exit;




    // Create content
    function custom_meta_box_markup($object)
    {
        wp_nonce_field(basename(__FILE__), "meta-box-nonce");

        ?>

    <style>
    label > input{ /* HIDE RADIO */
      visibility: hidden; /* Makes input not-clickable */
      position: absolute; /* Remove input from document flow */
    }
    label > input + img{ /* IMAGE STYLES */
      cursor:pointer;
      border:2px solid transparent;
    }
    label > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
      border:2px solid #f00;
    }
    </style>



            <div>

                <h4>Radio options</h4>
                <?php
                    // U need to use this to set the checked="checked"
                    $checkbox_value = get_post_meta($object->ID, "meta-box-radio", true);
                ?>
                           <label>
                           <input type="radio" name="meta-box-radio" value="sidebar1"<?php if($checkbox_value == 'sidebar1'){echo 'checked =\"checked\"';} ?> /><img src="http://3.bp.blogspot.com/-J7zDitJOPZs/VhysC9I9n7I/AAAAAAAAERk/fAMHsC2fiGI/s1600/grey_new_seo-18-512.png" style="height: 20px; width: 20px;"></label>
                           <label>
                           <input type="radio" name="meta-box-radio" value="sidebar2" <?php if($checkbox_value == 'sidebar2'){echo 'checked =\"checked\"';} ?>/><img src="http://3.bp.blogspot.com/-J7zDitJOPZs/VhysC9I9n7I/AAAAAAAAERk/fAMHsC2fiGI/s1600/grey_new_seo-18-512.png" style="height: 20px; width: 20px;"></label>
                           <label>
                           <input type="radio" name="meta-box-radio" value="sidebar3" <?php if($checkbox_value == 'sidebar3'){echo 'checked =\"checked\"';} ?>/><img src="http://3.bp.blogspot.com/-J7zDitJOPZs/VhysC9I9n7I/AAAAAAAAERk/fAMHsC2fiGI/s1600/grey_new_seo-18-512.png" style="height: 20px; width: 20px;"></label>

            </div>
    <?
    }


    // Saving data
    function save_custom_meta_box($post_id, $post, $update)
    {
        if (!isset($_POST["meta-box-nonce"]) || !wp_verify_nonce($_POST["meta-box-nonce"], basename(__FILE__)))
            return $post_id;

        if(!current_user_can("edit_post", $post_id))
            return $post_id;

        if(defined("DOING_AUTOSAVE") && DOING_AUTOSAVE)
            return $post_id;

        $slug = "post";
        if($slug != $post->post_type)
            return $post_id;



        if(isset($_POST["meta-box-radio"]))
        {
            $meta_box_value = $_POST["meta-box-radio"];
        }
        update_post_meta($post_id, "meta-box-radio", $meta_box_value);

    }

    add_action("save_post", "save_custom_meta_box", 10, 3);


    function add_custom_meta_box()
    {
        add_meta_box("demo-meta-box", "Custom Meta Box", "custom_meta_box_markup", "post", "normal", "high", null);
    }

    add_action("add_meta_boxes", "add_custom_meta_box");

Voici le code que vous pouvez utiliser pour obtenir l'option enregistrée

// Get our option for post ID from the options meta box change "$field_name" to your option name you use in the meta box
$post_option = get_post_meta(get_the_ID(),"meta-box-radio",true);

// Check our option and change the display to what option is set

    if($post_option == 'sidebar1'){
      dynamic_sidebar( 'sidebar1' );
    }
    if($post_option == 'sidebar2'){
      dynamic_sidebar( 'sidebar2' );
    }
    else{
     // Added for when an option is not set
    }
1
Sam