Slider Revolution: Guía Suprema

Slider Revolution es literalmente uno de los complementos de WordPress más populares en la actualidad. Con más de 400 mil ventas y una calificación promedio de 4.75, el complemento ha demostrado su efectividad y grandeza. Revolution Slider: Lo que hace el complemento tan grande Slider Revolution fue desarrollado por Temo Point. Este complemento es un constructor para crear contenido rico y dinámico para páginas web. El énfasis se pone en “dinámica” porque le permite construir diapositivas palpitantes, agregando movimiento a las páginas. El complemento se proporciona con un constructor fácil de usar y muchas opciones. Los paquetes de configuración bien elaborados permiten al usuario ajustar cada detalle de la diapositiva y permite trabajar con contenido absolutamente diferente. Las diapositivas se pueden crear para publicaciones separadas, para las páginas completas y sus pequeñas piezas. Para ser más preciso con el complemento, puede crear:
controles deslizantes y carruseles de imágenes
Porción para publicaciones recomendadas
transmisiones de redes sociales
Galerías de medios
Bloques de héroes y primeras páginas
Razones por las que debe usar Slider Revolution con su sitio web No puede equivocarse con Slider Revolution. Un complemento completo con herramientas de uso fácil es una solución perfecta para crear hermosas diapositivas y aquí están las razones por las cuales. El complemento incluido hoy, casi todos los temas de WordPress vienen con un complemento Slider Revolution. Por lo general, el paquete temático incluye la versión gratuita del complemento. El complemento incluido se limita a las funciones básicas, pero es muy conveniente obtener el tema con el generador deslizante.
Sin embargo, si desea acceder a muchas de las funciones del complemento, tiene la opción de comprar el complemento independiente. La licencia habitual le costará $ 29 y puede obtenerla en el mercado de CodeCanyon. Para la licencia extendida, deberá pagar alrededor de $ 150 y obtener un año de asistencia técnica solo por $ 9. Sí, el complemento puede costarle algo de dinero, pero puede crear excelentes diapositivas incluso con la licencia de complemento habitual. Las plantillas de enchufe nazcadores no solo lo impresionarán con las herramientas y las funciones, sino que también tiene una colección de hermosos modelos prefabricados. Una maravillosa colección de plantillas prefabricadas y la biblioteca de medios gratuitas que puede usar en la diapositiva simplificará y acelerará la creación de diapositivas. Puede seleccionar la plantilla para cualquier proyecto de usted y, en lugar de construir un control deslizante, puede ahorrar tiempo y continuar con el aspecto preconstruido. Además, tendrá acceso a la gran biblioteca gratuita de diferentes objetos, como iconos de fuentes, imágenes de fondo, objetos PNG transparentes, SVG y otros. Puede usarlos y presentarlos fácilmente en diapositivas. Visual Slider Revolution Publisher cuenta con un sorprendente editor de Wysiwyg que hace que la creación y modificación de las plantillas de deslizamiento sea muy simple. Muchos propietarios de sitios son difíciles de escribir códigos complejos o contratar a un equipo separado para esta tarea. Gracias al editor deslizante, puede ahorrar tiempo y disfrutar de la función de deslizamiento y colocación para crear diapositivas notables.
El complemento Slider le permite ser más creativo con las diapositivas que construye y presenta fácilmente en su sitio web. Tendrá muchas opciones personalizadas, como construir una ubicación personalizada para la diapositiva, elegir el retraso del cursor, agregar transiciones, agregar capas multimedia, etc. Esto se puede hacer en el tiempo más corto utilizando la lista Drop -down. Además, el complemento tiene muchas funciones de navegación que le permiten cambiar el estilo de navegación y agregar flechas, marcadores, pestañas y miniaturas. El rendimiento de la revolución del control deslizante de alta velocidad está bien codificado para cargar rápidamente. Todos los aspectos de las diapositivas están optimizados y utilizan opciones de solución de problemas avanzadas para resolver cualquier problema, cargar automáticamente los archivos básicos y adaptarse con las funciones utilizadas. También utiliza una carga de perezosa inteligente y se optimizó SEO. Receptive AsspECTERS Uno de los mayores problemas que muchos desarrolladores web encuentran es que las diapositivas no han respondido. Como resultado, esas diapositivas no funcionan bien en dispositivos pequeños o no se muestran en absoluto. La capacidad de reacción es un componente esencial de la experiencia del usuario. Dado el enorme volumen de tráfico que proviene de los teléfonos móviles, será una pena que sus diapositivas no funcionen bien en otros dispositivos. Slider Revolution no es solo una simple diapositiva. El complemento está listo para responder, por lo que no importa las diapositivas que cree, puede estar seguro de que se optimizarán para cualquier dispositivo que se utilicen.
Slider Revolution se aseguró de establecer los puntos de respuesta para cada diapositiva, haciendo que cualquier diseño se vea genial en diferentes dispositivos y pantallas pequeñas. Independientemente de la opción que elija: diapositiva simple, carrusel o estándar, puede estar seguro de que se ve perfecto en cualquier dispositivo. Opciones de personalización Otra ventaja del complemento Slider Revolution son sus diversas opciones de personalización. Puede establecer retrasos para diapositivas, elegir flechas de navegación, fondos parallex, agregar capas multimedia, insertar botones, establecer fuentes personalizadas, agregar bordes y más. La revolución del control deslizante le permite personalizar cualquier cosa. Para ahorrar tiempo, puede ahorrar preajuste para usarlos más tarde en transiciones de diapositivas, estilos de fuente y capas. Suplementos Slider Revolution ¿Desea hacer que sus diapositivas sean más complejas y diversificadas con efectos de transición, animaciones? ¡Estás listo! Slider acepta diferentes tipos de contenido, como publicaciones de blog y publicaciones actuales, le permite usar flujos de plataformas sociales como Twitter, Facebook, Vimeo, YouTube e Instagram. Puede agregar enlaces, videos, imágenes y texto en el corto tiempo. Con la ayuda de las variaciones, puede construir una diapositiva rica en características y llena de información que los visitantes pueden usar.
La seguridad de la seguridad es uno de los aspectos más importantes cuando se trata de sitios web. Es posible que escuche que hay una vulnerabilidad de guerra afectada por Slider Revolution hace unos años. A partir de ese momento, Senseiss ha aumentado la protección de software y ahora utiliza una organización de terceros para auditar los problemas de arado regularmente. Por lo tanto, puede estar seguro de que el complemento es muy seguro. Soporte técnico El complemento viene con la documentación detallada y la gran sección de preguntas frecuentes con las preguntas del complemento más populares. Por lo tanto, es muy fácil comenzar con la revolución del control deslizante, incluso si no tiene experiencia laboral con ella. La disponibilidad de tutoriales detallados simplifica la creación de diapositivas para el sitio web para todos. El complemento de contenido está tratando con éxito con el deslizamiento deslizante para varias fuentes de contenido. Ya sea un producto de WooCommerce o una publicación común, Slider Revolution tiene herramientas. Las características fuertes hacen de este complemento una opción número 1 para todos. Su principal ventaja es que presenta la categoría de una solución todo en uno. No necesita complementos adicionales, todo está dentro del complemento. También debemos mencionar que es accesible. La licencia habitual le costará $ 26. Dada la cantidad de funciones que obtiene por el precio, Slider Revolution es el complemento deslizante más accesible en la industria.
En esta guía final, cubriremos todo, desde instalar el complemento hasta agregar una nueva diapositiva y colocarlo en el sitio. Instalación del complemento y la configuración primaria Muchos de los desarrolladores de temas incluyen la revolución deslizante en el paquete de temas. Si ha comprado uno de los temas premium de WordPress de Stylemixthemes, no debe instalar el complemento manual. Slider Revolution se instalará automáticamente con la importación de demostración. Si el paquete que usa no incluye el complemento, debe descargarlo e instalarlo manualmente. Para obtener una copia de la revolución Slider, siga este enlace. Tendrá que comprar el complemento. Inicie sesión en su cuenta de Envato y realice la compra. Después de eso, descargue el archivo: seleccione la opción de descarga para “solo el archivo de WordPress instalado”. Ahora tiene que agregar un nuevo complemento a su sitio, acceda a Dashboard-Plugins> Agregar nuevo. Una vez que se complete la instalación, active el complemento. ¡Felicidades, estás listo y puedes comenzar a crear tu primer control deslizante! Cómo actualizar el Punto de tema Slider Revolution lanza actualizaciones regulares de complementos Slider. Para actualizarlo, abra Slider Revolution en el tablero y siga las actualizaciones. En esta página, puede encontrar una pequeña sección con el título “Actualizaciones de complementos”. Aquí se especifica qué versión del complemento está actualmente instalada en su sitio web y una versión disponible para actualizar. También puede usar el modo estándar y ir al tablero>
Actualizaciones e instale la nueva versión del complemento allí. Revolución del control deslizante:
Nociones introductorias Si usa la diapositiva por primera vez, puede no ser lo suficientemente claro con toda la terminología utilizada allí. Hay tres elementos principales con los que puedes confundirte. Son módulos, toboganes y capas. Cada uno de ellos puede ser parte de otro y puede funcionar individualmente. Por ejemplo, puede crear un módulo diseñado para actuar como diapositiva y contendrá diapositivas. Además, puede hacer módulos como menús de navegación o encabezados, que no son diapositivas en absoluto, pero continuarán conteniendo diapositivas. La razón por la que es una revolución deslizante se creó inicialmente como un generador de control deslizante, sin embargo, ahora se usa como un editor completo de los sitios web. Entonces, con su ayuda, puede construir mucho más que meras diapositivas. La relación entre módulos, diapositivas y módulos de capas son contenedores de portaobjetos, que son contenedores de capas. Hay módulos para contener diapositivas. Cada módulo debe tener al menos una diapositiva. Al crear un modo vacío, se agrega una diapositiva vacía automáticamente. Puede crear diapositivas adicionales o puede agregar todo a una diapositiva. Depende completamente del tipo de contenido que cree. La diapositiva es un recipiente de capa. Cada diapositiva debe tener al menos una capa. Cuando se crea una nueva diapositiva, se agrega automáticamente una capa de fondo. Esta capa siempre está ahí, puede renombrarse y hacer invisible, pero no se puede eliminar. Esta área de fondo se puede llenar con capas. Las capas contienen elementos visuales, de audio o apariencia y se agregan a las diapositivas.
Texto, botón, imagen, audio, video, grupo y fila son todo tipo de capas. Cada capa representa una sola pieza de soporte de medios. Las capas se pueden animar de una manera que mejor se den cuenta de su idea de cómo usar la revolución deslizante: la configuración global como ya mencioné, Slider Revolution tiene muchas opciones, y esto no es una exageración. Por lo tanto, antes de comenzar a construir la diapositiva, le recomendamos que mire a través de la configuración global y descubra los principios principales de trabajo con el complemento. Si hace clic en Slider Revolution en el tablero, podrá abrir la pantalla de configuración del complemento. Pantalla de configuración en la parte superior de la pantalla Puede encontrar la pestaña con las siguientes opciones: módulos, actualizaciones, activación, noticias, globalidades, preguntas frecuentes, asistencia. En esta etapa, solo trabajaremos con los dos: módulos, para crear un nuevo y global, para analizar la configuración global del complemento.
Configuración global comenzaremos con Globals. Las configuraciones globales se dividen principalmente en varias secciones de:

General
Puntos de interrupción de la cuadrícula de apariencia predeterminada
Fuentes
misceláneas

Estas configuraciones son responsables de las opciones implícitas de la red receptiva que se aplican a la construcción de una nueva diapositiva, cargando la fuente personalizada, creando la base de datos y muchos más. Solo hay unas pocas opciones en las que deberá concentrarse. En primer lugar, es la capacidad de responder, para asegurarse de que las diapositivas futuras se vean bien en cualquier dispositivo. Aquí hay una guía rápida sobre dispositivos y sus dimensiones. En la sección del punto de interrupción de la cuadrícula de apariencia predeterminada, puede establecer el ancho en píxeles para diferentes tipos de dispositivos: escritorio, cuaderno, tableta y móvil. Mientras cada dispositivo tenga su propio tamaño, inserte el ancho exacto para cada tipo para garantizar la diapositiva correcta.

Los dispositivos de cuaderno, que incluyen todas las computadoras portátiles, MacBooks y tabletas orientadas horizontalmente, son de aproximadamente 1600 PX.
Las tabletas orientadas a verticales tienen un ancho que no excede 778px (según el iPad).
Y dispositivos móviles. Esta es una parte importante, porque en la actualidad, más de la mitad del tráfico de Internet se genera a través de dispositivos móviles y no será satisfactorio si los usuarios no pueden ver las diapositivas en su sitio correctamente. Sin embargo, esto puede confundirse, y la razón es que los teléfonos inteligentes modernos tienen dimensiones absolutamente diferentes. Sugerimos usar el número, no más de 500 PX.
La segunda cosa que quiera controlar es el acceso al control deslizante. La opción de permiso le permite rechazar el acceso al complemento para otros usuarios, excepto administradores y editores.
¡Ahora puedes comenzar a construir tus diapositivas! Hay tres opciones que puede usar. Puede comenzar desde cero y construir una nueva diapositiva, exportar un archivo desde las plantillas de revolución deslizante o puede importar la muestra de diapositivas incluida en nuestro artículo, revisar la primera opción y crear un nuevo control deslizante desde cero. Esto nos permitirá explorar más posibilidades de complementos. Creando una nueva diapositiva ahora, cuando hemos terminado con algunas configuraciones principales, podemos continuar creando una nueva diapositiva. Abra la configuración de Slider Revolution y haga clic en el nuevo módulo en blanco. Haga clic en la guía de inicio si desea seguir una breve lección. O deje la guía para saltar sobre este paso.

Su pantalla se dividirá en varias áreas: a su izquierda hay un marco en el que se muestra todo el contenido, a la derecha: es un espacio de trabajo con secciones y configuraciones. Opciones generales para comenzar con las opciones generales. Haga clic en el icono de la rueda para abrir la configuración. En primer lugar, debemos llamar a nuestro módulo. En la sección de título, ingrese el nombre y duplíquelo para minúsculas y guiones entre palabras en lugar de espacios. Se requiere el alias para agregar la diapositiva a una página. También puede usar el código corto proporcionado copiándolo y colocándolo en la página o publicación que desea mostrar su diapositiva.
Después de eso, podemos personalizar el tipo, la altura y el ancho del área de la capa de escritorio. Estas configuraciones están en la pestaña Aspect.
Para el chico, tienes tres opciones para elegir:
Slisor: varias diapositivas animadas que giran para mostrarse una por una.
Escena: una sola diapositiva que se puede usar como modo de contenido. Carusel: muchas diapositivas con múltiples visibles al mismo tiempo.
La siguiente configuración que necesitamos especificar es dimensionar. También hay tres opciones disponibles: Auto: este es el parámetro predeterminado que estira el control deslizante al ancho principal del contenedor, según lo definido por su tema de WordPress. Ancho completo: una opción de deslizamiento de ancho completo se extiende de izquierda a derecha (aún tiene que definir la altura) Pantalla completa, para diapositivas grandes que llenan toda la pantalla, independientemente del tamaño del navegador o su dispositivo con el complemento de revolución del deslizamiento, Puede animar cada lado de la página en el sitio. Considere, cuando haga esto, el peso de su página aumentará y, por lo tanto, llevará más tiempo cargar su página. Como resultado, puede afectar negativamente la clasificación de SEO. RESIGGS La configuración del cambio de tamaño clásico o lineal garantiza que el control deslizante se comprimirá correctamente después de la configuración del tamaño de la pantalla principal (por ejemplo, un control deslizante de 1000x400px se comprimirá a un deslizamiento de 500x200px con fuentes, imágenes y otros elementos deslizantes). La herencia inteligente permite la creación automática de las dimensiones basadas en la configuración de escritorio que elija, con la opción de ajuste. La configuración personalizada o manual le permite establecer el tamaño del control deslizante utilizando píxeles precisos, con la posibilidad de configurar las dimensiones del cursor en diferentes anchos de la pantalla: escritorio, computadora portátil, tableta y teléfono. La reactividad de los portaobjetos que pasa. Todavía no he terminado con la receptividad. Hay un tamaño del área de la capa donde puede especificar el ancho del navegador.

Por lo general, las opciones se establecen de forma predeterminada en dimensiones automáticas y solo se especifican los parámetros de escritorio. Puede hacer lo mismo para otras opciones iniciándolas. Además, si inicia el dispositivo específico, su área de trabajo (el contenedor de portaobjetos) se ajustará a los parámetros del dispositivo seleccionados, es decir, puede controlar el control deslizante para el dispositivo de concreto. Para cada dispositivo, se especificarán las dimensiones de la cuadrícula en la configuración global. La cuadrícula es el área donde se encuentran las capas deslizantes. No hay números estrictos que deba ingresar. Te darás cuenta de lo que funciona mejor para ti después de intentar explorar más opciones. Esto fue solo el comienzo, algunas opciones generales que facilitarán su trabajo con la diapositiva. Y una vez que haya terminado con este lado, puede pasar al siguiente paso. Una mirada más cercana a las opciones además de las opciones generales, hay otras tres pestañas con las que interactuará mucho. Queremos guiarlo a través de la configuración principal con la que operará. Básicamente, la creación de diapositivas considera varios componentes involucrados en el proceso. Estas son opciones generales, configuraciones de navegación, diapositivas y capas.


No bromeé cuando dije que Slider Revolution tiene muchas opciones. Hay demasiados elementos para cubrir, para describirlos fácilmente y luego revisar los más importantes. 1. Las opciones generales ya han alcanzado algunos elementos de opciones generales, como el título y la aparición. Sin embargo, además, hay otras cosas que debe ajustar. En general, las opciones generales le permiten configurar lo siguiente: Título: para proporcionar el nombre del control deslizante. Apariencia: seleccione el tipo de diapositiva (diapositiva, escena o carrusel) y dimensionamiento (automóvil, ancho completo o pantalla completa). Esto le ayuda a editar los anchos y las alturas para el área de la capa, la posición de su módulo, un color o imagen de fondo predeterminada. Contenido: identifica cómo agregar contenido a la diapositiva. Puede elegir entre 9 fuentes de contenido. Valores predeterminados: aquí le sugerimos que se concentre en un parámetro importante: la duración de la diapositiva (siempre que cada diapositiva).

General: esta sección incluye configuraciones para diapositivas de rotación automática, parada con el mouse, diapositivas en el bucle y seleccionando una primera diapositiva designada. Además, aquí puede ocultar o desactivar la diapositiva en el móvil o debajo de los anchos especificados por los píxeles.

En el desplazamiento: esto permite a los usuarios seleccionar efectos del desfile, como Paralax, profundidades 3D, cronología, desenfoque, desenfoque, tonos grises y más. Todos los efectos van con configuraciones personalizables.


Spinner – o precarga, y el complemento tiene 15 opciones de spinner para elegir.
Las opciones avanzadas le permiten activar la carga perezosa, seleccione una imagen de copia de seguridad o simplifique la diapositiva en los navegadores antiguos. Tenga en cuenta que es mejor ser utilizado por profesionales o usuarios familiarizados con el concepto de programación y codificación.
Como modal: esta opción especial es necesaria si desea crear una diapositiva que aparezca como una ventana pop -up o de caja de luz y le brinde opciones para la posición del control deslizante, el color de la cubierta y el código corto que se usa al insertar la diapositiva modal en las páginas..
Skin: la piel presenta el preajuste que puede crear y asignar las capas de texto (especifica el color del resaltado, el título, el texto del contenido).
Suplementos Cuando encuentre suplementos (los suministros de notas solo están disponibles si ha comprado su propia licencia de control deslizante). 2. Opciones de navegación Si tiene la intención de incluir más diapositivas, las opciones de navegación lo ayudarán a agregar herramientas de navegación deslizante, como marcadores, flechas y botones. Todas las opciones incluyen configuraciones fáciles de personalizar para posición/alineación, dimensionamiento, visibilidad y estilo/preajuste global.

Los elementos de navegación incluyen:

Progress: barra de progreso o círculo que visualiza el progreso actual de la diapositiva.

Flechas: facilita el acceso de los visitantes a través de las diapositivas.
Marcadores: 14 estilos de puntos de navegación para agregar a la diapositiva.
Archivo: muy útil para las diapositivas de contenido en las que se requiere la navegación de pestañas.
Pulgares: es necesario mostrar una imagen en miniatura como opción de navegación. Hay 5 opciones disponibles.
Tamaño anterior: especifica el tamaño de la imagen de vista previa.
Teclado: puede activar la navegación del teclado (recomendado para la accesibilidad).
El control de ratón de ratón, como la función del carrusel o el reverso.
Editor de navegación: esta sección es para personalizar flechas, anotadores, pestañas o dedos grandes con su propio código personalizado.

3. Opciones de diapositivas La siguiente parte de la configuración está relacionada con las diapositivas.

Antecedentes: elija el fondo para la diapositiva. Elija entre Transparente, coloreado (puede agregar un gradiente), imagen, imagen externa o video (YouTube, Video o HTML5).
Miniatura: Defina la miniatura visible por el administrador y la miniatura utilizada para la navegación.
Animación: elija la animación de transición para diapositivas.
Filtros: 22 filtros diferentes para agregar a las diapositivas.
Progress: permite personalizar la longitud de la diapositiva, la ruptura y la visibilidad en una diapositiva.
Reglas de publicación: controle si la diapositiva se publica o no se publica.
Etiquetas y enlace: ayudarlo a agregar datos personalizados de clase, ID y HTML para la diapositiva, así como un enlace.
Parámetros-agregar hasta 10 parámetros personalizados para usarlos en diapositivas y navegación.
Capas de bucle: administre la configuración del bucle si la diapositiva tiene solo una diapositiva.
En el desplazamiento, customice su paralaje y efectos de contaminación en la diapositiva.
Agregando nuevas diapositivas después de terminar de configurar la diapositiva y ajustar todas las opciones, es hora de agregar una nueva diapositiva al proyecto. Puede ver el marco, que muestra el contenido de la diapositiva cuando la agrega. Ahora es transparente. Puede cambiar la opción de fondo y agregar una imagen o establecer el color. Puede cargar una imagen desde su computadora o usar una fuente externa (agregando un enlace). También puede establecer el color como fondo en lugar de la imagen. Se puede hacer con bastante facilidad. Simplemente seleccione la opción colorida en el menú desplegable en el panel de origen, luego haga clic en el botón BG Color para elegir su color. Si desea usar el video, simplemente agregue la fuente. Agregando una nueva capa a la diapositiva en la parte superior de la pantalla, encontrará la opción de capa ADD. Úselo para agregar una nueva capa a la diapositiva. Hay 8 opciones diferentes. Sin embargo, las opciones más populares son las imágenes y los textos con botones si tiene que agregar algunas herramientas de navegación deslizante. Opciones de capa: cómo usar la flexibilidad de la revolución deslizante se basa en la disponibilidad de varias opciones y la capacidad de configurar cada detalle por separado, así como ajustar todo el proyecto deslizante. Las capas no son una excepción. Cada vez que agrega una nueva capa a la diapositiva, puede controlar cada opción para ello. En el ejemplo de agregar una nueva imagen a la diapositiva, revisaremos todos los parámetros que las opciones de capas le permiten cambiar.
Cuando desee agregar una capa de capa a la diapositiva, haga clic en la imagen en el menú de sueldo Agregar capa. Luego cargue la imagen deseada. Cerca del marco, encontrará diferentes opciones de capas (contenido, estilo, tamaño y posición, etc.). El contenido de la capa muestra información básica sobre la capa. Puede configurar la carga perezosa y cambiar el tipo de fuente.

Usando las opciones de estilo de capa, podrá agregar un fondo de color. La siguiente opción es espaciar. El espaciado nos ayuda a mover la parte superior a la parte inferior, de izquierda a derecha, abajo, y de izquierda a derecha. Están marcados con la letra “M”.
Pose y tamaño. Establezca la alineación, así como la posición y el tamaño de la capa de imagen. La alineación vertical y horizontal se puede modificar fácilmente, simplemente haga clic en uno de los iconos de alineación.
Después de eso, puede establecer la posición con el desplazamiento vertical de las opciones de posición alineadas. Juega con los parámetros X e Y para mover su capa a la diapositiva.
Opciones avanzadas Las opciones de estilo avanzado le permiten rotar una capa horizontal, vertical y central y le permiten agregar sombras a las capas.
Animación Opciones de la capa La animación es la opción principal en Slider Revolution. La idea principal del complemento es agregar en su sitio sus elementos animados en lugar de elementos visuales estándar estáticos. Las opciones de animación agregan movimiento a las diapositivas, utilizando esta acción, puede animar las diapositivas y establecer la apariencia y salida de las animaciones. Hay dos líneas para las opciones de apariencia y salida: dentro y fuera.
Cada línea se proporciona con un menú de caída con diferentes tipos de animaciones. De manera predeterminada, la opción Fade-In está configurada para todas las capas. Pruebe algunas animaciones para ver cómo se ve en la diapositiva y elegirla en el mejor de los mejores. El siguiente se usa para la duración de la animación, facilitando la animación y para definir la animación inicial. La duración define mientras la animación dure para finalizar, la opción de inicio define el momento después de lo cual la animación comenzará una vez que se cargue la diapositiva. El alivio define la velocidad a la que progresará la animación.
La cronología de la animación Si tienes más capas agregadas a la diapositiva, probablemente no quieras aparecer al mismo tiempo. Slider Revolution Animation Chronology puede ayudarlo a resolver este problema. Se encuentra justo debajo de nuestro marco de trabajo. El inicio predeterminado de la trama para cada capa se establece en 0 milisegundos, lo que significa que las capas aparecerán en la pantalla después de 0 milisegundos en los que se carga. La duración de la apariencia generalmente se establece en 3 segundos, lo que significa que una capa se vuelve completamente visible en 3 segundos. Para cambiar las opciones, elija la capa y edítelo especificando otro valor. Asegúrese de establecer valores diferentes para una capa diferente, para que no aparezcan repentinamente y se vean desordenados.
Ahora, para ver más de cerca las opciones de línea de tiempo 1. La lista de la lista de estos iconos se puede usar para ocultar o mostrar las capas y ocultar o mostrar las filas en función de la alineación vertical. Solo el administrador del sitio tiene acceso a estas opciones.
2. La duración de la cronología La duración total de la cronología se define en las opciones generales> valores implícitos. También se puede configurar individualmente en opciones de diapositivas> progreso. Al drenar el bloque en la cronología izquierda y derecha, puede ajustar fácilmente la longitud de la diapositiva. Otra opción que puede hacer es hacer clic en el icono del reloj y editarlo en porcentaje.
3. Vista previa de la cronología para obtener una vista previa de la cronología, debe hacer clic en el icono de reproducción o simplemente extraer el bloque inactivo. 4. Cambie el nombre de las capas para cambiar el nombre de la capa, haga doble clic en el texto de la capa de línea de tiempo y renátela. También puede editar el título de la capa en el centro superior del editor. 5. Capas del índice Z / órdenes de apilamiento para establecer el Índice Z-Index / apilamiento del pedido, solo tiene que dibujar capas en la cronología. 6. Animaciones para cada capa, hay una animación de entrada y salida y animaciones de fotograma de teclas adicionales. Todas las animaciones se presentan en cronología.
Tire de un bloque de animación para ajustar el punto de partida de la animación en la cronología. Y edite la longitud de la animación sacando el punto final del bloque de las opciones de bucle de la pestaña de bucle le permite crear animaciones en el bucle. Puede elegir un tipo de animación, definir la velocidad y la relajación del bucle y establecer una hora de inicio y finalizar para el bucle.

Hay 8 tipos de los que puedes elegir:

Personalizado, los bucles se aplican, bucles de efectos, ondas, ondas, rotación, deslizamiento y flota y pulso. Cada animación en el bucle tiene su propio conjunto de opciones. El péndulo te hace la capa para balancearse de un lado a otro. Entre las opciones que puede establecer se encuentran el grado de fin y comienzo: identifica grados entre los cuales la animación y el punto de origen x e y: este parámetro determina el punto del eje desde el cual se girará la capa, puede especificarla en porcentaje. Effect Loops le permite elegir entre varias opciones: escala de grises, parpadeo, platillo y liteo. Todos los efectos se ven diferentes, por lo que le recomendamos que vea cada opción para elegir cuál es la mejor para usted. La animación de onda hace que la capa gire en un movimiento similar a la onda. Gira alrededor de un eje fuera de la capa. Puede establecer un punto de rotación X e Y para determinar la posición del eje alrededor del cual se girará la capa, un ángulo inicial para identificar la posición inicial de la animación y un rayo para la órbita de rotación. El bucle de manejo hará que la capa se mueva de lado a lado, de arriba a abajo, de izquierda a derecha y viceversa. Use el menú Drop -down para elegir la opción que desee. El bucle de rotación hace que la capa gire alrededor del punto de ajuste del eje. La capa girará y formará un círculo completo si elige el primer elemento del menú de rotación de caída a rotación. Para mover su capa de izquierda a derecha, de derecha a izquierda, de arriba a abajo, puede usar la animación de diapositivas y desplazamiento. Puede establecer una posición de inicio y finalización para la animación. La animación de pulso hace que su capa aumente y disminuya continuamente.

Especifique el inicio de zoom y el extremo de zoom. Los valores predeterminados aquí son 1 tanto para el comienzo como para el final. Esto significa que la capa seguirá siendo el 100% de su tamaño. En otras palabras, no será animado. Si ingresa 0.5 para el zoom de inicio, su capa comenzará desde el 50% de su tamaño y aumentará hasta el 100% de su tamaño, luego volverá al 50%, etc. Las opciones para cruzar los efectos de la capa son los elementos básicos de un buen UX. Los efectos de pasar con el ratón generalmente indican que la acción es necesaria o realizada, especialmente que este método se usa activamente con diapositivas. Con Slider Revolution, puede cambiar las capas, textos e imágenes cruzando el cursor. Agregando los efectos de desplazamiento en la revolución deslizante primero, debe activar la capa de la capa. Seleccione la capa que desea agregar el efecto y haga clic en el despilfarro en las opciones de capa. Haga clic en Activar para iniciarlo. En la parte inferior, encontrará todas las opciones que necesita para establecer el comportamiento de su capa en Hover. Si deja todo como está, la capa no mostrará ningún cambio. Configuración para cruzar el cursor Lo primero que puede establecer aquí es el cursor. En el menú Drop -down, puede encontrar diferentes opciones para el cursor. Auto y predeterminado realizan las mismas funciones y no reflejarán ninguna diferencia. Crosta y puntero definen la forma del cursor del mouse en la pantalla. Hay varios estilos de cursor aquí. Algunos de ellos son bastante inusuales, sin embargo, la mayoría indican la acción que la capa tiene cuando se activa. Por ejemplo, si conecta la capa al centro de asistencia, puede elegir el cursor de ayuda.

El puntero del evento se establece de forma predeterminada en el automóvil. No se usa ninguna opción cuando no hay contenido límite. Esta sección le permite elegir el aspecto del cursor en la capa, activar la animación y configurarla. Animación de desplazamiento aún, hay una animación flotante que puede establecer de acuerdo con sus preferencias. Hay varias cosas que debe tener en cuenta. En primer lugar, no se ve bien cuando la capa cambia a flotar y la transición tiene lugar en un punto. Siempre mejor cuando la transición tiene lugar con la demora. . De manera predeterminada, el retraso se establece en 300 ms, déjelo para que si está adecuado o modificado. También puede establecer la relajación para la transición. Tiene más opciones para elegir.

Filtro a su capa, puede agregar filtro. En otras palabras, puede desvanecer la libra hasta cierto punto. La opción se expresa en píxeles. Cuanto mayor sea el valor, más grueso “. El estilo también es una parte de estilo en la que puede establecer el color de fondo y ajustar el borde, a saber, cambiar su color y seleccionar el estilo del borde.

En las opciones de la capa de desplazamiento, las opciones de desplazamiento de ON hacen posible que la diapositiva se mueva sobre el mouse. Hay tres opciones: paralaje, basado en scroll de línea de tiempo y efecto de filtro basado en el efecto.

Las opciones de acción de la capa hacen que sus capas interactieran. Por ejemplo, puede hacer que una capa abra un enlace cuando un usuario hace clic en él. Haga clic en el icono de acción para elegir el tipo de acción que tiene. El primer menú desplegable es donde puede elegir el tipo de acción que le gustaría ocurrir. Aquí hay muchas opciones: acción de enlace, acción de diapositivas, acción de capa, acción de medios y acción de pantalla completa. Su oportunidad es completa depende de usted y sus objetivos, ya sea que desee que la capa abra el enlace o que cambie la diapositiva. Después de elegir qué ADD, debe establecer esta opción en particular. Por ejemplo, hemos agregado un enlace. Seleccione la opción de enlace simple y en la nueva pantalla, se le ofrecerá ingresar algunos parámetros apestos a medida que la URL misma, seleccionando la interacción y la acción, y más.

Opciones de visibilidad de la capa Si desea que su capa sea visible en todos los dispositivos, luego hacer que los interruptores que se muestran en la imagen a continuación se encienden en la sección de visibilidad. El primero es para escritorio, el segundo es para computadoras portátiles y tabletas orientadas horizontalmente, la tercera es para orients verticales, y el último es para teléfonos móviles. Si no desea que se muestre su control deslizante en algunos dispositivos, simplemente apague esta opción.

Capa de texto Después de revisar las opciones que necesitamos para la configuración de la capa, pasemos al otro tipo de capa e intentemos agregar algún texto a nuestra diapositiva. Hay dos opciones para elegir entre el encabezado de estilo rápido o el contenido. La principal diferencia entre ellos es previamente al estilo.

Vamos a señalar algunas opciones principales que debe configurar para la capa de texto. Tienen lo siguiente:

En la sección de contenido, agregamos nuestro texto y lo alineamos.

Con estilo cambió la fuente y su tamaño, peso, la altura de la línea contaminó el tamaño y el POS para cambiar la ubicación de la capa dentro del control deslizante

En animación, agregamos algún efecto y texto especial.


Al agregar una capa de texto, aparecerá un cuadro negro.Necesita ingresar su texto allí.Todo lo que cambie será visible en su marco de trabajo.


Pasando a la pestaña de estilo.Por defecto, el estilo de fuente que se aplica al texto es Roboto.Elija la familia de fuentes que prefiera del menú desplegable.Asegúrese de seleccionar la capa de texto antes de comenzar a editarla.

Además de elegir una familia de fuentes, también puede determinar el tamaño de la fuente, la altura de la línea, el peso de fuente y el espacio de cartas aquí también. Todas estas opciones ajustan el aspecto del texto. Así que tómese su tiempo para configurarlo y jugar con estas opciones para encontrar la mejor combinación. A continuación, elija el color para su texto. Puede usar el selector de color y encontrar el color que se adapte a su página y se deslice perfectamente. Después de eso, puede guardar el cambio y ver cómo se ve el control deslizante en su página. Si todo es bueno, puede pasar al siguiente paso define la alineación horizontal y vertical de la capa de texto. Por ejemplo, desea tener su capa de texto 300px desde el borde izquierdo de la pantalla y 100px desde la parte superior. Según esto, la alineación horizontal se establecerá a la izquierda, y la alineación vertical a la parte superior. Complete los campos X e Y respectivamente y guarde los cambios para verificar cómo se ve el texto. Para las opciones de personalización, puede usar lo mismo que pasamos durante la configuración de la capa de imagen. Puede agregar animaciones, definir visibilidad, acciones creadas, etc. También puede ingresar el código HTML en su campo de capa de texto. Gracias a esta opción, en insertar códigos cortos diferentes y crear sus elementos HTML usando capas de texto. Cómo crear un efecto de paralaje con la revolución del cursor de paralaje es uno de los efectos más populares que hace que el sitio web sea más impresionante y más dinámico. Probablemente haya visto muchos sitios web y temas integrados con este efecto especial. Y ahora mostraremos cómo puede construir uno usando el complemento Slider Revolution. ¿Qué es el paralaje?

El efecto de paralaje se puede definir como un efecto en el que los elementos en el fondo y los elementos en primer plano se mueven a diferentes velocidades y crean la ilusión de profundidad. Por lo general, los elementos de fondo se mueven más lentamente son formas diferentes en que puede obtener este efecto en su sitio web. Afortunadamente para nosotros, Slider Revolution tiene todas las características para ayudarlo a lograr el efecto de paralaje. Creación de paralaje en la revolución deslizante Primero inicie el paralaje. Vaya a Opciones generales> En Scroll> Características de la base de desplazamiento> Paralaje y coloque el interruptor de paralaje habilitado. Hay muchos valores de profundidad diferentes que ofrece el complemento. Seleccione el mejor para usted. También puede ingresar sus propios valores.
Agregar paralaje a las imágenes de fondo para agregar el efecto de paralaje a la imagen de fondo, vaya a opciones de diapositivas> en la configuración de desplazamiento> paralax y 3D y elija su profundidad favorita en el menú desplegable.
Hay reglas estrictas al seleccionar la profundidad. Es mejor si intenta diferentes valores y ves cuál de ellos funciona mejor con tu diapositiva. Las diferentes profundidades afectan y crean diferentes efectos. Es por eso que le recomendamos que los pruebe para ver el resultado. La adición de paralaje a las capas en el control deslizante Revolution, el efecto de paralaje se puede agregar no solo a las imágenes de fondo, sino también a las capas individuales. Lo bueno de este efecto es que brinda a los usuarios una ilusión si controlan las partes del control deslizante en la página solo moviendo el mouse. Esto se ve muy bien en el sitio y, además, es muy fácil de configurar. Seleccione su capa, vaya a estratos> en Scroll> Paralaje y pestaña 3D y elija el nivel de profundidad deseado. Como resultado, obtendrá la capa con un paralelo que se activa en el movimiento del mouse. Ya sea una imagen de fondo o una capa individual, agregar el efecto de revolución del control deslizante Paralax es extremadamente fácil. Aunque, no todas las diapositivas necesitan paralaje. Úselo especialmente para diapositivas simples, porque las dinámicas con mucha animación probablemente funcionarán mejor sin este efecto. Agregando una capa de capa de capa, puede crear y diseñar el botón para agregar a la diapositiva para navegar. Para hacer esto, primero, debemos agregar una capa de botón al marco de trabajo.

Cuando agrega el botón, aparecerá en el formulario de texto, solo tiene que personalizarlo. En el lado derecho de la pantalla, puede encontrar muchas opciones para botones predeterminados. Puede seleccionar uno de ellos para su botón.

Además, puede ir con algo original, porque hay variaciones en los botones de reproducción, los interruptores y otros. También es posible agregar un efecto de sombra y hacer que el botón se vea más interesante. Una vez que haya elegido el estilo, puede cambiar la configuración avanzada y personalizar su aspecto. Todas las configuraciones se pueden encontrar en la pestaña Stratos de opciones. Puede cambiar la apariencia inicial del botón, puede cambiar el texto, puede cambiarlo al pasar con el mouse y puede configurar animaciones. Cómo hacer un control deslizante receptivo Al principio, ya hemos establecido algunos parámetros para hacer nuestras diapositivas receptivas. No es suficiente. Para esto, debe asegurarse de que cada capa de cada diapositiva se adapte perfectamente a todos los dispositivos y el tamaño de la pantalla. Entonces, una vez que haya agregado todas las diapositivas y capas a la diapositiva, es hora de ajustarlos bien para todos los demás dispositivos disponibles. Al editar diapositivas dentro del trabajo, en primer lugar, las configuras para que se vean bien en los dispositivos de escritorio. Cuando esté seguro de que todo se ve perfecto en el escritorio, puede comenzar a jugar con aspectos para otros dispositivos. Ahora puede elegir el dispositivo que desea emular en el menú desplegable. Inicie el dispositivo que desea verificar la pantalla del control deslizante. Los dispositivos disponibles son: escritorio, cuaderno, tableta, móvil.

Puede cambiar todo por cada dispositivo. Por ejemplo, para las capas de texto puede establecer diferentes tamaños de la fuente, la altura de la línea, el peso de la fuente y el color, todo dependiendo del dispositivo en el que se ve el cursor. Para la capa de imagen, para cambiar su tamaño, debe agregar un ancho diferente, y la altura de la imagen se ajustará automáticamente de acuerdo con el ancho. Presta atención a los bordes de la red azul. Definen los bordes del dispositivo con el que está trabajando actualmente. Entonces, si alguna de las capas se extiende fuera de los bordes, asegúrese de cambiar la configuración de esas capas. Finalmente, guarde la diapositiva y vea qué aspecto en vivo. Agregar el cursor a la página que hizo un buen trabajo y ahora es el momento de ver cómo se ve su control deslizante en la página. Para hacer esto, use el código corto de Slider Revolution que creó anteriormente. Este código corto se puede encontrar en la pestaña Título en la sección Opciones generales. O si abre la revolución del control deslizante desde el tablero. Busque el módulo actual y seleccione la opción de incorporación.

En la ventana emergente, seleccione la opción para páginas y publicaciones y copie el código corto.

El código corto debe parecerse a [rev_slider alias = “title”] [/rev_slider] con el “título” basado en el alias que le dio al cursor. Mostrando con el elemento el uso del método de código corto para mostrar el control deslizante en la página es IS es Bastante simple. Sin embargo, hay una manera que podría ser aún más fácil. Todas las diapositivas que construye con el complemento de revolución del control deslizante se puede insertar en la página usando el widget de elemento. Seleccione la página en la que desea mostrar el control deslizante y abrir – o Por el editor elemental. Luego simplemente tire y coloque el elemento en el marco de trabajo. En el panel de widgets, busque el control deslizante de widget Revolution 6 y agréguelo en la página. Al deslizar el widget, deberá elegir el control deslizante que Desea usarlo. Use este modo como alternativa al código corto, porque algunos propietarios de sitios son más fáciles de trabajar con widgets para el generador de páginas. Cómo exportar diapositivas para exportar la diapositiva, vaya a SLI DER Revolution haciendo clic en la pestaña relevante en el menú Menú. Todas las diapositivas que ha importado o creado se mostrarán allí.

Pase con el mouse sobre la miniatura del módulo que desea exportar. Haga clic en la flecha pequeña en la esquina inferior derecha. De todas las opciones, seleccione Exportar y hacer clic.

Verá el cuadro de diálogo de confirmación que le informará que la exportación puede llevar algún tiempo. Haga clic en “Sí, Slider de exportación” y se iniciará la descarga. Cuando se complete la descarga, tendrá un archivo .zip de su diapositiva.