Ajout de champs à l’écran de modification de catégorie, de balise et de taxonomie personnalisée dans l’administrateur de WordPress?

33

La question est « Comment puis-je ajouter un ou plusieurs champs à la catégorie, Tag et personnalisée Taxonomy Modifier l' écran dans le admin WordPress? » A Cette question a demandé aux pirates wp-liste 1er Août 2010 et je lui ai proposé une solution plus tard ce jour - là. Le demandeur initial a de nouveau abordé la question aujourd'hui (le 21 août), ce qui m'a rappelé la solution. Puisqu'il pourrait s'agir d'un besoin commun, j'ai décidé de poster la solution, y compris le code, pour que d'autres la trouvent ultérieurement.

Mike Schinkel
la source
Bonjour mike, je pense que ce serait mieux si vous postez le code dans la zone de réponse. De cette façon, nous avons une sauvegarde ici, au cas où github serait arrêté.
ariefbayu
@ Silent: Hé, j'y travaille. :) J'ai presque terminé, mais je me suis heurté à un mur et j'ai besoin de dormir. Voici à quoi ça ressemblera (quelque chose) quand j'aurai fini: wordpress.stackexchange.com/questions/578/#582
MikeSchinkel
Plus de développements sur celui-ci? En fait, je suis plutôt intéressé ...: D
John P Bloch Le
Hey @ John P Bloch : Mes clients m'ont immobilisé et n'ont tout simplement pas eu le temps. J'espère bientôt ...
MikeSchinkel le
@John P Bloch Je l'ai effectivement essayé et cela fonctionne très bien. J'avais besoin de "grouper" certaines catégories sans catégorie parent.
Amit

Réponses:

23

J'ai ajouté le nouveau champ 'image' (fichier de type d'entrée) à la catégorie à l'aide de ces derniers

add_action('category_edit_form_fields','category_edit_form_fields');
add_action('category_edit_form', 'category_edit_form');
add_action('category_add_form_fields','category_edit_form_fields');
add_action('category_add_form','category_edit_form');


function category_edit_form() {
?>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#edittag').attr( "enctype", "multipart/form-data" ).attr( "encoding", "multipart/form-data" );
        });
</script>
<?php 
}

function category_edit_form_fields () {
?>
    <tr class="form-field">
            <th valign="top" scope="row">
                <label for="catpic"><?php _e('Picture of the category', ''); ?></label>
            </th>
            <td>
                <input type="file" id="catpic" name="catpic"/>
            </td>
        </tr>
        <?php 
    }

Vous êtes libre d'utiliser n'importe quelle taxonomie, remplacez simplement categorypar votre nom de taxonomie

tpoxa
la source
c'est excellent, mais pourriez-vous s'il vous plaît expliquer (ou éventuellement donner un exemple) comment intégrer correctement cette personnalisation si vous souhaitez l'ajouter à une taxonomie personnalisée - par exemple, "personnes"
NetConstructor.com
2
Mise à jour - Bien que j'ai copié votre code exact ci-dessus pour le tester, le fichier ne semble pas être enregistré ou du moins, il ne s'affiche pas. Pourriez-vous expliquer où il enregistre le fichier, peut-être que les autorisations de ce dossier doivent être modifiées (ou mieux encore, pourriez-vous décrire comment on pourrait modifier l'emplacement du dossier où il est enregistré?). Lorsque je sélectionne un fichier, puis que j'essaie de sauvegarder un terme, il enregistre tout, sauf le fichier, et ne me montre donc pas l'image téléchargée.
NetConstructor.com
9

En outre, si vous souhaitez ajouter ce champ dans le formulaire de taxonomie personnalisée, vous devez simplement remplacer la catégorie par le nom de la taxonomie personnalisée dans la add_actionfonction.

Exemple:

add_action('{custom_taxonomy}_edit_form_fields','category_edit_form_fields');
add_action('{custom_taxonomy}_edit_form', 'category_edit_form');
add_action('{custom_taxonomy}_add_form_fields','category_edit_form_fields');
add_action('{custom_taxonomy}_add_form','category_edit_form');
Ted
la source
2

Pour ceux qui cherchent à accrocher dans le champ de formulaire de balise, le crochet est légèrement différent.

add_tag_form_fields

au lieu de tag_add_form_fields comme on peut s'y attendre

Dean_Wilson
la source
1

Je sais que cela a été demandé il y a quelque temps, mais WordPress a un peu changé depuis. J'ai donc décidé de développer un petit script qui simplifie le processus d'ajout de champs personnalisés aux taxonomies, et vous permet éventuellement d'ajouter des colonnes à la table de termes pour chaque champ. Le script s'appelle amarkal-taxonomy et fait partie du framework Amarkal WordPress.

Utiliser amarkal-taxonomy, ajouter un champ personnalisé simplifie:

// Add a text field to the 'category' taxonomy 'add' & 'edit' forms:
amarkal_taxonomy_add_field('category', 'cat_icon', array(
    'type'        => 'text',
    'label'       => 'Icon',
    'description' => 'The category\'s icon',
    'table'       => array(
        'show'      => true,  // Add a column to the terms table
        'sortable'  => true   // Make that column sortable
    )
));

// Then you can retrieve the data using:
$icon = get_term_meta( $term_id, 'cat_icon', true );
Yoav Kadosh
la source
1

J'ai ajouté les éléments add image et Remove image extra classés dans la taxonomie personnalisée dont le nom est assurance.

/**
 * Plugin class
 **/
if ( ! class_exists( 'CT_TAX_META' ) ) {

class CT_TAX_META {

  public function __construct() {
    //
  }

 /*
  * Initialize the class and start calling our hooks and filters
  * @since 1.0.0
 */
 public function init() {
   add_action( 'insurance_add_form_fields', array ( $this, 'add_category_image' ), 10, 2 );
   add_action( 'created_insurance', array ( $this, 'save_category_image' ), 10, 2 );
   add_action( 'insurance_edit_form_fields', array ( $this, 'update_category_image' ), 10, 2 );
   add_action( 'edited_insurance', array ( $this, 'updated_category_image' ), 10, 2 );
   add_action( 'admin_enqueue_scripts', array( $this, 'load_media' ) );
   add_action( 'admin_footer', array ( $this, 'add_script' ) );
 }

public function load_media() {
 wp_enqueue_media();
}

 /*
  * Add a form field in the new category page
  * @since 1.0.0
 */
 public function add_category_image ( $taxonomy ) { ?>
   <div class="form-field term-group">
     <label for="category-image-id"><?php _e('Image', 'hero-theme'); ?></label>
     <input type="hidden" id="category-image-id" name="category-image-id" class="custom_media_url" value="">
     <div id="category-image-wrapper"></div>
     <p>
       <input type="button" class="button button-secondary ct_tax_media_button" id="ct_tax_media_button" name="ct_tax_media_button" value="<?php _e( 'Add Image', 'hero-theme' ); ?>" />
       <input type="button" class="button button-secondary ct_tax_media_remove" id="ct_tax_media_remove" name="ct_tax_media_remove" value="<?php _e( 'Remove Image', 'hero-theme' ); ?>" />
    </p>
   </div>
 <?php
 }

 /*
  * Save the form field
  * @since 1.0.0
 */
 public function save_category_image ( $term_id, $tt_id ) {
   if( isset( $_POST['category-image-id'] ) && '' !== $_POST['category-image-id'] ){
     $image = $_POST['category-image-id'];
     add_term_meta( $term_id, 'category-image-id', $image, true );
   }
 }

 /*
  * Edit the form field
  * @since 1.0.0
 */
 public function update_category_image ( $term, $taxonomy ) { ?>
   <tr class="form-field term-group-wrap">
     <th scope="row">
       <label for="category-image-id"><?php _e( 'Image', 'hero-theme' ); ?></label>
     </th>
     <td>
       <?php $image_id = get_term_meta ( $term -> term_id, 'category-image-id', true ); ?>
       <input type="hidden" id="category-image-id" name="category-image-id" value="<?php echo $image_id; ?>">
       <div id="category-image-wrapper">
         <?php if ( $image_id ) { ?>
           <?php echo wp_get_attachment_image ( $image_id, 'thumbnail' ); ?>
         <?php } ?>
       </div>
       <p>
         <input type="button" class="button button-secondary ct_tax_media_button" id="ct_tax_media_button" name="ct_tax_media_button" value="<?php _e( 'Add Image', 'hero-theme' ); ?>" />
         <input type="button" class="button button-secondary ct_tax_media_remove" id="ct_tax_media_remove" name="ct_tax_media_remove" value="<?php _e( 'Remove Image', 'hero-theme' ); ?>" />
       </p>
     </td>
   </tr>
 <?php
 }

/*
 * Update the form field value
 * @since 1.0.0
 */
 public function updated_category_image ( $term_id, $tt_id ) {
   if( isset( $_POST['category-image-id'] ) && '' !== $_POST['category-image-id'] ){
     $image = $_POST['category-image-id'];
     update_term_meta ( $term_id, 'category-image-id', $image );
   } else {
     update_term_meta ( $term_id, 'category-image-id', '' );
   }
 }

/*
 * Add script
 * @since 1.0.0
 */
 public function add_script() { ?>
   <script>
     jQuery(document).ready( function($) {
       function ct_media_upload(button_class) {
         var _custom_media = true,
         _orig_send_attachment = wp.media.editor.send.attachment;
         $('body').on('click', button_class, function(e) {
           var button_id = '#'+$(this).attr('id');
           var send_attachment_bkp = wp.media.editor.send.attachment;
           var button = $(button_id);
           _custom_media = true;
           wp.media.editor.send.attachment = function(props, attachment){
             if ( _custom_media ) {
               $('#category-image-id').val(attachment.id);
               $('#category-image-wrapper').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
               $('#category-image-wrapper .custom_media_image').attr('src',attachment.url).css('display','block');
             } else {
               return _orig_send_attachment.apply( button_id, [props, attachment] );
             }
            }
         wp.media.editor.open(button);
         return false;
       });
     }
     ct_media_upload('.ct_tax_media_button.button'); 
     $('body').on('click','.ct_tax_media_remove',function(){
       $('#category-image-id').val('');
       $('#category-image-wrapper').html('<img class="custom_media_image" src="" style="margin:0;padding:0;max-height:100px;float:none;" />');
     });
     // Thanks: http://stackoverflow.com/questions/15281995/wordpress-create-category-ajax-response
     $(document).ajaxComplete(function(event, xhr, settings) {
       var queryStringArr = settings.data.split('&');
       if( $.inArray('action=add-tag', queryStringArr) !== -1 ){
         var xml = xhr.responseXML;
         $response = $(xml).find('term_id').text();
         if($response!=""){
           // Clear the thumb image
           $('#category-image-wrapper').html('');
         }
       }
     });
   });
 </script>
 <?php }

  }

$CT_TAX_META = new CT_TAX_META();
$CT_TAX_META -> init();

}

Remarque: Si vous souhaitez ajouter ce champ à une taxonomie différente, par exemple pour un type d'article personnalisé, vous devez remplacer la référence à la catégorie par une référence à votre propre code de taxonomie. Par exemple, si vous ajoutez une taxonomie de genre créée, vous lierez cette fonction via

add_action( 'taxonomy_add_form_fields', array ( $this, 'add_category_image' ), 10, 2 ).

Mon nom de taxonomie slug est une assurance.

add_action ('insurance_add_form_fields', tableau ($ this, 'add_category_image'), 10, 2);

Utilisez ce code dans votre functions.phpfichier.

Vivekpathak
la source
0

Vous devez ajouter votre code dans le fichier functions.php de votre thème. De même, si vous souhaitez ajouter ce champ dans le formulaire de taxonomie personnalisée, vous devez simplement remplacer la catégorie par le nom de la taxonomie personnalisé dans la fonction add_action. Exemple: add_action ('category_edit_form_fields', 'category_edit_form_fields'); sera add_action ('custom_taxonomy_name_form_fields', 'function_name_to_hook_on');


la source