X

Cómo agregar íconos para tipos de publicación personalizados en WordPress

Snippets de IsItWP

¿Quieres agregar íconos para tipos de publicación personalizados en WordPress para las páginas de publicación nueva y de edición? Es fácil con nuestro fragmento de código. Echemos un vistazo.

Instrucciones:

Agrega este fragmento a functions.php o a un plugin específico del sitio. No olvides cambiar la URL en la línea 9 a la ubicación de tu ícono de 24px por 24px.

add_action( 'admin_head-post.php', 'post_type_icon');
add_action( 'admin_head-post-new.php', 'post_type_icon');
function post_type_icon() {
        global $post_type;
	?>
	<style>
	<?php if($post_type == 'products'){ ?>
	#icon-edit { 
                background: url('<?php echo 'http://example.com/wp-content/themes/theme_name/i/icon_24x24.png';?>') no-repeat; }
	<?php } ?>
        </style>
        <?php
}

Alternativamente, puedes usar este código. Este fragmento crea un tipo de publicación personalizado (llamado “products” en la línea 9) y establece el ícono del menú para ese tipo de publicación personalizado. Agrega este fragmento a functions.php o a un plugin específico del sitio. En la línea 10 de este fragmento, establecemos la URL de menu_icon a la ubicación de la imagen del ícono de 16px por 16px para mostrar en el menú de administración.

$args = array(
        'label' => __('Products'),
        'singular_label' => __('Product'),
        'public' => true,
        'show_ui' => true,
        'capability_type' => 'page',
        'hierarchical' => false,
        'rewrite' => true,
        'query_var' => 'products',
    'menu_icon' => 'http://site.com/wp-content/themes/theme_name/i/icon_16x16.png',
        'supports' => array('title','editor','comments','thumbnail')
);
register_post_type( 'product' , $args );

Nota: Si es la primera vez que agregas fragmentos de código en WordPress, consulta nuestra guía sobre cómo copiar / pegar fragmentos de código correctamente en WordPress, para que no rompas accidentalmente tu sitio.

Si te gustó este fragmento de código, considera echar un vistazo a nuestros otros artículos en el sitio como: Los mejores constructores de páginas de WordPress (comparados).

Comentarios   Deja una respuesta

  1. No parece funcionar en WP 3.2.1.  Tengo un tema personalizado que estoy desarrollando y he agregado mi propia función a functions.php y he añadido las acciones, pero nada.

    Parece que los únicos estilos que se aplican son de la hoja de estilos "colors-fresh.css".  He revisado todas las faltas de ortografía y me he asegurado de que mis sentencias if coincidan con la definición correcta del tipo de publicación.

    1. Si ves el código fuente en la página de administración, deberías poder ver si el CSS anterior se agregó a las páginas de administración del tipo de publicación personalizado adecuadas. Esto es simplemente CSS que anula los íconos predeterminados utilizados. También podrías intentar agregar !important al final del CSS para asegurarte de que anule cualquier valor predeterminado.

    2. Por supuesto, 6 minutos después, lo descubro.  Cambié la línea

      a

      Esto pareció ser todo lo necesario para arreglarlo.  No tengo idea de por qué la línea anterior no me funcionaba porque lógicamente debería haberlo hecho.

      1. ¿Uh, las etiquetas de código no funcionan?

        1. No :/ no con diquss,

  2. se puede hacer con un hook
    como aquí

    add_action("admin_head", array(&$this, "stylize")); //uso clases

    function stylize() {
    global $post_type;
    if($post_type == 'billboard') echo '#icon-edit {background: url("'.plugins_url( 'billboard.png', __FILE__ ).'") no-repeat; }';
    }

    1. Sí, estaba pensando en usar admin_head, sin embargo, solo necesitamos reemplazar el ícono grande en dos páginas, por lo que agregarlo a admin_head aún agregaría el código a todas las páginas.

Agrega un comentario

Nos complace que hayas elegido dejar un comentario. Ten en cuenta que todos los comentarios se moderan de acuerdo con nuestra política de privacidad, y todos los enlaces son nofollow. NO uses palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.

Lista de verificación para lanzar WordPress

La lista de verificación definitiva para lanzar WordPress

Hemos recopilado todos los elementos esenciales de la lista de verificación para el lanzamiento de tu próximo sitio web de WordPress en un práctico ebook.
¡Sí, envíame el eBook gratis!