WP SVG Icons - KolMitE

WP SVG Icons

WP SVG Icons

diciembre 5, 2018 Populares 0


Descripción

Caracteristicas

  • Más de 490 iconos incluidos.
  • Cree y cargue sus propios iconos personalizados utilizando el importador de iconos personalizados.
  • Descargue e importe su propia construcción de iconos personalizados desde IcoMoon
  • Insertar iconos directamente en publicaciones / páginas / barras laterales
  • No es necesario escribir una sola línea de código
  • Activamente en desarrollo

Nuevo en v3.0: Soporte de Shortcode

¡Utilice el código abreviado recientemente implementado para evitar que los íconos se eliminen entre las pestañas visuales y html del editor!

(totalmente compatible con versiones anteriores!)

Demostración del plugin básico

¡Considera Going Pro para características adicionales!

Pro Características

  • Personalizador de iconos para ajustar el tamaño, el color, el enlace y más de los iconos sobre la marcha sin escribir ningún código.
  • Número ilimitado de iconos personalizados permitidos!
  • Agregue iconos a los elementos del menú directamente desde la pantalla de edición del menú
  • Animar sus iconos utilizando animaciones CSS3 suaves
  • Genere fácilmente un contenedor de iconos para usar en sus páginas de destino (con efectos de desplazamiento)
  • Soporte premium para cualquier problema que pueda encontrar, o las veces que le gustaría lograr algo más personalizado
  • Construido en soporte de widget para todos iconos
  • No es necesario escribir código o ajustar los parámetros de shortcode manualmente en la versión pro
  • Continuamente iterado en y bajo desarrollo.

¡Consigue la versión premium ahora!

Página de demostración

Echa un vistazo a la página de demostración del complemento

Originalmente creé este plugin para mi uso personal en proyectos de clientes. Después de presenciar el poder de este complemento de primera mano, quise devolverle algo a la comunidad que me ha ayudado a través de los años. El ‘WordPress SVG Icon Set’ es extremadamente fácil de usar para cualquiera. Dos clics del mouse y tiene un ícono listo para ser colocado en su sitio. Estos iconos son un conjunto de fuentes web y son extremadamente escalables. Lo que significa que no se degradarán en calidad cuanto más grandes sean. Otra gran característica de este complemento es la posibilidad de utilizar los mismos iconos en todos los dispositivos. No es necesario generar imágenes específicas de Retina para dispositivos móviles. Al establecer un ancho máximo en el icono, se vuelve sensible. Este complemento también es ideal para los desarrolladores que usan íconos en varios sitios y desean evitar la molestia de reinstalar.
Fuentes web en un nuevo servidor cada vez. Con este complemento, solo tiene que hacer un clic y estará listo para comenzar a trabajar. Puede utilizar estos en cualquier lugar en sus temas.

Gracias especiales va a:

  • IcoMoon para una increíble base de iconos gratuitos para usar, muchos en este complemento.

  • Alessio Atzeni por la inclusión de unos pocos íconos “Metoicons” en este complemento.

  • PJ Onori por la inclusión de algunos iconos íconos en este complemento.

y por supuesto

  • Matt Mullenweg por todo lo que hace por la comunidad de WordPress. Sin él nada de esto sería posible.

Desarrollar complementos es un trabajo largo y tedioso. Si se beneficia o disfruta de este complemento, tómese el tiempo para calificarlo y revisarlo, ya que esto solo hará que las futuras versiones sean mejores.

Instrucciones de uso

Tienes dos posibilidades para utilizar el complemento. Dirígete a la página principal “Conjunto de iconos predeterminado” para generar un código corto para tu icono, o haz clic en el botón “Agregar icono” del editor de publicaciones o páginas.

El código abreviado del icono tendrá el siguiente aspecto:

[wp-svg-icons icon="pencil-2" wrap="span"]

Los iconos personalizados utilizan el parámetro 'custom_icon' en lugar de 'ícono'.

También es extremadamente sencillo cambiar el tamaño del icono. Puede cambiar el elemento en el que se encuentra el icono (h1, h2, h3, etc.) o puede utilizar el parámetro de código abreviado “tamaño”.

Ejemplo:

[wp-svg-icons icon="menu-2" wrap="i" size="3em"]

El código de acceso anterior establecerá el tamaño del icono en 3em. También puede especificar ‘px’, ‘%’ o ‘rem’ como tamaño de fuente.

Además, también puede cambiar fácilmente el color del icono, usando el parámetro “color”.

Ejemplo:

[wp-svg-icons icon="menu-2" wrap="i" color="#2ECC4B"]

También puedes usar valores hexadecimales, rgb o rgba.

Ejemplo:
[wp-svg-icons icon=”menu-2″ wrap=”i” color=”rgba(45, 223, 78, 0.28)”]

Los dos códigos cortos de ejemplo anteriores establecerían el color del icono en verde claro.

Además, puede agregar clases personalizadas a su icono mediante el uso del parámetro de código de acceso de clase.

Ejemplo:
[wp-svg-icons icon=”menu-2″ wrap=”i” class=”custom-icon icon-class testing-custom-icon-class”]

El HTML resultante se vería así:

Agregar clases personalizadas a su ícono le permite apuntar más fácilmente íconos singulares a través de CSS. Esto es útil para agregar desvanecimientos flotantes o animaciones CSS simples a un icono.

Todos los parámetros de shortcode:

  • icono: el nombre del icono que desea que genere este shortcode
  • Ajustar: establezca el elemento en el que se alojará su icono (div, span, h1, h2, etc.)
  • clase: asigne clases adicionales a su icono. Impresionante para apuntar tus iconos más fácilmente.
  • tamaño: modifica el tamaño del ícono independientemente del contenedor (px, em, rem,%)
  • icono: asigna un icono predeterminado
  • custom_icon – asigna un icono personalizado
  • enlace: vincule el icono a una página o publicación
  • new_tab – abre el enlace en una nueva pestaña
  • color: modifica el color del icono (hexadecimal, rgb, rgba)

Icomoon Icon Font Importer

Nota: El número de iconos personalizados permitidos en la versión gratuita está limitado a 10 iconos. Si necesita más de 10 iconos personalizados en su sitio, actualice a la versión pro para permitir que se utilice un número no restringido de iconos en su sitio.

Hemos escuchado sus solicitudes de funciones y, después de muchas horas de retraso en el desarrollo del teclado, nos complace anunciar nuestra nueva incorporación a WP SVG Icons.

Ahora, ya no está limitado a los íconos que vienen pre-empaquetados con el complemento. Cree un número ilimitado de combinaciones de iconos personalizados y comience a usarlas en su sitio en cuestión de minutos.

Echa un vistazo a la página de demostración para ver ejemplos de íconos, el área de juegos de íconos y ejemplos de código antes de descargar.

Capturas de pantalla

  • Generador de códigos cortos predeterminado de Icon Pack
  • Toda la colección de paquetes de iconos por defecto. Todos disponibles en la instalación inicial.
  • Importador de paquete de fuentes icomoon personalizado.
  • Nuevo: genere su código abreviado e ingrese íconos en una publicación o página directamente desde la pantalla de edición
  • Agregue íconos a los elementos del menú sin tener que escribir código, solo versión Pro –
  • Personalice su ícono antes de agregarlo a una página o publicación (solo versión Pro)

Instalación

Instalación

  1. Subir wordpress-svg-icons-plugin.zip al / wp-content / plugins / directorio
  2. Active el complemento a través del menú “Complementos” en WordPress
  3. Vaya a la página del complemento ‘WP SVG Icon’ en el panel de control
  4. Haga clic en el icono que desea utilizar.
  5. Una vista previa del icono aparecerá en el cuadro de vista previa en la parte superior. Puede copiar el código abreviado generado o hacer clic en “Insertar icono” (si está en las pantallas de publicación o edición de página)
  6. Tenga en cuenta que también puede usar el código abreviado en los widgets o en cualquier otro lugar de su sitio. Si el código abreviado no es adecuado para sus necesidades, considere usar el HTML generado.

Instalación de paquete personalizado

  1. Visite IcoMoon y comience a seleccionar los íconos que desea usar.
  2. Importar iconos icomoon de la biblioteca
  3. Selecciona los iconos que deseas incluir en tu paquete.
  4. Haga clic en ‘Fuente’ en la parte inferior de la ventana del navegador
  5. Haga clic en ‘Preferencias’ e ingrese un nombre de fuente y un prefijo personalizado (debe terminar en – para mejores resultados)
  6. Haga clic en “Descargar”
  7. ¡Importe el .zip a la derecha en el complemento y comience a usar sus fuentes! No requiere codificación!

Preguntas más frecuentes

Instrucciones de instalación

Instalación

  1. Subir wordpress-svg-icons-plugin.zip al / wp-content / plugins / directorio
  2. Active el complemento a través del menú “Complementos” en WordPress
  3. Vaya a la página del complemento ‘WP SVG Icon’ en el panel de control
  4. Haga clic en el icono que desea utilizar.
  5. Una vista previa del icono aparecerá en el cuadro de vista previa en la parte superior. Puede copiar el código abreviado generado o hacer clic en “Insertar icono” (si está en las pantallas de publicación o edición de página)
  6. Tenga en cuenta que también puede usar el código abreviado en los widgets o en cualquier otro lugar de su sitio. Si el código abreviado no es adecuado para sus necesidades, considere usar el HTML generado.

Instalación de paquete personalizado

  1. Visite IcoMoon y comience a seleccionar los íconos que desea usar.
  2. Importar iconos icomoon de la biblioteca
  3. Selecciona los iconos que deseas incluir en tu paquete.
  4. Haga clic en ‘Fuente’ en la parte inferior de la ventana del navegador
  5. Haga clic en ‘Preferencias’ e ingrese un nombre de fuente y un prefijo personalizado (debe terminar en – para mejores resultados)
  6. Haga clic en “Descargar”
  7. ¡Importe el .zip a la derecha en el complemento y comience a usar sus fuentes! No requiere codificación!
¡Necesito algo de ayuda! ¿Cuál es la mejor manera de conseguir apoyo?

Considere comprar la versión premium del complemento si necesita asistencia. La idea detrás de la versión gratuita era devolver algo a la comunidad. La repetición constante y el soporte de un complemento gratuito consumen mucho tiempo y no son sostenibles.

Con la versión premium se le garantiza un nivel de soporte que de otro modo no obtendría. Recibirá un soporte de primera clase de un desarrollador de WordPress profesional y de tiempo completo.

Si no está interesado en comprar la versión premium, regístrese para recibir asistencia en mi sitio. Una vez registrado, publique en el foro respectivo y le responderé cuando el tiempo lo permita. Los titulares de la versión Pro tienen prioridad de acceso al soporte.

¿Estos iconos perderán calidad a medida que se amplíen?

No. Estos iconos no tienen el formato .png o .jpg. Son .svg (gráficos vectoriales escalables), lo que significa que puede escalarlos tan grande como desee sin ninguna pérdida de calidad. (En realidad …. ¡Tan grande como quieras!)

¿Puedes cambiar el color de los iconos?

Sí, agregando el parámetro “color” al shortcode, y luego especificando un código de color hexadecimal, rgb o rgba.
Por ejemplo :
[wp-svg-icons icon=”menu-2″ wrap=”i” color=”#B4DA55″]

¿Qué hay de diferente entre la versión gratuita y la versión pro?

La versión Pro viene con un personalizador de iconos bastante dulce. ¡Esto no solo le permite ajustar el tamaño, el color y el atributo de enlace, sino que también le permite personalizar fácilmente su icono sin tener que recordar ninguno de los parámetros de shortcode o escribir una sola línea de código!

La versión Pro también viene con navegadores personalizados implementados, para agregar fácilmente íconos a cualquiera de los elementos de su menú. Esta es una pequeña característica que le permite seleccionar un icono de un menú desplegable para asignarlo a su menú directamente desde la pantalla de edición de menú.

Si compra la versión Pro, también recibirá soporte y actualizaciones durante un año, para aquellos momentos en que necesite hacer que algo fuera de lo normal suceda.

Pro Características

  • Personalizador de iconos para ajustar el tamaño, el color, el enlace y más de los iconos sobre la marcha sin escribir ningún código.
  • Agregue iconos a los elementos del menú directamente desde la pantalla de edición del menú
  • Animar sus iconos utilizando animaciones CSS3 suaves
  • Genere fácilmente un contenedor de iconos para usar en sus páginas de destino (con efectos de desplazamiento)
  • Soporte premium para cualquier problema que pueda encontrar, o las veces que le gustaría lograr algo más personalizado
  • Construido en soporte de widget para todos iconos
  • No es necesario escribir código o ajustar los parámetros de shortcode manualmente en la versión pro
  • Continuamente iterado en y bajo desarrollo.

¡Consigue la versión premium ahora!

Opiniones

Usando la versión gratuita – sin problemas

SandyMe

He estado usando este plugin durante varios años en un sitio sin ningún problema.

Útil en general pero destruye mi tema.

sigue tus pies

Estoy usando el tema Divi y debido a este CSS:

.dashicons-wp-svg-gift: antes, [data-icon]:antes de{
  font-family: wp-svg-plugin-icon-set1! important; * /
}

Todos los íconos del módulo Divi Theme Builder se destruyen porque tienen un atributo de ícono de datos y usan una fuente etbuilder. Esperemos que los desarrolladores solucionen esto (debería ser lo suficientemente simple como para incluir una excepción para entonces el atributo del icono de datos se usa en un módulo en la ventana emergente del constructor) pero por ahora este complemento no me sirve. 🙁

Una vez arreglado, estoy feliz de dar 5 estrellas

¡Evitar!

Angelina norte

La versión gratuita es ridícula. Publicidad engañosa.
La versión gratuita es ridícula. Aguas! Publicidad engañosa.

Maravilloso. No dudes en utilizar este plugin.

simon3163

Confío en esto fuertemente en mi sitio web iphoneflick.com

Si se toma el tiempo para entender cómo funciona, obtendrá resultados fantásticos, no solo con los íconos prefabricados, sino también con cualquier ícono personalizado que pueda crear usted mismo.

Una vez configurado. Un pequeño fragmento de shortcode agregado en cualquier lugar de su sitio y aparece su ícono.

Lo que también es brillante es el apoyo del desarrollador. Todas las preguntas que he tenido respondieron rápidamente y ofrecen una amplia ayuda para obtener los resultados que está buscando.

5 estrellas sin duda. Son plugins como estos los que hacen que la web funcione. Y son dispositivos como estos los que nos ayudan a desarrollar sitios web que amplían los límites de Internet.

No dudes en descargar el plugin.

Simon

Increíble


Realmente enamorado de este. Por lo general lo uso para agregar iconos en los menús. Esto hace que el menú de mi sitio web sea más profesional.

Ridícula a versão gratuita

Luigi-Bru

Nem percam tempo instalando a versão gratuita, não ser que você tenha um projeto de site tão minimalista, que precisará de no máximo, 10 ícones.
Não recomendo!

Leer los 178 comentarios

Colaboradores y Desarrolladores

“WP SVG Icons” es un software de código abierto. Las siguientes personas han contribuido a este plugin.

Contribuyentes

Traduzca “WP SVG Icons” a su idioma.

¿Interesado en el desarrollo?

Busque el código, revise el repositorio SVN o suscríbase al registro de desarrollo por RSS.

Registro de cambios

3.2.0 – 13 de enero de 2017

  • Secciones remodeladas del plugin.
  • Refactored archivo .js.
  • Cambia el estilo de los iconos personalizados modales (para que coincida mejor con los estilos de iconos predeterminados)
  • Se borraron algunas advertencias en la página de carga del paquete personalizado.
  • Preparando para re-escribir.

3.1.8.4 – 10 de marzo de 2015

  • Se solucionó el problema con los iconos que no se pueden seleccionar.
  • Se ajustó la verificación de límite para los iconos personalizados.

3.1.8.3 – 17 de septiembre de 2015

  • Ajustes a la última actualización: se eliminó el mensaje de error “Buen intento …”

3.1.8.2 – 14 de septiembre de 2015

  • Actualizaciones de seguridad importantes

3.1.8.1 – 21 de julio de 2015

  • Actualizar enlace al sitio pro / upgrade

3.1.8 – 5 de mayo de 2015

  • Ocultar el ícono de 10 iconos para los usuarios que no usan 10 o más íconos
  • Actualización probada a 4.2.1
  • Reparar problema de carga del paquete de iconos personalizado
  • Añadir la comprobación de errores multi-sitio

3.1.7 – 23 de abril de 2015

  • Asegurar la compatibilidad con WordPress v4.2

3.1.6 – 9 de abril de 2015

  • La versión gratuita ahora está limitada a 10 iconos personalizados. La versión Pro permite un número ilimitado de iconos. (Cualquier sitio que use más de 10 iconos antes de esta actualización continuará funcionando)

3.1.5 – 26 de marzo de 2015

  • Solucionado el problema de CSS menor. Algunos temas anularon el atributo de familia de fuentes en nuestros iconos, por lo que hemos agregado una etiqueta importante a nuestros estilos.

3.1.4 – 21 de marzo de 2015

  • Se solucionó un problema menor en el que el despido causaba errores https para algunos usuarios.
  • Se actualizó la URL de Go Pro al nuevo sitio.
  • Sección de actualización actualizada con nuevas pestañas, información y enlaces

3.1.3 – 13 de marzo de 2015

  • Se solucionó el problema por el que los iconos personalizados no se representaban correctamente debido a clases incorrectas

3.1.2 – 12 de marzo de 2015

  • Se corrigieron las llamadas incorrectas a delete_option en la desinstalación del complemento.

3.1.1 – 5 de marzo de 2015

  • Se corrigió el error por el cual al hacer clic en el ícono personalizado no se cargaba en el contenedor de vista previa
  • Se agregó una nueva configuración para eliminar el paquete de iconos personalizados en la desinstalación del complemento
  • Reescribió la función de desinstalación para eliminar todas las opciones creadas por el complemento.
  • Se agregó 2 semanas de actualización / notificación de revisión
  • Mejoras de estilo menores y correcciones de errores

3.1 – 3 de marzo de 2015

  • Corregir estilos de enlace anulando los valores por defecto de WordPress
  • Se minimizaron los estilos de iconos predeterminados, se agregaron clases de elementos apropiadas y se pusieron en cola en el tablero

3.0 – 27 de febrero de 2015

  • Reescribió todo el plugin desde cero.
  • Soporte de código abreviado integrado que, en última instancia, evita que el código se elimine al alternar entre las pestañas html / visual
  • Se agregaron todos los nuevos parámetros de shortcode para que la modificación de los iconos sea mucho más fácil
  • Comenzó a finalizar la versión pro con un personalizador de iconos, un selector de iconos en la pantalla de menú y más.
  • Comenzó a actualizar el ejemplo / página de demostración.

2.3.3 – 13 de noviembre de 2014

  • Se agregaron algunas comprobaciones de error para intentos de carga fallidos

2.3.2

  • Resuelto dos advertencias de PHP

2.3.1

  • Se resolvió el error “Advertencia: No se puede modificar la información del encabezado”.

2.3

  • Se corrigieron algunas estructuras de URL para permitir el uso del complemento en localhost
  • Actualizando algunas funciones básicas
  • Añadidos nuevos estilos a los iconos del tablero
  • Se corrigió la fecha de codificación en el reemplazo de la subcadena del directorio de carga, que causó problemas al intentar cargar o eliminar paquetes de íconos después de enero de 2014 – publicado el 2 de febrero de 2014

2.2.1

  • Eliminar el tamaño de icono predeterminado que anulaba el tamaño de icono de los usuarios

2.2

  • Elimine el parámetro $ hook que estaba cargando condicionalmente los estilos en el extremo de administración; impidió que los usuarios usaran iconos en el tablero

2.0

  • Se ha agregado el importador de paquetes de iconos de Icomoon
  • Se corrigieron los estilos / scripts de las páginas del panel de control que se ponen en cola
  • Estilos ajustados para mantener la consistencia – 15 de enero de 2014

1.3.2

  • Se agregaron clases predefinidas para un estilo de iconos fácil – 29 de octubre de 2013
  • Compruebe la página de demostración para más información.

1.3.1

  • Se corrigió la inconsistencia con el nuevo icono Vinculado redondeado – 23 de octubre de 2013

1.3

  • Añadida una nueva sección de expansión.
  • Se agregó 1 nuevo icono redondeado Vinculado – 19 de octubre de 2013

1.2

  • Ícono de contenedor de icono reemplazado de un
    a un – Corrige saltos de línea al insertar íconos en el contenido – 20 de septiembre de 2013

1.1

  • Facilitó la selección de iconos haciendo que todo el div se pueda seleccionar.
  • Añadido icono resaltado después de la selección
  • Se ha añadido un desplazamiento suave hacia arriba
  • Guiones colocados en archivo externo – 2 de agosto de 2013

1.0

  • Lanzamiento original – 20 de julio de 2013

Por favor Comparte y Síguenos:
RSS
Follow by Email
Facebook
Twitter

Deja una respuesta