Detalles del Proyecto

URL del proyecto:

SNA

Suscribase

CódigoPortfolio: Social Networks Admin

PLUGINS DE GESTIÓN DE REDES SOCIALES

SNA. es un pequeño pero poderoso plugins que permite gestionar de manera sencilla y practica todas nuestras redes sociales.

Este cuenta con 3 Modalidades o SubPlugins para los 3 usos mas populares de las redes sociales.

Las modalidades son:

SNA logo S N A

Sígueme (SNA_followme)

Como ya mencionamos gracias e este modulo podemos agregar nuestras redes sociales, por defecto trae 22 pero podemos agregar mas si lo deseamos.

Las Redes sociales por defecto son:

Lista de Redes Sociales

Uso

Su uso es muy sencillo, veamos un ejemplo:

<div data-role="snafollowme" 
    data-inline="true"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>
Ejemplo de uso 1

Como podemos observar una linea de código y listo, es esta linea le establecemos el parámetro inline para que lo muestre en unas sola linea y el parámetro links es donde agregamos todas nuestros perfiles.

Para agregar nuevos linsk distintos SNA pone a nuestra disposición un método llamado SNA.newlinks.

Iconos

Por defecto SNA cuenta con 3 Temas de iconos, el tema FontICons (establecido por defecto), image-circle e image-square, ademas de estos 3 themas podemos agregar otros si deseamos usando el parámetro data-themen.

Tamaños
<div data-role="snafollowme" 
    data-inline="true" 
     data-themen="default"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>
<div data-role="snafollowme" 
    data-inline="true"
     data-themen="image-circle"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>
<div data-role="snafollowme" 
    data-inline="true"
     data-themen="image-square"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>

En caso de que deseemos colocar iconos distintos o imágenes debemos colocar para los iconos solo debemos poner la clase del icono y/o el prefijo por ejemplo en caso de que deseemos usar Font Awesome seria así data-themen="fa fa-" donde fa es la clase del icono y fa- es el prefijo.

Iconos SNA
<div data-role="snafollowme" 
    data-inline="true" 
    data-cls-link="m-0 p-0"
    data-themen="mif-"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>
<div data-role="snafollowme" 
    data-inline="true" 
    data-themen="image"
    data-image='{"facebook":"facebook.png"... }'
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>

Texto

Podemos agregar texto a nuestro botones, con el parámetro data-text, podemos agregar un texto general o un texto para cada Red Social, a demás podemos simplemente establecerlo a True, y el sistema asignara el texto basado en la configuración del idioma.

<div data-role="snafollowme" 
    data-inline="true" 
    data-only="duo"
    data-text="Sigueme"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>
<div data-role="snafollowme" 
    data-inline="true" 
    data-only="duo"
    data-text='{"facebook":"Sigueme","twitter":"Tweet","instagram":"Mirame"}' 
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>

Idioma

SNA ofrece por defecto 2 idiomas es-VE y en-US, pero también nos ofrece una función que nos permite agregar la cantidad de idiomas que deseemos. para establecer un idioma se usa el atributo data-locale.

<div data-role="snafollowme" 
    data-inline="true" 
    data-only="duo"
    data-text="true" data-locale="es-VE"
    data-links='{"facebook":"name_Perfil",...."mailto":"tucorreo@gmail.com"}'>
</div>

Para ver la documentación completa viste SNA

Leave A Comment