¿Alguna vez se preguntó cómo podría 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 íconos 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 geniales en cualquier dispositivo o tamaño de pantalla. Bueno, puedes aprovechar estos íconos para asignar íconos personalizados a tus tipos de publicaciones.
Video tutorial
Si no le gusta el video o necesita más instrucciones, continúe leyendo.
Agregar íconos de tipo de publicación personalizados usando un complemento
Lo primero que debe hacer es instalar y activar el complemento CPT Custom Icon . 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 iconos 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 el complemento de IU de tipo de publicación personalizada para crear y administrar taxonomías y tipos de publicación personalizados .
Agregar un ícono a un tipo de publicación personalizada creado 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 seleccionar el icono 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. Necesita 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 enlace Opciones avanzadas y desplazarse hacia abajo hasta la sección Icono de 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 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 icono 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, 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 personalizada como este:
1 | 'menu_icon' => 'dashicons-cart', |
También puede agregar la URL completa de un archivo de imagen que desea mostrar como icono, como este:
1 | '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 llamado productos con un ícono de menú:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 dieciséis 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | // Register Custom Post Typefunction 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' actionadd_action( 'init', 'custom_post_type', 0 ); |
Esperamos que este artículo te haya ayudado a agregar iconos 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 .
Disqus comments