Documentación Droppics

 

Introducción

Droppics es una extensión de Joomla que se utiliza para generar galerías y administrar imágenes de una manera inteligente y productiva.

 

Droppics-main

Principales características:

  • Crea una galería con una caja de luz con solo 3 clics
  • Use Droppics desde el editor y en la interfaz
  • Gestiona videos entre imagenes
  • AJAX carga múltiple
  • Generación de miniaturas en la carga
  • Personalización de la pantalla sin CSS
  • Regenera imágenes desde tamaños originales y personalizados.
  • Tema de diseño de la galería incluido
  • Galerias multinivel
  • Ordena imágenes y galerías con arrastrar y soltar
  • SEO optimizado

 

I. INSTALACIÓN DROPPICS

1.1 Instalar

Nuestro componente es compatible con Joomla 3.x. Todas las características y las integraciones de terceros se incluyen en todas las membresías.
Para instalar nuestro componente, debe descargar el archivo .zip y usar el instalador Joomla estándar.

 

joomla-install

 

Luego haga clic en el botón Examinar> Cargar e instalar. El componente, los módulos y los complementos se instalarán y activarán de forma predeterminada.

 

1.2 Actualización y actualizador automático

Para actualizar la extensión, puede instalar una nueva versión sobre la anterior descargando el archivo .zip de JoomUnited o utilizar el actualizador automático (recomendado).

 

actualización de Droppic

 

El actualizador automático, que inserta la notificación de actualización, está incrustado en la extensión de Joomla que ha instalado. Se le notificará como con cualquier otra extensión en el panel de control, o puede verificar manualmente usando el menú: Extensión> Gestionar> Actualizar menú.

 

Inicie sesión en su cuenta para actualizar

Debe iniciar sesión en su cuenta de JoomUnited para actualizar todas sus extensiones de Joomlaited de Joomla. Para iniciar sesión, acceda a la configuración principal del componente y luego haga clic en Pestaña de actualización en vivo. En la parte inferior, encontrarás un botón de inicio de sesión.

 

actualización en vivo

 

Ingrese sus mismas credenciales de JoomUnited que utiliza para iniciar sesión en www.joomunited.com

 

login-joomunited

 

El botón se pondrá naranja - ¡enhorabuena! ¡Ahora puede actualizar todas las extensiones de JoomUnited en este sitio web! Si su membresía ha caducado, recibirá un enlace de renovación y un texto que lo explica.

 

vinculado a la cuenta

 

Nota: un solo inicio de sesión le permitirá actualizar todas las extensiones de JoomUnited (con respecto a su membresía). El inicio de sesión no caducará a menos que lo desconecte.

II. GALERIAS DROPPICS

La idea principal de Droppics es establecer parámetros de imagen y galerías en el componente, y luego administrarlos directamente desde su editor. Droppics funciona en todos los editores WYSIWYG estándar de Joomla, tanto para el frontend como para el backend. Por ejemplo, puede agregar una galería en un módulo personalizado de Joomla.


Cuando se instala Droppics, tiene un botón de complemento de editor que se muestra debajo o en su editor (dependiendo del editor en uso).

 editor-galeria-gerente

Haz clic en él para abrir el lightbox principal de Droppics.

 

lightbox-gallery

 

2.2 Gestionar galerías

Para crear una galería, haga clic en Nuevo album en la columna izquierda.

 

nueva galería

 

Nota: ya se ha creado una galería predeterminada en la instalación del componente.


Para agregar nuevas imágenes a su galería, puede arrastrar y soltar medios en la parte central o hacer clic en Botón Seleccionar archivos.

 

subir imagenes

 

Aparecerá una ventana emergente de notificación en la esquina superior derecha después de que el usuario cargue, ordene, mueva, elimine o edite las imágenes.

 

notificación de archivo emergente

 

Selecciona una o algunas imágenes para subirlas. El cargador es alimentado por HTML5, por lo que puedes enviar imágenes grandes. Se redimensionarán automáticamente a los tamaños definidos en los parámetros globales (el valor predeterminado es 1200px).


Puede reordenar sus imágenes cuando se cargan usando arrastrar y soltar. El orden se guarda automáticamente, por eso no hay botones para guardar

dragndrop-image-order

Para insertar la galería en su artículo, haga clic en el Insertar esta galería botón en la columna derecha

 

insertar-galería-contenido


 
La galería se materializará en tu artículo con un Icono de xyx0xyx.

 

galería-materializada

 

Guarda tu contenido y listo. ¡Tu primera galería ya está en línea! Si hace clic en la imagen de la galería Droppics en el artículo y luego en el botón Droppics, volverá a cargar la galería seleccionada.

Nota: si está activado en la configuración, puede configurar los parámetros de visualización en cada galería desde el menú de la derecha.

 

El tema por defecto le permite definir:

  • Tamaño del borde
  • Radio de la frontera
  • Color del borde
  • Color y tamaño de la sombra de la imagen.
  • Margen izquierdo, margen superior, margen derecho, margen inferior
  • Ya sea para cargar sub-galerías o no
  • Algunos parámetros adicionales están disponibles en el tema de la presentación de diapositivas, como retraso de transición, efecto ...

 

2.3 Sub-galerías

En Droppics puedes administrar galerías multinivel. Para agregar un subnivel de galería, simplemente arrastre y suelte las categorías de imágenes para ordenar o cambiar los niveles.

 

orden-galería de imágenes

 

Para activar la navegación de sub-galería, deberá configurar el parámetro en la categoría principal en el menú de la derecha.

 

sub-galerías

 

Si ha deshabilitado la configuración de la galería y la configuración desde la configuración global, use el menú Componentes> Droppics> Opciones> Seleccione el tema para configurar.

 

ajustes-subgalleries

 

Como tienes sub-galerías, podrás navegar por ellas en la interfaz. Todas tus sub-galerías generarán automáticamente miniaturas de navegación.

 

subgalleries-frontend
 

La miniatura de la sub-galería se genera automáticamente usando la primera imagen en la categoría de imagen. Una vez que esté en una sub-galería, también puede elegir una imagen para usar como un botón de retroceso desde la Opción> Parámetros principales menú.

 

categoría de reserva

 

Se puede establecer un estado predeterminado del nivel de la galería en las opciones globales para la parte de administración: abrir Droppics con todas las categorías de imagen abiertas o cerradas. Puede ahorrarle espacio si tiene una gran cantidad de galerías.

 

cerrar imagen-categoría

 

2.5 Copiar - Cortar - Pegar imágenes

Una vez que una imagen se ha cargado en Droppics, puede hacer una selección única / múltiple haciendo clic en ella. Puede seleccionar varias imágenes presionando y manteniendo presionada la tecla CTRL. El primer método para mover o copiar imágenes es usar arrastrar y soltar. Arrastrar y soltar solo moverá la imagen, arrastre y suelte mientras mantiene presionado Shift para copiar las imágenes.

 

arrastrar y soltar imagen

 

También puede utilizar los botones de arriba a la derecha.

 

copiar y pegar botones

 

III. GESTIÓN DE IMAGEN INDIVIDUAL


3.1 Opciones de visualización de una sola imagen

Con Droppics, puede usar las mismas imágenes en sus galerías o como una sola imagen en su contenido. Abra Droppics, haga clic en una imagen y el panel derecho cambiará. Desde la parte superior se puede definir:

  • Radio de la frontera
  • Margen
  • Tamaño del borde
  • Color del borde
  • Tamaño de la sombra
  • Color de la sombra
  • Alineación

 

image-parameter1

 

No te olvides de pulsar guardar una vez que hayas terminado con tu modificación.

Todos esos parámetros se pueden configurar de forma predeterminada para todas sus imágenes en las opciones de componentes.

 

parámetro de archivo único

 

Luego, puede definir una acción en el clic de la imagen con un enlace externo opcional y una leyenda (texto debajo de su imagen):

 

image-parameter2

 

La acción al hacer clic determinará si el usuario:

  • Abre la imagen en un lightbox.
  • Siga un enlace a un artículo o un menú
  • Siga un enlace a una URL personalizada
  • Hacer nada
  • Ver una leyenda debajo de la imagen.

La opción de la casilla de verificación "Seguir enlace personalizado en la vista de galería" agrega el comportamiento del enlace a una sola imagen, pero también funciona en la vista de galería si inserta toda la galería en su contenido. Esta característica se utiliza con frecuencia para las páginas de la cartera.

El enlace a los menús y artículos se completa con una herramienta para ayudarlo a encontrar su contenido más fácilmente en una lista.

 

imagen-enlace-galería

 

Al hacer clic en una sola imagen, tiene la opción de reemplazar la imagen en todo el sitio web de Joomla. ¡Cargue uno nuevo y Droppics regenerará todos los tamaños de imagen, incluidos los tamaños personalizados, y lo reemplazará en su contenido!

 

reemplazar imagen

 

Si se activa el Vista previa de la imagen parámetro en la configuración, incluso puede activar un efecto de imagen de desplazamiento del mouse.

 

imagen flotante

 

Y el proceso de carga también.

 

proceso de carga

 

3.2 Crear tamaños de imagen personalizados

Puede crear algunas imágenes de tamaño personalizado utilizando los archivos originales, y la imagen original permanecerá intacta. Haga clic en el nuevo tamaño botón de radio, define al menos un ancho y un nombre de archivo para generar una nueva imagen. El nuevo nombre y tamaño del archivo de imagen se agregarán a la lista.

 

imagen-tamaño personalizado

 

Los tamaños de imagen personalizados también se pueden generar automáticamente en la carga. Para definir los tamaños personalizados usa el menú: Componente> Droppics> Opciones> Imágenes individuales> Tamaños personalizados.

Luego puede agregar los tamaños personalizados de imagen que desea crear de forma predeterminada en la carga.

 

imagen de tamaño personalizado

 

Una vez que se genere la imagen personalizada, la tendrá en su lista de imágenes. Luego simplemente haga clic en inserta esta imagen para añadir en su artículo.

 

imagen en contenido
 
Al hacer clic en la imagen y en la Droppics Botón, la imagen se abrirá de nuevo con todos sus parámetros.

 

reabrir imagen

 

Para fines de SEO puede definir título, texto alternativo y cambiar el nombre del archivo original.

 

seo-imagen-info

 

3.3 Aplicación de efectos sobre la imagen.

Puede aplicar filtros y efectos sobre las imágenes. En el lado derecho del tamaño de la imagen, haga clic en el "Editar" icono de la pluma.

 

efecto abierto

 

Aparecerá una pantalla con efectos.

 

imagen-efecto-vista


 
Puede aplicar modificaciones y efectos:

  • Cultivo
  • Redimensionar
  • Espejo
  • Girar
  • Aplicar algunos efectos de peinado.

 

IV. PARAMETROS DROPPICS


4.1 Parámetros de extensión


Para acceder a los parámetros Droppics, use el Componente> Droppics> Opciones menú.

 

parámetros globales

 

  • Tamaño de la uña del pulgar: el tamaño de todas las miniaturas que se generan al importar imágenes, o que se muestran en galerías y como imágenes individuales
  • Talla mediana: el tamaño de la imagen ampliada, utilizada en la caja de luz, por ejemplo
  • Tamaño de carga original: el tamaño de la imagen original almacenada en el servidor, utilizada para generar nuevos tamaños
  • Imágenes responsivas: habilítelo para generar 2 nuevos tamaños de imagen con anchos de 768px y 300px que se cargarán en las pantallas de dispositivos móviles
  • Mostrar el título de la caja de luz: mostrar el título de la imagen cuando una imagen se abre en una caja de luz
  • Tamaño de las imágenes en lightbox: el tamaño de las imágenes se muestra en lightbox; si tu eliges Grande, recuerde regenerar imágenes para su carpeta si nunca lo ha hecho antes
  • Calidad JPG: configura la calidad de tus imágenes .jpg
  • Compresión PNG: Úsalo si quieres comprimir tus imágenes al subirlas.

 

opción de cultivo

  • Recorte de la imagen: puede recortar sus imágenes en la carga según el tamaño que haya definido al principio; de lo contrario, se respetará la proporción de la imagen
  • Cerrar categorías: cargar la vista de categorías / subcategorías de administrador abierta o cerrada
  • Define infinitas opciones de desplazamiento: carga la imagen progresivamente, en lugar de todas las imágenes en la carga de la página
  • Elementos cargados en primer lugar: Número de elementos cargados inicialmente
  • Elementos cargados en ajax: Número de elementos cargados en ajax.
  • Cargar tema en la categoría: Cargar y cambiar los parámetros del tema en cada categoría de archivo.
Nota: si cambia el tamaño de la imagen o activa la función de respuesta, debe realizar una Regeneración de miniaturas. Haga clic en el botón y regenere todos los tamaños de imagen.

 

regeneración de miniaturas

Puede tomar un tiempo dependiendo del número de imágenes, solo se paciente :)

4.2 Permisos y gestión de imágenes frontend.


Droppics utiliza la ACL predeterminada de Joomla para configurar el acceso a la administración de imágenes. De forma predeterminada, el usuario Super administrador siempre tendrá acceso a todas las galerías.
 
Si necesita restringir el acceso para algunos usuarios, colóquelos al menos en el grupo de administradores o cree un nuevo grupo de usuarios de Joomla. Por ejemplo, si desea que un usuario administrador Accede y edita solo sus propias imágenes.establecer "Editar" derecho a "denegado" y "editar propio" a "Permitido". También puede restringir:

  • Acceso a la configuración Droppics
  • Acceso a la interfaz
  • Creación de imágenes / galerías.
  • Eliminación de la imagen / galería
  • Edición / edición de archivo propio.

 

Permiso droppics

Droppics ofrece una opción para administrar imágenes desde el frontend usando el botón editor (como en el lado del administrador) o usando una interfaz dedicada. Al instalar Droppics, se agrega una plantilla para hacer precisamente eso.
Use un menú de Joomla para cargar Droppics en la interfaz. Naturalmente, todos los permisos que haya configurado serán respetados.

Agrega un menú de Joomla y configura el Estilo de plantilla frontend Droppics.

 

droppics-menu

 

Luego, si está permitido, puede administrar imágenes desde la interfaz del sitio web.

 

Frontend-image-edition

 

4.3 Temas y ajustes de imagen

Con Droppics puede permitir que el tema y el parámetro de imagen se definan en cada imagen e categoría de imagen, o solo como una configuración global.

 

parámetros de tema de carga

 

Todas las configuraciones de tema de la configuración global solo se aplicarán si no permite que se realicen las modificaciones en la categoría de imagen.

 

configuración de temas

 

Aquí está la ilustración de la configuración del tema permitida y no permitida en las categorías de imágenes. En la segunda imagen, solo puede cambiar el tema, pero no cambiar la configuración del tema.

 

Opciones de tema

 

4.4 Videos remotos

Droppics puede incluir videos remotos de Youtube, Vimeo y Dailymotion entre las imágenes. Para activar la opción usa el Componente> Droppics> Opciones> Agregar videos remotos menú.
También puede definir el ancho predeterminado del video para cuando se agrega como un solo video o se carga en una caja de luz.

 

video remoto

La activación de esta configuración agregará un botón encima del botón de carga.

 

agregar-remoto-video

 

Lo único que debes agregar es la URL del video.

 

añadir-remoto-video-url

 

4.5 Importador de imágenes Droppics

Droppics tiene un importador de medios que puede explorar e importar imágenes desde su servidor. Para activar la opción, vaya a Componente> Droppics> Opciones> pestaña Parámetros principales> Mostrar parámetro de importación de imágenes.

 

imagen importada

 

Luego use la interfaz principal de Droppics para seleccionar algunos medios e importarlos en la categoría que desee.

 

selección de importadores

 

4.6 marca de agua de imagen

Droppics puede aplicar automáticamente una marca de agua (copyright) a sus imágenes. Primero, necesitas habilitar el Imágenes de marca de agua Característica desde la configuración del componente.

 

habilitar marca de agua

 

Luego, seleccione la imagen de la marca de agua para aplicar sobre sus imágenes: puede ser cualquier imagen, pero preste atención a la dimensión.

 

marca de agua selecta

 

Hay 5 posiciones donde puedes colocar la marca de agua:

  • Centrar
  • Abajo a la izquierda
  • Abajo a la derecha
  • Parte superior derecha
  • Arriba a la izquierda

 

posición de marca de agua

 

Los tamaños posibles cuando se aplica la marca de agua son:

  • Todos los tamaños
  • Miniatura
  • Grande
  • Medio
  • Tamaño personalizado

Nota: La marca de agua se aplicará solo después de guardar la configuración y regenerar las miniaturas (haga clic en el botón '' regenerar miniaturas '').

 

imagen-marca de agua

 

V. LOS TEMAS DE DROPPICS

5.1 Temas de presentación.


Droppics viene con 6 temas:

  • Tema predeterminado
  • Tema Masonry: este es un tema sensible que muestra paredes de fotos
  • Tema de presentación de diapositivas para mostrar un carrusel de imágenes
  • Un tema de diseño tipo polaroid.
  • Tema Heapshot, que es una pila de fotos con un bonito efecto para cambiar entre ellas.
  • Tema de presentación de diapositivas avanzado personalizado, con un editor de texto personalizado sobre imágenes

 

galería-tema-imagen-params

 

 


Una vez que aplique un tema en una galería, podrá configurar las opciones relacionadas con el tema en una sola imagen. Por ejemplo, aquí he configurado el tema de la galería como la presentación de diapositivas avanzada, por lo que puedo agregar texto sobre la imagen.

 

Custom-slideshow-theme


En el tema masonry, puede configurar el ancho máximo de la imagen.

 

masonry-config

 

VI. CONSEJOS Y TRUCOS DE DROPPICS

Droppics está diseñado para ser utilizado en todos los campos del editor WYSIWYG. Solo necesita tener el complemento de contenido llamado. La mayoría de las veces se activa de forma predeterminada.
Tenga en cuenta que este no es el caso en el módulo HTML personalizado de Joomla; debe activarlo como se muestra arriba.

 

modulo personalizado

 

En la pestaña de opciones necesitas configurar la Opción Preparar contenido a Sí.

 

6.2 Crear / anular un tema Droppics

Puedes personalizar y agregar temas a Droppics. No utilizamos las Anulaciones de MVC estándar, sino el sistema de complemento predeterminado de Joomla.
Los temas de Droppics son complementos y se encuentran en la carpeta / plugins / droppics.

Tendrá que copiar un complemento y cambiar el nombre del complemento para crear su nuevo complemento (pluginname.xml y el nombre de la clase del complemento).
Luego instálalo a través del instalador estándar de Joomla. Se debe mostrar en la lista de temas. Luego puede hacer todos los cambios que desee en este tema y no se verá afectado por las actualizaciones.