Evilnapsis

Programming, Hacking and More

WordPress

[WordPress] Page Builder By SiteOrigin #1 Slider

El Plugin Page Builder by SiteOrigin nos ayudara a crear una pagina de inicio o cualquier pagina personalizada en WordPress de manera facil con drag and drop.

Para este ejemplo usare el tema que tengo actualmente en mi sitio el cual se llama “Flash” y este tema requiere de el plugin Page Builder y el Flash Toolkit que incluye varios widgets que seran utiles con el Page Builder.

Link del tema: https://wordpress.org/themes/flash/

Una vez que instalamos el tema, es importante modificar los parametros de la pagina de inicio y cambiar “your latest post” por “a static page”, en esta opcion seleccionaremos una pagina que se usara como pagina de inicio y una pagina para que se muestre el blog, en mi caso mis paginas se llaman “home” y “blog”.

Una vez que asignamos la pagina de inicio vamos a la opcion de editar pagina y en la opcion de editar pagina seleccionaremos la opcion “Page Builder” y veremos lo siguiente:

Se puede ver que estoy usando la pagina “landing” como ejemplo, ya que la pagina “home” ya la tengo modificada, pero el procedimiento es el mismo del principio para cambiar la pagina de inicio.

Lo primero que haremos sera agregar un “row” o una fila, todos los componentes que agregaremos a continuacion empezaran con un row, al momento de dar click en agregar “row” se mostrara un panel para con la opcion “Row Lyout” que son el numero de columnas.

Para el slider usaremos un “row” con Row layout=1.

En esta ventana de nuevo row podemos cambiar varios aspectos del row, los cuales estan en la parte de la derecha, attributes, layout y design.

En attributes podemos agregar un id, class, y hasta css especifico.

En Layout podemos cambiar los parametros de margin y padding.

En Design podemos colocar un color o imagen de fondo a todo el row.

Una vez que creamos nuestro row, lo seleccionamos y vamos a la opcion “Add Widget”

En esta ventana veremos todos los widgets que tenemos disponibles, y en teoria podemos agregar cualquier Widget, pero ahora nos vamos a enfocar en la opcion de la izquierda “Flash Toolkit Widgets” que son los widgets especiales para el tema que tenemos.

Y despues veremos que se agrego el Slider en la pagina.

Ahora vamos a seleccionar el Slider y damos click sobre la opcion “edit” y veremos lo siguiente.

Aqui podremos modificar el slider, agregar slides, ordenar y agregar “titulo, descripcion, imagen y botones”, la medida recomendada para imagenes es de 1920×700.

Agregamos Todos los slides que necesitemos.

Cada vez que hagamos cambios podemos ir guardando la pagina o ver la opcion de vista previa para ver los resulados.

Espero este articulos les sirva de ayuda para empezar con WordPress.

En siguientes articulos les explicare como seguir agregando mas componentes a la pagina, no olviden suscribirse y confirmar su suscripcion al blog para recibir un email cada vez que publique un articulo.

Agustin Ramos

Desarrollador de Software

Leave a Reply