Banner Top 2

Banner Top 1

KaZeta - Elementos filtrados por fecha: Abril 2014

La forma más fácil de crear íconos sociales independientes de múltiple resolución

Google+

La elección de los iconos sociales adecuados para su sitio web es más importante de lo que usted puede creer; estos pocos iconos simples, aparentemente inocuos sirven como puerta de entrada a un mundo más amplio a través del cual su sitio potencialmente puede llegar a millones de personas. Lo aman o lo detestan, los medios sociales son un componente crítico de su presencia en línea, ya sea que usted ea un escritor solitario o mantenga un blog en representación de una empresa internacional. Su imagen de marca, la identidad en línea e incluso el SEO pueden ser afectados por estos, por lo que tendrá que asegurarse de que sus iconos sean elegantes, limpios y lo más importante, claros.

En la mayoría de las plantillas verás que hay una zona dedicada a los iconos sociales y similares; generalmente se centran en los portales sociales más populares como Facebook , Twitter y Google+. Sin embargo, aunque esto puede funcionar bien para muchos sitios, diferentes países tienen sus propias redes sociales y popularidades distintas y necesitará íconos totalmente diferentes. Afortunadamente, hay una manera muy fácil de extender esta funcionalidad para incluir iconos adicionales.

Perfect Iconos es una pequeña pero muy útil herramienta en línea, que le permite generar código HTML para una amplia gama de iconos y definir los vínculos que desea para cada icono con sólo algunos clics. ¿Suena bien? ¡Por supuesto que sí! Lo que es más, se puede personalizar el diseño de los iconos con parámetros adicionales, como el tamaño, el espaciado, el radio o el color, y escoger si desea agregar un efecto hover entre 4 opciones diferentes.

Una de las mayores ventajas de Perfect Icons es la increíble variedad de iconos disponibles - se puede generar hasta 56 iconos relacionadas con los medios sociales y unos cuantos más para elementos de uso general como el correo electrónico o RSS. La lista de iconos contiene casi todos sitio web populares que tiene un perfil público que vale la pena compartir, como Facebook, Twitter, Google+, Pinterest, Foursquare, Skype, Spotify, YouTube, Instagram, WordPress, Blogger, Tumblr, Joomla, regate, GitHub y muchos muchos más. Es posible especificar el mismo color para todos los iconos o simplemente mantener el fondo original predeterminada para el icono; lo que es perfecto si tiene un estilo de color en su sitio que no desea interrumpir. Con el parámetro de radio tambien puede generar íconos redondos o cuadrados para combinar con el diseño de su sitio.

¿Cómo agregar los iconos generados a su sitio web Joomla?

  • El primer paso es visitar la página web de Perfect Icons y elegir entre su amplia gama de iconos interesantes. Especifique sus URL's, colores, efectos hover y otros elementos. Una vez hecho esto, usted debe tener algo como esto:

    Una vez creados los parámetros en Pefect Icons

  • Entonces tendremos que descargar la fuente preparada especialmente, la que incluirá nuestros iconos; simplemente haga clic en el botón thesocicon.zip en la columna de la derecha. Después de finalizada la descarga descomprima el paquete y copie todos los archivos como por ejemplo socion.eot, socicon.svg, etc., dentro del directorio de font en la instalación de la plantilla (a través de FTP o el administrador de archivos del servidor). En el caso de una plantilla Gavick lo más probable es que la ruta correcta por lo general será
    root/templates/gk_template_name/fonts
    Fonts de Perfect Icons
  • Ahora, es el momento para copiar parte del código (por fin!) el que podemos encontrar bajo el botón de descarga. Este código CSS se debe incluir en el archivo css (en el caso de una plantilla Gavick, debe copiar el código CSS en el archivo override.css que se puede encontrar en el directorio raíz /templates/gk_templatename/css/ y después de haber hecho esto, asegúrese de habilitar la opción del uso de override.css en sus plantillas en la pestaña Configuración Avanzada mediante el gestor de plantillas). IMPORTANTE: En el código copiado reemplace todas las instancias de
    PATH_TO
    a
    ../fonts
    ya que es donde subimos nuestras fuentes.

    intervención en override.css

  • Después de estos 3 pasos nuestra fuente está lista para usar y todo lo que tenemos que hacer es publicar nuestros iconos en algún lugar para ver cómo se ven. Preferimos utilizar el módulo HTML personalizado de Joomla para esto; copia el código de la etapa 3 de la guía desde el sitio web Perfect Icons hacia el editor de contenidos. Eso es todo!

    Recuerda que si no puede ver el contenido del módulo HTML personalizado después de salvar lo más probable es que se deba a la limpieza de HTML de su editor. Para solucionarlo se debe deshabilitar el filtrado de editor.

Leer más ...
Suscribirse a este canal RSS