homefinance blog
Con la versión 3.8, WordPress introdujo Pashicons, el conjunto de fuentes para los iconos del administrador de WP. Estos íconos son archivos SVG de alta calidad, lo que significa que se escalarán en cualquier tamaño sin ninguna pixización. Aunque estos íconos se han agregado para los elementos en el menú del tablero, nada le impide usarlos en otro lugar. Por lo tanto, puede usarlos para complementos personalizados, temas, paneles de administración y diseño frontal. Para comenzar a usar WordPress Pashicons, debe hacer dos cosas. Primero, active los phellicons para el tema que está utilizando. Luego vaya a wordpress.org y busque el código HTML o CSS para el icono que tiene la intención de usar. Sí, tan simple. Así que superemos cómo hacer esto más detallado.
Activando los dashicones en el front-end de WP antes de comenzar a usar Pashicons, deberá activarlos para el tema que está utilizando. Esto se hace agregando un pequeño fragmento de código a las funciones.php. Para hacer esto, siga estos pasos:
Primero, en la Junta de Administración de WordPress, vaya al editor de apariencia/tema.
Luego abra las funciones del archivo.php.
Luego desplácese hasta el final de las funciones.php y agregue este código:
add_action (‘wp_enqueue_scripts’, function () {wp_enqueue_style (‘pashicons’);});
Le recomendamos que cree un tema infantil antes de editar funciones.php. Si edita el archivo con el tema directo y más tarde hay una actualización del tema, entonces la actualización reemplazará los cambios que realizó en Functions.php. Por esta razón, siempre es mejor tener un tema infantil.
Cómo obtener el código HTML y CSS DashPress.org ofrece una biblioteca de Dashons donde puede encontrar el código HTML y CSS para cada icono. Una vez que esté en WordPress.org, busque recursos de desarrolladores: Dashicons o haga clic en este enlace. Luego siga estos pasos: primero, haga clic en cualquier icono que desee.
Luego haga clic en HTML Copy o CSS Copy, dependiendo de lo que necesite.
Aparecerá una ventana emergente. Copie este código en el portapapeles presionando CTRL + C.
Con Pashicons activados y el código copiado en el portapapeles, todo lo que tiene que decidir es usar iconos de Dashicons en el tablero WP. Por ejemplo, puede usarlos para publicar meta cosas como fecha, categoría, etiqueta o autor. También puede navegar por el menú o los tipos de publicaciones personalizadas en el Backynd.
Muestre Dashicon directamente en publicaciones y páginas Si desea agregar iconos a la publicación o la página, esto es fácil. Para hacer esto, solo tiene que agregar este código al editor de texto:
titular alegre
o, alternativamente, puede usar este código:
Titular alegre
Entonces, una vez que guardó la publicación y recarga la página, debería ver el icono de la sonrisa.
Cómo usar WP Pashicons para el menú de navegación El ejemplo más útil de WordPress Pashicons es para el menú de navegación. Para agregar iconos a los menús, siga estos pasos:
Primero, en el tablero de WordPress, vaya a mirar/menús.
Luego agregue el código HTML del icono del menú que recibió de WordPress.org a la etiqueta de navegación. Después de ver, agregar un icono a un menú de navegación también es simple. Si tiene que mostrar texto junto al icono, simplemente agregue texto al final del campo de etiqueta de navegación.
Si todo funcionó correctamente, verá el icono que se muestra en el menú de navegación de su página de inicio.
Usando Pashicons en el backend si desea usar diferentes iconos para publicaciones, publicaciones o widgets personalizados, esto es aún más fácil. No necesita cambiar las funciones del archivo.php, ya que está en WordPress Backynd. Entonces puedes omitir el primer paso que tomé. Para crear un tipo personalizado de publicación con un icono personalizado, siga estos pasos:
Vaya a WordPress Dashboard Apariencia/Editor de temas.
Luego abra las funciones del archivo.php.
Luego, para registrar su tipo de publicación personalizado, agregue este código al final del archivo:
Función create_posttype () {registro_post_type (‘películas’, array (‘labels’ => array (‘name’ => __ (‘películas’), ‘singular_name’ => __ (‘película’), ‘public’ => true , ‘Menu_icon’ => dashicons-format-video ‘,’ has_archive ‘=> true,’ rewrite ‘=> array (‘ slug ‘=>’ películas ‘),
)); } add_action (‘init’, ‘create_postType’); Cuando cree sus propios tipos de publicaciones, querrá cambiar el código para cada tipo de publicación. Entonces, por ejemplo, para cambiar los iconos del tipo de publicación, debe cambiar parte del “Menu_icon” Code => “Pashicons-Format-Video”. Si no desea meterse con el código, puede usar la interfaz de usuario de tipo post del complemento. Sin embargo, tenga en cuenta que si deshabilita el complemento, no tendrá acceso al tipo de publicación personalizada que ha realizado con ese complemento. ¿Cómo es un código corto para facilitar los dashicones para sus clientes? Pashicones. Para hacer esto, simplemente agregue este código al archivo funct.php:
add_shortcode (‘dashicon’, function ($ atts) {$ atts = shortcode_atts (array (‘icon’ => ‘menú’,), $ atts, ‘bartag’); if (! vacía ($ atts [‘icon’]] )) {return ‘ ;}}; Luego, puede usar un código corto como este: [Dashicon icon = “Formato de video”] Conclusión Si necesita algunos iconos para un sitio web de WordPress, los Pashicons son una buena opción. O tal vez desarrolle Backend WordPress, de ser así, puede mantener el tablero de WordPress consistente usando el mismo conjunto de iconos de fuentes que WordPress.
Si está satisfecho con los dashicons, pero le falta un icono, puede solicitar el icono. El proceso de solicitar el icono se realiza en github.com/wordpress/dashicons. Además, si desea agregar su icono a la biblioteca de Pashicons, esto también es posible a través de la página GitHub. El conjunto de íconos de Pashicons es algo limitado y hay fuentes de iconos más grandes. Entonces, si necesita un conjunto más grande de íconos, recomendamos Font Awesome. Ofrecen una gran selección de íconos gratuitos y, si necesita aún más íconos, ofrecen más si actualiza a la versión Pro. Para obtener más tutoriales de WordPress, consulte el resto de nuestro blog aquí. Si tiene más preguntas, escríbalas en la sección de comentarios a continuación. ¡Un buen día! Más recursos:
Cómo remediar el error “Lo siento, no se le permite acceder a esta página” en WordPress
Cómo activar las tarjetas de Twitter en un sitio de WordPress
Cómo remediar el error 521 con WordPress y CloudFlare
