web-dev-qa-db-fra.com

Ajouter une icône 32x32 à la page d'index de type de publication personnalisée

J'ai configuré un type d'article personnalisé "album" et je souhaite ajouter une icône sur la page d'index où se trouve le cercle ROUGE (voir l'image ci-dessous; sur wptheming.com).

Voici ma fonction pour remplacer l'icône. Le CSS est ce que j'ai trouvé lorsque j'ai inspecté l'élément icon avec firebug:

add_action('admin_head', 'album_foo');
function album_foo() {
        global $post_type;
    ?>
    <style>
    <?php if ($post_type == 'album') : ?>

     #icon-album.icon32.icon32-posts-album {
      background:url('<?php get_template_directory_uri(); ?>/images/album32x32.png') no-repeat;
    } 
    <?php endif; ?>
        </style>
        <?php
}

J'ai aussi essayé ce CSS dans la fonction:

#icon-edit.icon32-posts-album {
        background:url('<?php get_template_directory_uri(); ?>/images/album32x32.png') no-repeat;
}

Je n'arrive pas à comprendre ce qui manque à mon CSS, mais mon icône ne s'affiche pas.

enter image description here

custom-post-typesicon
2
chowwy

Je l'ai compris!

Lorsque WordPress recherche l’icône 32x32 dans les pages de publication/index/modification/addition personnalisées, il commence par rechercher dans:

/wp-admin

car c’est là que se trouvent les icônes WordPress 32px. Mais les références CSS sont généralement relatives à l'emplacement de votre feuille de style. Ainsi, lors de l'ajout de l'emplacement de votre icône au CSS, FIRST, vous devez utiliser/wp-admin comme point de référence. Ce sera donc différent de la plupart des autres références CSS. Utilisez ensuite ces URL relatives pour accéder au répertoire dans lequel se trouve votre icône.

Votre CSS pour une icône 32px de type publication personnalisée devrait ressembler à ceci:

#icon-[your-menu-slug].icon32.icon32-posts-[custom-post-type] {
  background: url('[relative URL, but get out of wp-admin first!]/icon-location') no-repeat;
}

J'espère que cela aide quelqu'un d'autre!

0
chowwy

Sauf si votre serveur a été spécifiquement configuré pour le faire, PHP ne fonctionnera pas dans un fichier .css. On dirait que c'est ce que vous essayez de faire. Les URL relatives fonctionnent bien dans une feuille de style, contrairement à la plupart des parties de WordPress. Essayez d’utiliser une URL relative comme chemin d’accès à votre icône.

Modifier:

Ce n'est pas #icon-album. C'est #icon-edit. Cette id ne change pas avec les types de publication, du moins pas avec ceux que j'ai essayés. La classes change. Cette id semble rester la même.

add_action('admin_head', 'album_foo');
function album_foo() {
    global $post_type;$_GET; ?>
    <?php if (( isset($_GET['post_type'] && $_GET['post_type'] == 'album') || ($post_type == 'album')) : ?>
      <style type="text/css">
    #icon-edit.icon32.icon32-posts-post {
      background:url('<?php get_template_directory_uri(); ?>/images/album32x32.png') no-repeat;
    } 
      </style>
    <?php endif;
}

J'ai déplacé la balise <style dans la condition car il n'est pas nécessaire d'imprimer une balise vide et, avec le débogage, l'impression de WARNING est instillée, ce qui peut provoquer la rupture de la balise <style>. J'ai également ajouté une vérification pour voir si $_GET['post_type'] est défini avant d'essayer de l'utiliser.

0
s_ha_dum

Si, lorsque vous utilisez firebug , vous voyez

#icon-album.icon32.icon32-posts-album {
  background:url('<?php get_template_directory_uri(); ?>/images/album32x32.png') no-repeat;
}

Ensuite, vous passez la chaîne '<?php get_template_directory_uri(); ?>/images/album32x32.png' à la propriété background de votre fichier css - et ils n'exécutent pas le code php.

Si l'image et le CSS se trouvent dans un dossier de thème (ou au moins le fichier CSS se trouve dans un répertoire situé au-dessus de/avec l'image), vous pouvez utiliser des URL relatives.

Pour ceux qui développent des plug-ins pour publication et ne veulent pas mettre en file d'attente un fichier CSS pour une simple ligne ...

// Adds icon to the page head
add_action('admin_head', 'wpse74477_plugin_header_image');
function wpse74477_plugin_header_image() {
    $post_type = get_current_screen()->post_type;

    if ( 'album' != $post_type )
        return;
    ?>
         <style type="text/css">
            .icon32.icon32-posts-album {
               background: url(<?php echo get_template_directory_uri(); ?>/images/album32x32.png) !important;
            }
         </style>
     <?php
}
0
Stephen Harris