¿Cómo crear diapositivas dinámicas con Smart Slider 3 en OceanWP?

Agregar una diapositiva a su sitio puede ser una buena opción, ya que causa la primera impresión para sus visitantes, pero después de haber decidido que desea agregar diapositivas en su página de WordPress, ¿dónde sabe cuál debe hacer? ¿Puedes usarlo gratis? ¿Es simple de administrar? ¿Puede presentarlo fácilmente a su sitio? La respuesta a todas sus preguntas es sí, es posible, Smart Slider 3 puede hacer todo esto: es completamente gratis, fácil de usar y funciona bien y su tema OceanWP. En este tutorial, le mostraré cómo importar un control deslizante demostrativo, crear su propio control deslizante inteligente y cómo puede crear una publicación dinámica utilizando el tema OceanWP.
La instalación de Smart Slider 3 puede instalar fácilmente Smart Slider 3 cuando accede a complementos → Agregar nuevo. Busque Smart Slider 3 y luego puede instalarlo.

Otra opción es que puede descargarlo directamente desde el sitio web Smart Slider 3 y luego cargarlo. Después de eso, puede activar Smart Slider 3:

¿Cómo puedo crear mi primera diapositiva? La importación de un control deslizante demostrativo es excelente, pero me gustaría mostrarle cómo puede crear su propio control deslizante. Te mostraré cómo construyo la primera diapositiva de un ejemplo de una diapositiva de ancho completo.

Primero elijo la nueva opción Slider en el tablero y luego elijo el ancho completo en una ventana emergente.

Configuré el tamaño de la diapositiva en 1200x600px y luego creé mi diapositiva. Luego agrego una diapositiva vacía, que tiene un fondo de gradiente lineal, por lo que la configuré en la configuración de diapositivas → la pestaña de fondo.

Para construir la diapositiva, usaré 2 modos de edición diferentes. Uno de ellos es el modo contenido, que funciona como generador de páginas y puede construir rápidamente sus diapositivas y tiene un comportamiento muy receptivo. El otro modo de edición es el modo de lienzo, donde puede extraer sus capas en cualquier lugar, pero debe encargarse del posicionamiento y la receptividad. En el control deslizante original se ve que el contenido está a la izquierda: el título, el texto y 2 botones, y en el lado derecho hay una imagen de la computadora portátil y en esta imagen hay una capa de video. Esta imagen y video se establecerán en el modo de lienzo porque de esta manera puede colocar una capa encima o debajo de otra capa. He establecido un ancho máximo para el contenido, porque no quiero un texto de ancho completo sin interrupción y No necesito el contenido en el lado derecho: el video estará allí. Así que lo colocaré a la izquierda. Y luego coloco el encabezado, la capa de texto y los botones de contenido. Puse un poco de forro a la izquierda como en los otros lados y entre las capas puse un pequeño borde. Después de eso, voy a la pestaña de diseño desde la configuración de la capa y configura el color de la fuente y la familia de fuentes. El botón de descarga doy un enlace de descarga y establece un efecto de desplazamiento.
Hay tantas opciones para diseñar su propia capa y también puede hacerlo receptivo, por ejemplo, puede establecer el relleno con un valor “em”, por lo que en los dispositivos móviles, estas configuraciones serán buenas.

Ahora el contenido está listo.
Solo tengo 2 pasos para completar: pongo la imagen de la computadora portátil y la capa de video de YouTube en el modo lienzo en diapositiva. Simplemente lo saqué hacia el lado derecho y los ajusto.

Creo que esta combinación de laptop + videos no es tan importante para la aparición en dispositivos móviles, por lo que detengo la visualización móvil. Ahora lo reviso en vistas receptivas y puedo ver que el título y la capa de texto son más grandes de lo que quiero, por lo que configuré un valor más pequeño para esto con el escalador de tamaño de fuente. Ahora estoy listo con la primera diapositiva. Si me gustaría usar más diapositivas para mi diapositiva, es suficiente duplicar esta diapositiva y cambiar el video o imagen y reemplazar el texto, porque la estructura ya está hecha, por lo que no tengo que comenzar desde la primera etapa .

¿Cómo puedo hacer un control deslizante de publicaciones en vivo en mi página inicial? Si desea resaltar su publicación, es una buena idea hacer un control deslizante en su publicación, que contiene la información más importante: por ejemplo, el título, la fecha de publicación y una imagen que puede atraer la atención de los visitantes y hazlos. Leer. Con Smart Slider 3, puede hacer una diapositiva de cambio dinámico desde una publicación para que su sitio pueda vivir, porque si distribuye una nueva publicación, la diapositiva cambia automáticamente. Te mostraré un ejemplo de cómo puedes establecerlo. Después de importar la plantilla de control deslizante de WordPress con ancho completo, agregaré una nueva diapositiva dinámica, donde elegiré la opción de publicación a través del filtro.

Elijo una categoría y pedido después de la fecha de publicación. He establecido 3 diapositivas, por lo que las últimas 3 publicaciones aparecerán en mi control deslizante en la categoría elegida.
Luego lo guardo y puedo personalizar mi publicación. Por defecto, solo aparece el título con la imagen presentada. Pero no es por eso que lo necesito, me gustaría usar la plantilla de muestra lo que importé. Puedes hacerlo en 3 pasos:

Paso 1: Copie la muestra de la diapositiva 2: Peguelo a la diapositiva dinámica

Paso 3: Cambie la imagen de fondo a la imagen presentada y cambiará dinámicamente.

Y obtenga el tema y los antecedentes de su diapositiva dinámica:

Del mismo modo, puede establecer una variable dinámica para capas en la configuración de la capa. Por lo tanto, puede ingresar muchas variables, como el título, la fecha, el contenido o también puede enviar a la publicación.

Puede configurar estas variables, por ejemplo, he establecido que la capa de texto dinámico muestra solo 100 caracteres de mi contenido.

Después de crear la diapositiva de publicación dinámica, debe ingresarla en el tema de OceanWP.

¿Cómo puedo importar un control deslizante listo para usar? Una vez que haya activado Smart Slider 3, puede acceder al menú Smart Slider 3 y verá el tablero. Puede agregar una nueva diapositiva o elegir una plantilla de la biblioteca de plantillas aquí. Si desea crear un control deslizante rápidamente, la forma más simple es importar un control deslizante demostrativo.

Smart Slider 3 tiene controles deslizantes de demostración gratuitos que puede agregar fácilmente en su página en la biblioteca de plantillas que puede elegir el control deslizante que desea usar, simplemente haga clic en el botón Importar y el tema se descargará en el tablero y puede personalizarlo.

Usando diapositivas demostrativas después de agregar una nueva diapositiva o importar una de las plantillas, puede agregar más diapositivas a la diapositiva. Simplemente haga clic en el botón Agregar deslizamiento. Hay muchas opciones para crear una imagen, un video o un control deslizante vacío y puede agregar Post y Dynamic Slides, o puede elegir una superposición estática, lo que significa que siempre estará sobre diapositivas y diapositivas y lo estará. No cruzar. Por ejemplo, es una buena manera de hacer una navegación. Puede usar diapositivas y diapositivas demostrativas, hay muchas plantillas preparadas que puede personalizar. Haga clic en la opción Biblioteca y elija la plantilla que usará.

Puede cambiar entre la piel oscura o abierta y seleccionar entre categorías. Y después de que pueda personalizar su diapositiva, puede cambiar todo, título, texto, capa y fondo. ¿Cómo puedo ingresar a mi control deslizante en el tema de OceanWP? Insertar Smart Slider 3 en el tema OceanWP es muy simple: puede usar el código deslizante corto y puede copiarlo fácilmente en una publicación o página.

O con el complemento adicional de OceanWP en la configuración de OceanWP, puede colocar la diapositiva antes/después de la barra superior, el encabezado, el título o el sótano.Y hay otra opción, puede personalizarla con Elementor u otros constructores de páginas utilizando el Widget Smart Slider 3. ¿Cómo hacer un encabezado personalizado con Smart Slider 3?Al hacer un encabezado personalizado, puede usar un generador de páginas, que creo que es la forma más simple.Simplemente explore el panel de tema → mi pestaña de biblioteca, luego haga clic en la nueva adición.(En el panel de tarea necesita el complemento Ocean Extra, por lo que debe agregar y activar este complemento recomendado). Si usa el constructor de páginas Elementor, elija el Canvas Elementor Templon y luego puede agregar la diapositiva a su tema.