¿Alguna vez se preguntó cómo podría agregar íconos personalizados para sus tipos de publicaciones personalizadas en WordPress? Si es así, entonces estás en el lugar correcto. En este artículo, le mostraremos cómo agregar íconos para tipos de publicaciones personalizadas en WordPress.
WordPress comenzó a usar una fuente de iconos llamada Dashicons desde WordPress 3.8. Estos íconos de fuentes se ven muy bien en cualquier dispositivo o tamaño de pantalla. Bueno, puede aprovechar estos íconos para asignar íconos personalizados a sus tipos de publicaciones.
Videotutorial
Si no le gusta el video o necesita más instrucciones, continúe leyendo.
Agregar iconos de tipo de publicación personalizados usando un complemento
Lo primero que debe hacer es instalar y activar el Icono personalizado CPT enchufar. Tras la activación, simplemente vaya a Configuración » Configuración de iconos personalizados de CPT donde verá sus tipos de publicaciones personalizadas en la lista. A continuación, haga clic en el botón «Elegir icono» junto a un tipo de publicación personalizada y luego seleccione una fuente del menú.
Agregar íconos usando el complemento de interfaz de usuario de tipo de publicación personalizada
Si es nuevo en el registro de un tipo de publicación personalizada, le recomendamos que utilice Interfaz de usuario de tipo de publicación personalizada complemento para crear y administrar tipos de publicaciones y taxonomías personalizadas.
Agregar un ícono a un tipo de publicación personalizada creada con el complemento CPT UI es muy simple. Es compatible con Dashicons de forma predeterminada, por lo que primero debe visitar el sitio web de dashicons y seleccione el ícono que desea usar para su tipo de publicación.
Al hacer clic en un icono de la lista, se mostrará una versión más grande del icono en la parte superior. Junto a él, verá la clase CSS del icono. Será algo así como dashicons-groups, dashicons-calendar, dashicons-cart, etc. Debe copiar la clase CSS y editar el tipo de publicación personalizada que desea editar en la interfaz de usuario de CPT. Todo lo que necesita hacer es hacer clic en el Opciones avanzadas enlace y desplácese hacia abajo hasta la sección Icono de menú, luego pegue la clase CSS y guarde los cambios.
También puede crear un icono de imagen usted mismo y cargarlo haciendo clic en Medios » Agregar nuevo. Después de la carga, haga clic en el enlace Editar y copie la URL del archivo de imagen. Ahora simplemente pegue esta URL en el campo del icono de menú en la configuración de la interfaz de usuario de CPT.
Agregar manualmente un ícono a un tipo de publicación personalizada
Si creó un tipo de publicación personalizada colocando un código en el complemento específico de su sitio o en el archivo functions.php, entonces puede agregar íconos de menú manualmente. Una vez más, simplemente visite el sitio web de Dashicons para seleccionar un icono y copiar la clase CSS. Después de esto, agréguelo a su código de tipo de publicación personalizado de esta manera:
'menu_icon' => 'dashicons-cart',
También puede agregar la URL completa de un archivo de imagen que desea mostrar como icono, así:
'menu_icon' => 'http://www.example.com/wp-content/uploads/2014/11/your-cpt-icon.png',
Aquí hay un fragmento de código completo que crea un tipo de publicación personalizada llamada productos con un ícono de menú:
// Register Custom Post Type
function custom_post_type() {
$labels = array(
'name' => _x( 'products', 'Post Type General Name', 'text_domain' ),
'singular_name' => _x( 'Product', 'Post Type Singular Name', 'text_domain' ),
'menu_name' => __( 'Products', 'text_domain' ),
'parent_item_colon' => __( 'Parent Item:', 'text_domain' ),
'all_items' => __( 'All Items', 'text_domain' ),
'view_item' => __( 'View Item', 'text_domain' ),
'add_new_item' => __( 'Add New Item', 'text_domain' ),
'add_new' => __( 'Add New', 'text_domain' ),
'edit_item' => __( 'Edit Item', 'text_domain' ),
'update_item' => __( 'Update Item', 'text_domain' ),
'search_items' => __( 'Search Item', 'text_domain' ),
'not_found' => __( 'Not found', 'text_domain' ),
'not_found_in_trash' => __( 'Not found in Trash', 'text_domain' ),
);
$args = array(
'label' => __( 'Products', 'text_domain' ),
'description' => __( 'Post Type Description', 'text_domain' ),
'labels' => $labels,
'supports' => array( ),
'taxonomies' => array( 'category', 'post_tag' ),
'hierarchical' => false,
'public' => true,
'show_ui' => true,
'show_in_menu' => true,
'show_in_nav_menus' => true,
'show_in_admin_bar' => true,
'menu_position' => 5,
'menu_icon' => 'dashicons-cart',
'can_export' => true,
'has_archive' => true,
'exclude_from_search' => false,
'publicly_queryable' => true,
'capability_type' => 'page',
);
register_post_type( 'Products', $args );
}
// Hook into the 'init' action
add_action( 'init', 'custom_post_type', 0 );
Esperamos que este artículo le haya ayudado a agregar íconos para sus tipos de publicaciones personalizadas en WordPress. También puede consultar cómo usar fuentes de iconos en el editor de publicaciones de WordPress.
Si te ha gustado este artículo, suscríbete a nuestro Canal de Youtube para tutoriales en vídeo de WordPress. También puedes encontrarnos en Gorjeo y Google+.