Cómo agregar iconos para tipos de publicaciones personalizadas en WordPress

¿Alguna vez se ha preguntado cómo puede agregar iconos 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 iconos para tipos de publicaciones personalizadas en WordPress.

WordPress comenzó a usar una fuente de iconos llamada Dashicons desde WordPress 3.8. Estos iconos de fuentes se ven muy bien en cualquier dispositivo o tamaño de pantalla. Bueno, puedes aprovechar estos íconos para asignar íconos personalizados a tus tipos de publicaciones.

Si no le gusta el video o necesita más instrucciones, siga leyendo.

Agregar íconos de tipo de publicación personalizados usando un plugin

Lo primero que debe hacer es instalar y activar el archivo. Icono personalizado de CPT conectar. Después de la activación, simplemente vaya a Configuración »Configuración de iconos personalizados de CPT donde verá sus tipos de publicaciones personalizadas enumeradas. Luego, haga clic en el botón «Elegir icono» junto a un tipo de publicación personalizada y seleccione una fuente del menú.

Agregar íconos usando el plugin de interfaz de usuario de tipo de publicación personalizada

Si es nuevo en registrarse para un tipo de publicación personalizada, le recomendamos usar IU personalizada de tipo de publicación plugins para crear y administrar taxonomías y tipos de publicaciones personalizadas.

Agregar un icono a un tipo de publicación personalizada creado con el plugin CPT UI es muy simple. Es compatible con Dashicon de forma predeterminada, por lo que primero debe visitar el Sitio web de Dashicon y seleccione el icono que desea utilizar para el tipo de publicación.

Al hacer clic en un icono de la lista, se mostrará una versión más grande del icono superior. Junto a él, verá la clase CSS del icono. Será algo como dashicon-groups, dashicon-calendar, dashicon-cart, etc. Debe copiar la clase CSS y cambiar el tipo de publicación personalizada que desea cambiar en la interfaz de usuario de CPT. Todo lo que necesita hacer es hacer clic en el enlace Opciones avanzadas y desplazarse hacia abajo hasta la sección Icono del menú, luego pegar la clase CSS y guardar los cambios.

También puede crear un icono de imagen usted mismo y cargarlo haciendo clic en Medios »Agregar nuevo. Después de cargar, 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 iconos manualmente a un tipo de publicación personalizada

Si ha creado un tipo de publicación personalizada colocando código en el plugin específico de su sitio o en el archivo functions.php, puede agregar manualmente iconos de menú. Nuevamente, simplemente visite el sitio web de Dashicon para seleccionar un icono y copiar la clase CSS. Después de esto, agréguelo a su código de tipo de publicación personalizada así:

'menu_icon'           => 'dashicons-cart',

También puede agregar la URL completa de un archivo de imagen que desea mostrar como un 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 te haya ayudado a agregar íconos para tus tipos de publicaciones personalizadas en WordPress. Es posible que también desee ver cómo usar las fuentes de iconos en el editor de publicaciones de WordPress.