web-dev-qa-db-fra.com

Ajouter un étui à afficheur pour écran avec une classe au titre

J'ai besoin que certains articles aient des couleurs de titre différentes des autres, et j'ai pensé que cela serait plus facilement réalisé par une sorte de case à cocher sur l'écran de création/modification de l'article. Comment pourrais-je ajouter la case à cocher, puis récupérer la valeur dans le modèle?

Merci

postscustom-fieldcustomization
5
SudoWP

Oui, c'est vrai, vous avez besoin d'une Custom Meta Box qui créera les cases à cocher dans l'écran Post Editing.

post custom meta box

Dans ce cas, ce sont des boutons radio, car nous n’avons besoin que d’une seule valeur.

Ce qui suit est le code qui le crée. Placez-le dans le fichier functions.php de votre thème ou créez un plug-in simple afin qu'il devienne indépendant du thème.

/* Define the custom box */
add_action( 'add_meta_boxes', 'wpse_61041_add_custom_box' );

/* Do something with the data entered */
add_action( 'save_post', 'wpse_61041_save_postdata' );

/* Adds a box to the main column on the Post and Page edit screens */
function wpse_61041_add_custom_box() {
    add_meta_box( 
        'wpse_61041_sectionid',
        'Title Color',
        'wpse_61041_inner_custom_box',
        'post',
        'side',
        'high'
    );
}

/* Prints the box content */
function wpse_61041_inner_custom_box($post)
{
    // Use nonce for verification
    wp_nonce_field( 'wpse_61041_wpse_61041_field_nonce', 'wpse_61041_noncename' );

    // Get saved value, if none exists, "default" is selected
    $saved = get_post_meta( $post->ID, 'title_color', true);
    if( !$saved )
        $saved = 'default';

    $fields = array(
        'red'       => __('Red', 'wpse'),
        'green'     => __('Green', 'wpse'),
        'blue'      => __('Blue', 'wpse'),
        'default'   => __('Default', 'wpse'),
    );

    foreach($fields as $key => $label)
    {
        printf(
            '<input type="radio" name="title_color" value="%1$s" id="title_color[%1$s]" %3$s />'.
            '<label for="title_color[%1$s]"> %2$s ' .
            '</label><br>',
            esc_attr($key),
            esc_html($label),
            checked($saved, $key, false)
        );
    }
}

/* When the post is saved, saves our custom data */
function wpse_61041_save_postdata( $post_id ) 
{
      // verify if this is an auto save routine. 
      // If it is our form has not been submitted, so we dont want to do anything
      if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) 
          return;

      // verify this came from the our screen and with proper authorization,
      // because save_post can be triggered at other times
      if ( !wp_verify_nonce( $_POST['wpse_61041_noncename'], 'wpse_61041_wpse_61041_field_nonce' ) )
          return;

      if ( isset($_POST['title_color']) && $_POST['title_color'] != "" ){
            update_post_meta( $post_id, 'title_color', $_POST['title_color'] );
      } 
}

code basé sur cette réponse

Comment l'utiliser dans le thème

Avec les règles CSS appropriées en place (h1.default, h1.red, etc.), partout où vous souhaitez appliquer la classe de couleur au titre (index.php, single.php, etc.), utilisez quelque chose du type:

<?php $title_color = get_post_meta( get_the_ID(), 'title_color', true); ?>
<h1 class="entry-title <?php echo esc_attr($title_color); ?>"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
9
brasofilo

Le travail de @brasofilo est excellent, mais si vous ne souhaitez pas coder beaucoup, vous pouvez effectuer le même travail à partir de Custom Fields. Il est caché par défaut. Vous pouvez faire est visible depuis Screen Options. Créez un nouveau champ et nommez-le color et mettez le nom de la couleur dans le champ value. Ensuite, placez ce code dans la balise header.php ci-dessous </head> de votre thème.

<style type="text/css">
/*Replace [color-name] with you color example: red*/
#red {color:"red";}
#green {color:"green";}
#[color-name] {color:"[color-name]";}
#[color-name] {color:"[color-name]";}
</style>
    <?php
global $post;
$color = get_post_meta(get_the_ID(), 'color', true);
$id = "id="
?>

Ensuite, recherchez <h1 class="entry-title" et mettez-y le code <?php echo $id, $color;?>. Maintenant, lorsque vous souhaitez changer la couleur du titre, choisissez color dans les champs personnalisés déroulants et écrivez le nom de la couleur dans value.

1
John Doe