Redes sociales: opción de compartir nuestra página con

El colectivo Aldezharra de Pamplona ha lanzado recientemente su página web desarrollada en Joomla: http://www.aldezaharra.org. Podéis observar que debajo de cada artículo se muestran iconos de las redes sociales más conocidas (Facebook, Twitter, Tuenti, Google+, LinkedIn...), ofreciendo la posibilidad de compartir el contenido en los perfiles personales de los usuarios.

La extensión que da esta funcionalidad es el plugin ValAddThis, cuya ficha en el portal de extensiones la podéis encontrar pulsando aquí. Se trataría de la opción más extendida de las ¡más de 100! que hay publicadas en la sección Social Bookmarking.

Descarga del fichero del plugin:

Desde Download en la ficha accedemos a la página del desarrollador, pulsamos en plg_content_valaddthis-roundedCSS.zip, y nuevamente Download, para obtener el fichero comprimido y compatible con Joomla 1.7: plg_content_valaddthis_1.5.4-roundedCSS.

Instalación:

Lo instalamos como siempre: Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar.

Al tratarse de un plugin siempre tenemos que confirmar si está activado o no: Extensiones -> Gestor de Plugins -> y pulsamos el iconito rojo de la columna Activado para transformarlo en el verde, indicador de su activación.

Visualización:

Activar el plugin, tal y como lo hemos hecho, es suficiente para que todos nuestros artículos muestren los iconos de redes sociales con la funcionalidad de compartir en las mismas. Comprobadlo en la parte pública.

El plugin ofrece multitud de opciones de configuración que podéis probar entrando al mismo desde el Gestor de Plugins. Veréis a la derecha dos grupos de parámetros:

• Opciones básicas
• Opciones avanzadas

Una agenda con Google Calendar

En clase os he presentado y recomendado la herramienta Calendar de Google. Dejo de vuestra cuenta probar todas las opciones que permite. En esta entrada os voy a comentar simplemente cómo podemos incrustarlo en nuestra página.

Desde la página de Configuración de vuestro calendario (se pueden crear ilimitados) , en la opción Incrustar este calendario, pulsáis Personaliza el color, el tamaño y otras opciones. Desde aquí podemos configurar el aspecto y tamaño de cómo queremos que se vea en nuestra página. Cuando ya lo tenemos a nuestro gusto, copiamos el código que aparece que la parte superior y lo pegamos en nuestro artículo de Joomla. Et voilà!!

Agenda de eventos: JEvents

Una agenda de eventos es una función muy común en muchos portales web. En ocasiones se abusa de su uso, si no se dinamiza con mucha frecuencia. No tiene mucho sentido utilizarla para publicar unos pocos eventos anuales, para lo que sería suficiente mostrar artículos ordenados cronológicamente utilizando un elemento de menú del tipo Categoría Blog. Esto es lo que transmite la agenda instalada en la página web de Segunda Familia que estamos teniendo de referencia. El usuario encontrará útil su uso si encuentra información cada semana, por ejemplo.

La oferta de extensiones para instalar agendas en Joomla es bastante grande. Una de las más utilizadas, no comercial y compatible con Joomla 1.7 es JEvents.

Instalación:

Pulsando Download debemos descargar en Main component y Mini-Calendar Module, los cuales instalaremos como siempre desde el Gestor de extensiones. En el caso del componente, surgen dos pantallas intermedias con los siguientes mensajes:

• Database now setup donde debemos pulsar Continue
• y Please check configuration and save in order to use JEvents donde pulsaremos Guardar & Cerrar en la parte superior derecha

La agenda JEvents es una extensión del tipo componente, por lo que se gestiona desde Componentes -> JEvents. Cada evento se crea desde Manage Events -> Nuevo donde podemos definir un título, descripción, hora de inicio y finalización, periodicidad, ubicación, etc.

Es posible organizar estos eventos por categorías las cuales de gestionan desde Manage Categories. Podríamos clasificarlos por ejempo por: charlas, presentaciones, cursos, talleres, etc.

Visualización:

Si creamos un nuevo elemento de menú, en la ventana de Tipo de elemento del menú podéis probar los siguientes:

• List by Category
• List by Day
• View by Month
• Date range
• Search JEvents
• List by week
• List by year

El segundo fichero que hemos instalado permite visualizar un módulo con un mini-calendario que enlaza a nuestros eventos. Para ello vamos a Extensiones -> Gestor de Módulos -> nuevo -> JEvents Calendar desde donde le damos un título, una posición en nuestra plantilla, y lo configuramos como más práctico nos resulte.

Nota: Perdonad que haya redactado esta entrada con el componente en inglés. No he encontrado el fichero de traducción hasta ahora (!!!). Lo encontraréis aquí (es-ES_JEvents_2.0_J16.zip). Se instala desde el gestor de extensiones, como los ficheros anteriores.

Información de acceso restringido

Vamos a ver cómo podemos publicar información en nuestra página que no sea visible hasta que nos identifiquemos con un par usuario-contraseña. La idea básica es muy sencilla.

Esta funcionalidad puede ser útil por ejemplo para una asociación que quiera distribuir información únicamente a sus asociados; o una empresa que muestre datos de interés para sus clientes o proveedores; o una página de cursos que distribuya documentos sólo a sus alumnos; etc.

Lo primero que vamos a hacer va a ser activar el módulo de acceso desde donde se podrá insertar el par usuario-contraseña: Gestor de Módulos -> Nuevo -> Acceso -> Título: ÁREA PRIVADA y le damos una posición en nuestra plantilla.

Lo siguiente va a ser crear un perfil de usuario restringido que pueda entrar desde el módulo anterior: Usuarios -> Gestor de usuarios -> Nuevo y rellenamos los campos:

• Nombre, nombre real del perfil
• Nombre Acceso: será el campo usuario en el módulo de acceso
• Contraseña
• Confirmar Contraseña
• Email, un formato válido de correo

Utilizad los campos Nombre Acceso y Contraseña para acceder desde el módulo de acceso (en la parte pública). Veréis que Joomla os da la bienvenida, pero que la página ofrece la misma información que antes.

¿Cómo podemos hacer que algo se muestre sólo al hacer login? Lo más sencillo e intuitivo es ir a Menús->Menú Principal y crear un nuevo elemento de menú de cualquier tipo, que por ejemplo se llame Información privada, pero al que debéis poner el campo Acceso como Registrado. Así, este elemento del menú sólo se ve cuando se hace login, y no lo ven los usuarios público generales.

Formularios en Joomla

Un formulario es un elemento para la petición de información al usuario. Podemos necesitar desde un formulario de contacto básico que nos llegue por correo, hasta formularios más complejos como la solicitud de currículums, registro en un curso, encuestas de opinión, petición de un producto, etc.

El portal de extensiones de Joomla ofrece muchas alternativas en la categoría Contacts & Feedback -> Forms. Sin embargo, la creación de un formulario es bastante compleja, ya que requiere la definición de muchos parámetros por cada campo, por ejemplo:

• Formato del campo: texto, fecha, email, numérico, lista, casilla, etc
• Límite de caracteres (en el caso de los textuales)
• Anchura del campo en la parte pública
• Obligatoriedad del mismo
• Mensaje por no cumplir formato u obligatoriedad
• Etiqueta o leyenda de texto describiendo el campo
• Código único de cada campo que se requiere en formularios HTML
• Texto de ayuda extra para el usuario
• ...

Debido a esta complejidad, vamos utilizar la herramientas de formularios de Google, más sencilla de gestionar y que nos permite insertar sus formularios en nuestros artículos de Joomla.

Con nuestra cuenta de Google accedemos a su herramienta Google Docs. Pulsando Crear seleccionamos Formularios. Nos surge una ventana donde podemos darle un título y definimos los campos del mismo desde Add item. Dejo de vuestra cuenta practicar con los distintos tipos de campos que podemos usar. Recordad pulsar Grabar cuando finalicéis.

Visualización:

Para mostrar vuestros formularios en la página, se debe pulsar el botón Más acciones cuando editáis el mismo en Google Docs (arriba a la derecha) y Embed. Yo visualizo esta herramienta en inglés y no estoy seguro de cómo lo veréis vosotros. ¿Insertar, quizás? El caso es que os proporciona un código que debéis copiar en vuestro artículo.

Si tras ver el resultado en vuestra página quisierais modificar las dimensiones del cuadro de visualización del formulario, podéis retocar la anchura y altura del mismo, en el código que acabáis de insertar: width="760" height="937".

Probad a rellenar el formulario varias veces y comprobáis su funcionamiento. La información queda recopilada en formato hoja de cálculo en Google Docs, desde donde podéis exportarla a texto, Excel, etc.

Pestañas en un artículo extenso: Tabber y Slider

Si hemos de publicar un artículo muy extenso o tenemos una ficha muy completa de un producto, es recomendable estructurar visualmente esta información para facilitar su lectura al usuario. En este blog podéis ver una introducción al comportamiento de los usuarios en la lectura de un sitio web en función de su extensión: Lectura y usabilidad web: como leen los usuarios el contenido de un sitio web.

En esta otra página muestran un patrón visual de las zonas que más atraen la atención de un usuario que está navegando en internet. Observad la recomendación al final de esta entrada:

"No entierres el contenido en documentos demasiado largos: Divide los textos en varios documentos enlazados o crea un índice que permita identificar y moverse por las secciones de cada documento."

A continuación veremos dos plugins muy prácticos, vistosos y sencillos de utilizar para crear pestañas en un artículo de Joomla que van mostrando diferentes partes de la información conforme se van pulsando. En esta página de alquiler de trasteros, en la sección de Preguntas frecuentes, podéis ver uno de estos plugins en funcionamiento.

Las fichas de las extensiones Tabber y Slider en el portal de Joomla son:

• Tabber: http://extensions.joomla.org/extensions/news-display/contents-panel/14493
• Slider: http://extensions.joomla.org/extensions/news-display/contents-panel/14689

Desde Download pasamos descargar ambos plugins y los instalamos en nuestra página desde el Gestor de extensiones. Al tratarse de extensiones del tipo plugin, confirmaremos que están habilitados desde el Gestor de plugins.

Para su utilización insertamos en el artículo el código siguiente, en función del formato de pestaña que más nos guste:

Tabber:

{tab=Título de la primera pestaña}

Aquí escribimos cualquier contenido, pudiendo utilizar los códigos de otros pluigns: galerías, mapas, etc.

{tab=Título de la segunda pestaña}

Aquí el contenido de la segunda pestaña...

{/tabs}

Slider:

{slide=Título del primer slider}

Aquí escribimos cualquier contenido, pudiendo utilizar los códigos de otros pluigns: galerías, mapas, etc.

{slide=Título del segundo slider}

Aquí el contenido de la segunda pestaña...

{/slides}

Así por ejemplo, si quisiéramos hacer una ficha de un vehículo con el Tabber:

{tab=Descripción}

Texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo.

{tab=Galería fotográfica}

{gallery}galprueba{/gallery}

{tab=Punto de venta}

{mosmap width='500'|height='400'|lat='52.052312'|lon='4.447141'|zoom='15'|mapType='Satellite'|text='Texto del bocadillo'}

{tab=Información de contacto}

Telefóno: 948111222

Email: aaa@aaa.com

Persona de contacto: Juan Pérez

{/tabs}

Sin olvidar el código de cierre de pestañas {/tabs}. Tened en cuenta que ambos sistemas de pestañas son compatibles con la inserción de contenido extra fuera de las mismas, que será visible en el artículo en todo momento.

Libro de visitas

La opción de que el usuario pueda dejar su opinión sobre el sitio web era muy popular hace años. Hoy en día la comunicación con los usuarios se ha ido desviando hacia las redes sociales. Sin embargo, ya que nuestra página de referencia (Segunda Familia) dispone de un libro de visitas, y conocemos la alta calidad de las extensiones de Phoca, vamos instalar y configurar Phoca Guestbook.

Desde Download descargamos com_phocaguestbook_v2.0.1.zip, compatible con nuestro Joomla, y lo instalamos como siempre.

Al tratarse de un componente, accedemos a él desde Componentes -> Phoca Guestbook. En la demostración hemos creado (pulsando Guestbooks->Nuevo) dos libros de visitas denominados:

• Libro de visitas
• Danos tu opinión

Visualización:

Desde Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Phoca Guestbooks-> Guestbook, seleccionando en el campo Select Guestbook a la derecha el libro que deseamos activar en este menú.