 Bienvenidos a Wordpress igualada, ya sabéis que aquí hacemos mitas de Wordpress relacionadas con Wordpress y bueno, simplemente convenir a las mitas ya formáis parte de la comunidad, ¿vale? Entonces, que sepáis que también podéis participar en la comunidad hay traducciones, plugins de soporte en las mitas como venís hoy y en las WordCamps, que es una maratón de mitas, por decirlo de alguna manera, se dan muchas charlas en un fin de semana, ¿vale? Yo soy Ron Bocache, soy diseñador y desarrollador en Wordpress aquí tenemos a nuestro amigo Dani, que también es diseñador y desarrollador en Wordpress y nos dedicamos profesionalmente a ello aquí los objetivos de las mitas son conocernos enseñar y aprender de una forma muy, bueno, como nosotros lo utilizamos si será el caso colaborar en proyectos, compartir experiencias y formas de hacer siempre desarrollando, siempre en Wordpress y bueno, participar y conocernos la estructura de la charla será la presentación, que es la que estoy haciendo ahora la policía, que es Dani Rodríguez, ahora tiene un laso, no sabéis si era Rodríguez y luego, será el 25 minuto, le doy una ronda de preguntas y luego lo más importante y lo más chulo es el networking y las cervezas y las pinzas ¡Hola! ¡Pasa, pasa! Esto no sería posible si los patrocinadores globales le han cambiado, porque le han cambiado que son Bogotá y Automatic, ya sabéis que son Bogotá no sé, auto y todo UBC Virginia, Bucones y Blue Horse y luego tenemos los patrocinadores locales que es Dani Sen, que es la empresa de Dani y El Entamento de Mirador del Camín, que está aportando la sala y los espacios sin ellos, la verdad, que no podríamos hacerlos, que haya la verdad, que haya mejor y SiteGround, que es el que patrocina la mitad y también las cervezas y las pinzas que son muy importantes Es lo más importante, ¿cómo es eso? Y nada, ya os he presentado, os dejo a este fenómeno, Dani Rodríguez No necesitas esto, ¿no? No, no, no, no Hoy hablaremos de Brick Filter y es el mejor editor visual, si o no alguien lo conoce, alguien lo conoce todavía, aquí le soy, Jordi, Luny el resto, conocéis? Sona, pero... No Me parece que es mío de El Entro, a mí ¿Eh? No le he probado, pero... ¿Es mío de El Entro? Yo he trabajado en elementos, pero voy a ver ¡Cambieras, cambieras! Yo igual ¡Cambieras! ¡Millo es mío! Sí Pero no es Brick, pues Bricks no conozco ¿No? Por eso va bien, a pensarles años ¿Será una ponencia bastante práctica? No sé cuándo esperan Bricks He comenzado hace... no sé ¿Qué haces? ¡Cuántas mesos! ¡Seis mesos! Si veis o no Bricks, la realidad es que hasta ahora me gusta mucho el pareil he cambiado de elemento totalmente para Bricks Sí que... Bricks es más... es más técnico Necesitáis una pequeña base de CSS sobre todo CSS, el resto bueno, la saliendo solo pero CSS sí que salió para utilizar Por las personas que quieren hacer solo no code, salió un poco complicado Claro, si no... si no ayudas nada, nada, nada haces lo más completado Si sabes un poquito de CSS pero que lo puedes aprendiendo sobre la marcha tampoco es necesario hacer un pedazo de curso de CSS no es necesario Aquí en la página web suya tenéis un botón de probarlo gratuidamente, que está bueno también podéis probar el editor gratuidamente y lo voy a ser interesado Sí, porque es un film, ¿no? Sí, ahora eso lo podéis probar y poder competir y todo eso, ¿vale? lo que he hecho ha sido hacerme una web una arcopia de mi web me he cargado elemento, me he cargado todo, casi básicamente porque he dejado así Custom Post High, si he dejado cositas para después poder ir jugando con ello, ¿vale? Vamos a instalarlo de Peq Unlegida, lo que comentaba Raúl la mayoría de maquinarios visuales son plugins elemento es un plugin Divis un plugin Divis un tema, ¿no? Divis tema Visual Composer es un plugin que lo odio ¿Cuál más? Hay varios que la mayoría son plugins este caso es un tema tenemos que irnos a temas y instalar el tema te lo tienes que descargar de su web yo lo tengo descargado por aquí en el distra lo instalamos y hay que aportar la licencia que yo la tengo por aquí Si probáis, se puede probar si licencia, ¿eh? Si, para probarlo, sí si soy capaz de memorizar mi código lo tenéis la licencia Está grabado, ¿eh? ¿Cuánto cuesta? Eso lo cortaremos ¿Qué te dice que activa la licencia para estar con Bricks? Vamos a activar la licencia lo damos aquí ¿Qué tenemos Bricks instalado? Bueno, pregunta que tenía ¿Qué precio? Ya ha subido Ya ha subido El día quince subió ¿El día quince subió? Sí El día quince pasó A eso Bueno, una web son 79 Al año Sí Sí, sí, sí Y un Limited Web Y para siempre, Lifetime 600 dólares Para todas las vuestras que quieras y... Pero, suposamente, si utilices la manera profesional tienes más de un cliente Claro, claro Se acaba la pena Es que ha subido mucho, ¿eh? Sí, antes era 250 dólares Un Limited, toda la vida Sí, sí Porque lo están haciendo muy bien Todos los pasos que dan lo están muy bien, la verdad que es espectacular Si al final tienes 2, 3 webs también te sale a cuenta coger la un limit aunque no... aunque no vayas a hacer para más en pocos años a morir o cada año tienes que estar pagando Sí, cada año pagando o depender algo ¿Se multiplicas al final? Vamos a ajustes de Blix Mirámos un poquito los ajustes pero encima, ¿vale? Lo primero, ¿qué tipo de entradas quieres poder editar con Blix? Normalmente lo que son entradas el blog, digamos así normalmente no se utiliza un arquitectador visual para hacer el entrar de la entrada con el editor visual sobre el elemento funciona igual en teoría el contenido tiene que ser con el propio editor de WordPress ¿vale? Pero bueno, pueden pasar cosas ranas que tú quieras activar alguna de estas cosas De momento dejaremos así ¿Estas para si quieres hacer que los datos de Gutenberg cuando actives el editor de Blix se vayan a Blix y al revés si cambias de Blix a Gutenberg a veces falla un poco no lo está muy pulido aún Subirese a OVGs, como ya sabéis son perigosos porque son código que tened cuidado, quién puede subirse a OVGs y quién no ¿vale? Visable Google Class este que era Esto falta el tema de SEO Blix te incluye ya un mini plugin, digamos así de SEO te permite poner metatítulos metadescripciones te permite poner esa web de los index Ausie te permite hacer algo de SEO básico ¿vale? a lo mejor te podrías agarrar un plugin de SEO aparte ¿vale? si quieres un plugin de SEO aparte pues tienes que escribarlo generar tamaños y margen personalizados si quieres generar diferentes tipos de tamaño de imágenes si tienes clases globales de CSS actualmente o si tienes clases globales de CSS ya yo lo que creo que eso de desactivar uno de las clases globales yo creo que es para si quieres poner clases globales porque a veces yo que estoy aramaquetando en Blix, mira eso es una solución que tengo un problema, se me aplica una clase global que no sé dónde ir entonces voy a las clases globales que no están entonces eso es una idea lo probaré desactivas las clases globales de Blix y entonces ya lo haces, si no las vas a utilizar porque tienes un título concreto luego en otro sitio tienes un título como pasa con la web de la loya que lo tiene todo muy diferente de verdadito suave CSS esto es cuando haces el típico enlace barra amadilla contacto que le clica si te baja hasta contacto está normalmente por qué te llega esta clases activar el botón borrar los datos de Blix típico cuando borras Blix que se te borre todo que más interesante es que si lo vamos a aplicar todos guardarlos en medio formado hacia el dato si quieres guardar los formularios cuando te envíen algo para que se guarde esto es para que tenga el Blix antiguo que ha hecho unos cambios de código en contenedores secciones y bloques esto es por si queréis personalizar las páginas de login podéis hacer páginas personalizables de login para Blix decirle no por defecto me pondrás otra página ¿Quién tiene acceso al consultor? normalmente los administradores normalmente no quieres un cliente puede acrocarle al abuelo puede acrocarte el diseño depende plantillas plantillas por defecto si las quieres activar te crea unas plantillas por ejemplo el template archive de comers te crea todos de individual crea todos básicos si no quieres que te los cree ya de por si plantillas remotas está guay no lo he utilizado aún pero es para cuando te puedes guardar plantillas y las puedo compartir con otra persona y esa persona va a utilizar tus plantillas o solo tú también te vas a compartir para ti mismo en otros proyectos del web que tú tengas le puedes crear plantillas si quieres de efectiva de autoguardado de veces es un coñazo de hacer lo tiempo depende te tienes que acostumbrar a guardar porque si no sabes qué pasa te genera mucho código que eso es el antece del web entonces si tú te acostumbras a cuando haces un cambio pin porque tienes un botón ahí arriba y le das a guardar pues perfecto pero a mí me ha pasado que hasta que no me ha acostumbrado he perdido muchas cosas y es eso, si te acostumbras es lo mejor quitarlo, que no se guarde solo porque para qué quiero que cada 60 segundos se guarde cada minuto no es necesario pero si no pues déjalo modo constructor el típico culo claro o le puedes poner los coloritos que quieras este es el interesante del idioma sobre todo los que quieren más estudios de CSS las clases CSS se las saben por el nombre de inglés el idioma del sitio te lo ponen castellano el idioma del sitio está castellano y te hace una solución un poco rara rara por ejemplo es Padding, si tú le haces el castellano ¿cómo te lo traduce? te hace una espalada y entonces no te enteras tú si estás acostumbrado al Padding es el espacio que hay en la caja del contenido entonces de seguida lo pices puedes configurar hay un logo arriba que si le quitas te hace una cosa aquí puedes configurar qué cosa tienes que hacer si ir a una de repersonalizada si ir al escritorio, si ir a la vista previa puedes configurar abrir el nuevo pestaña, eso es interesante TTT, cosas más interesantes por aquí rendimiento por si Bricks es muy bueno el rendimiento muy bueno, ya veréis después tú creas un texto y el código es un texto no hay más, no hay código extra no hay cosas raras no hay 20 cajas como otros como de métodos no quieres hacer para la publicidad cosas son como son un texto dentro de una caja y otra caja de parcoja ha mejorado pero sigue siendo así los elementos en el DOM este no, este pones lo que tú pongas es lo que va a salir en el código lo que tú pongas pues aparte puedes desactivar los emojis y erroresitas desactivar la encustación de vídeos y erroresitas puedes ponerte las fuentes locales eso también lo permite ya el elemento puedes hacer una carga lenta de las imágenes puedes activar rotacueris de todo, aquí podéis hacer más cositas, ya te viene un pequeño plugin de Cache depende como te lo podéis ahorrar también modo mantenimiento, el típico si quieres hacer una template aproximadamente o estamos trabajando, volvemos pronto aquí se puede ver clave SAPI de un splash por ejemplo fotos de escocaje google maps, recacha es importante para los formularios hay varios alfins que podemos detectar, makechimp, facebook ¿vale? código personalizado esto también muchos editores visual extrañado tienen puedes añadir código a css personalizado escribe en canecera, el típico código de analytics o scripts en el cuerpo o en el pie de página ¿vale? eso es a nivel general por cada página estamos hablando a saco aquí tenemos las fuentes personalizadas que es lo que acabamos de decir que podemos poner fuentes locales en google phones si no quieres ¿vale? y básicamente aquí tenemos vamos a ver un poco el panel de control voy a hacer una página nueva creo una página y vamos a ver un poco como es el panel siempre hay que publicar la página y después editar con bricks si, si no después te permite ponerle un nombre pero si no me pones un nombre raro o te hace cosas raras el elemento también le pasa tenemos tres partes principales la parte de la izquierda donde está todos los switches que podemos poner la parte del centro que es el lienzo lo que estamos diseñando la web y la parte de la derecha que es la estructura de la web donde ya se irán poniendo los diferentes cosas que iremos poniendo ¿vale? déjame aquí arriba tenemos el botón que hemos visto antes que hemos dicho que quería que fuera vista previa es este de aquí en logo si yo le clico se me abre la vista previa de esta página como no he guardado no salen página nueva si no salen la misma página ¿vale? aquí tenemos ceducrases que lo guardamos de ello no lo he utilizado nunca ¿alguien lo ha utilizado? es de ayuda páginas de aquí podemos movernos por las diferentes páginas sin salir al parámetro WordPress evitar otras páginas historiales y revisiones se explotan todos ajustes aquí tenemos bueno, a después lo explicamos que si no nos vamos de mala vez este bastante nuevo antes no estaba el global classes manager este bastante nuevo lo han puesto hace poco para gestionar más fácil las clases que ahora después veremos recargar el tiempo para que recargue lo que hay aquí el típico de diferentes tipos de pantalla que incluso lo podemos decir que no, quiero menos pantalla quiero más, quiero no lo sé pero si me he llevado a cabo en algo para cerrar el parámetro de estructura para que no nos moleste si tenemos una pantalla pequeña ¿vale? tema de plantillas aquí si tuvimos plantillas nuestras las podríamos buscar o plantillas comunitarias hay muchas cuando tú guardas una plantilla le puedes decir si es pública o si es privada ¿vale? volver al editor y vista preliminar que es una vista así rápida entonces que te conde todo y lo pueden ver más guay el botón de guardar el botón de guardar es el muy importante el botón de guardar se guarda todo rato si pero que no que no machaca al otro sino que va creando con pocos versiones lo tienes que hacer de datos limpias con un plugin ¿sí es que tengo TOC con eso? si si tienes el TOC y si eres ordenado es mejor desactivar el botón automático siempre ¿cómo funciona la estructura visual CSS de Brits? hay como tres capas, la capa general las clases globales y objeto por objeto una idea única la capa general y obtener aquí en ajustes obtener estilos del tebro aquí podemos crearnos un tema con nuestras clases globales para todo por ejemplo en el clico le digo pues aquí este tema va a ser el tema este nombre aquí a crear le pongo el nombre que le damos ya hemos creado este tema global para todo aquí en condiciones le tenemos que decir donde queremos que se aplique quizá tenemos una web que la mitad es de color rojo y la mitad es de color azul podríamos hacer dos estilos globales y una se haga azul y otro se haga rojo o podemos hacer un estilo global que sea para navidad que hayan cayendo copo de nieve por ahí atrás podemos poner la condición que queramos y sus condiciones que queramos en todo el sitio pero en la página de contacto pues no y ahí no va a estar no va a ser esas clases globales serán otras clases otro tipo de visión de esa web normalmente todos los sitios aquí hay gente que lo utiliza mucho hay gente que lo utiliza poco y yo soy de los que lo utiliza medio empezando a ver eso yo suelo utilizar el general suelo utilizar la paeta de colores y luego del botón y poco más luego el resto lo suelo hacer con clases ccs general por ejemplo aquí puedes coger si quieres un encho completo un boxer pero no el general, era contenido aquí vamos para que lo veáis mejor primero vamos a crear una sección pues si no lo vamos a ver nada creemos una sección, ya se me ha creado la sección el contenedor, siempre se me crea la sección y el contenedor porque la sección sería todo y el contenedor normalmente va encajado en el centro pero por defecto te dejo a escuchar si quieres un flex o un grip no puedes escoger el tipo de ccs pero si tienes que lo especificar por defecto te lo pones en flex flex por defecto te lo pones en flex pero después te puedes decir no, no quiero grip o quiero bloc o que no se ve algo por defecto te lo dejas en flex incluso si dices no, no yo que quiero un giro super grande con una imagen de lado a lado el contenedor o poner el tebrencho 100% contenedor y poner ahí una imagen de fondo a lado a lado por ejemplo lo que estamos voy a poner un color para que lo veais vamos a esto a esconderlo le pongo un color de fondo azul por ejemplo y al contenedor un color de fondo rojo vale ahora si vamos a estilos globales que es donde estábamos si yo les digo que el contenido por ejemplo tenga un margen de 20 y 20 ya me esta dejando una separación pero es que el contenido lo era estoy perdido no era en boxe aquí de full width no, pero esto es el bueno como es el porque estás tocando no he visto lo que ha llegado a tocar lo que quería yo es que el contenedor aquí contenedor cojones no contenido el contenido es todo esta sección es el contenedor aquí si el contenedor le digo que me ocupe un máximo 98% siempre será 98% la pantalla siempre sea el dispositivo que sea siempre me deja un margen al lado ves que la sección ocupa más incluso le puedo decir no lo es que el móvil un 98 un móvil si, esta bien pero un ordenador quiero un 94 que me queda un poco mal de espacio y el móvil si, le quiero un 98% por siendo y así puedo decirle como serán todos mis contenedores todos mis contenedores de la web a no sé que le diga lo contrario tendrán ese margen lateral a los lados, siempre esto está bien porque ayer pasaba mucho que en ordenadores pequeños no le ponías y te quedaba el texto super pegado tienes que dejarlo en margen porque respiró un poco si no era todo super pegado, patallas pequeñas si normalmente te aproximas más pero no del todo porque entonces me queda pegado la sección lo mismo si la sección le queremos dar un poco de aire por arriba y por abajo le podemos dar un relleno a la sección por ejemplo, para que toda la sección por defecto serán así luego podemos decirle que la sección en concreto no tenga margen pero la mayoría serán así serán este margen y el contenido el rojo y el contenido ¿vale? tema de colores por ejemplo cuando vas a poner cualquier sí, pero esto es para poner unos colores como unos presentes colores que luego te vas a cogerlos cuando vas a poner un botón te dice presentes colores primarios presentes secundarios presentes que son demasiado por ejemplo si vas a cualquier botón botón y vas a color del fondo aquí te sale la paleta de colores esta la que suelo editar y la suelo dejar a mi gusto por ejemplo todos estos colores que hay aquí nuevamente no los utilizas pues te los cargas te los cargas te dejan los que te gusten los que tu necesitas para esa web por ejemplo este campoco y ahora imaginaos que quiero este pero con un transparente y lo puedo guardar ya tengo otro color incluso le puedo poner un nombre fondo transparente y lo guardo ¿vale? los colores restablecidos que son todos los editores visuales aquí hemos visto voy a dejar esto en blanco ya aquí hemos visto primero las clases globales estas clases son las que se aplicarán a toda la web por defecto luego cuando estamos editando cualquier cosa por ejemplo voy a editar esta sección voy a ir cogiendo la sección esta marcada yo le puedo decir que esta sección no tenga ese margen que hemos dado de Paddy arriba y abajo relleno de este caso le ponen relleno le puedo decir que no, que quiero cero y ya no tiene relleno esta en concreto esto sería a esta solo le puedo hacer una clase global que sería clase global sin Paddy sin relleno aquí es donde está la clase que estamos afectando en este caso Bricks te crea una clase random un número único para ese elemento yo le puedo introducir una clase que esa clase les pueda aprovechar para otras cosas le puedo decir aquí sin relleno y ahora tengo esa clase creada una clase global que puedo utilizar en todos lados ves que está amarillo aquí marcado, es que estamos editando esa clase a mi me pasa que a veces ha habido mucho yo he cambiado la clase entera y luego que lo ha cambiado la clase he cambiado la clase entera y no quería cambiar la clase entera si lo quería cambiar una cosa en concreto por ejemplo lo tenía en la solo con un título que la clase era tipo blanca tipografía blanca es tipografía blanca ya está, punto no más y me equivoqué lo tenía seleccionada sin amarillo y le puse un Paddy en inferior de 30 y luego cuando voy a ir a toda la web todos los títulos de esta banda lo que era ese Paddy de 30 tienes que ir por P quitarla y modificarla por ejemplo si ya la digo sin relleno cero y cero y esto lo podemos aprovechar para todo lo que queramos incluso al botón si un botón le ponemos en la clase sin relleno se te la ha pegado vale y ahora tenemos guardada y ahora todo lo que quiero hacer para solo este en concreto le tengo que quitar la clase global que no esté aquí activado pues ahora quiero ponerle un marge o sea el elemento ahora quiero poner un marge en inferior lo que queramos esto es un tema de clases ahora queda más o menos claro clases globales generales, globales y particulares digamos así una pregunta, la clase que estás editando sobre la cual estás actuando ahora mismo la puedes editar para ver las propiedades ahora mismo estoy sin clases estoy utilizando esa sección en concreto pero lo estás haciendo de manera visual con la columna de la izquierda pero si quieres acceder al código supongo con este botón de ahí nuevo se podría pero no lo seleccionas sin relleno si pero dice sin el visual si le doy sin el visual si le doy yo creo que lo has añadido esto es una gestión de clases pero aún no he tocado una pregunta no he llegado yo es que lo uniré y a priori no tiene la sed no se puede editar no puedes añadir texto renomber, duplicar a veces hay más de saber como las propiedades se encajan para que entiendes como el constructor lo bueno es que cuando tú lo activas te marca con un puntito amarillo lo que se ha tocado en esa la que estoy rectitando con lo cual yo puedo desactivar y al comodigandese le reactivo ahí borro el puntito amarillo y se van si no tienes que ir buscando que propiedad de IT con lo que tiene en el punto amarillo la que te agitaba ahora que estoy con la ID la sección ya me dice que está el fondo y el diseño y si clico, me dice que está el margen y en el fondo está el color del fondo yo puedo hacer de clic aquí que me lo cargo puedo mover atrás que lo hemos visto antes puedo cargarme el margen que lo había puesto arriba y abajo es eso hay que saber un poquito más el código, saber los nombres ¿qué más tenemos por aquí? aquí tenemos todas las cosas que podemos añadir también deciros que Blix se lleva muy bien con Cloud Lock, Checking Giant etc que te permita hacer contenido binámico te permita hacer cursos post types pero por ahí no podía hacer a mano sin problema, también te permite proceder bastante bien va, va bien tenemos una sección con un contenedor dentro de ese con el contenedor podríamos poner bloques por ejemplo, que vamos a hacer dos columnas un bloque y otro bloque pero no están debajo, no están dentro del contenedor ¿viste que están debajo? tendría que ponerlas dentro del contenedor pero claro, se me quedan investigados y yo quiero columnas se me quedan una debajo otra en el contenedor le puedo decir que el diseño o sea el contenido sea horizontal va ya lo tenemos dos columnas ¿qué es una columna que se llama grande? puedo decirle que esa columna tenga un ancho un ancho píxeles código un 70% lo que queráis puedo decirle por ejemplo que esta sea un 70% y esta sea no puedes seleccionar tu la medida que por ejemplo en elementos si tienes el botoncito que dice como lo que es en pixel, en vh no, tienes que poner tu tienes que poner pixel, vh en las versiones anteriores de drill se hace así hasta fórmulas rem la cal hay que saber más pero se puede meter todo tienes que poner 30 y adepones lo que quieres rem, en, porcentaje píxeles, lo que sea si lo ponen nada son píxeles por defecto es píxeles pero si quieres algo en concreto tienes que poner lo que quieras en concreto pero también es más cómodo si yo te quería hacer números píxeles, boton, seleccionar si, porque luego en próximas actualizaciones si brith cambia y te cambia el port defecto, ya no es píxeles ya es porcentaje te ha cambiado todo la web, si tu no tienes escrito no te lo cambia mi dios que tenemos los dips que son un dip sin espacio, sin nada lo único que cambia entre el contenedor, la sección y el bloque y el dip es que esto ya miren premeditados las secciones el bloque te viene que ocupa el espacio que tiene que pueda, sabes te vienen ya premeditados pero podrías hacer todo con dips si quieres, dip, dip, dip realidad son dips que yo este bloque en concreto, quiero que sea clicable, que sea un enlace le puedo decir que sea un enlace y todo este bloque de aquí este de aquí, que lo voy a poner un color para que lo veáis voy a poner un color de fondo así este bloque de aquí ahora mismo es un enlace que le puedo decir donde quiero que vaya le puedo decir que vaya a una página interna que sea y ahora mismo esto, si le vamos a verlo en vale no se ve porque no hay contenido al no tener contenido, no tener un hecho mínimo no te lo muestra si yo le digo que el contenedor tenga un alto mínimo de 200 píxeles yo creo que ahora me lo mostrará porque es un título si, metemos algo dentro, espérate vamos a meterle algo dentro vamos a meterle un título, entonces sí que me lo pillo también se puede arrastrar, que antes no lo he explicado se puede arrastrar el contenido, para eso hay que funcionar demasiado no, a mí me gusta más la antigua sanción ahora sí y todo, veis que es un botón que le puedo publicar, todo es un enlace todo la previsación a veces queda un poco en este caso por ejemplo pero porque te muestra un ancho este de esto de aquí no tiene ancho si le pones un título aquí meto un título aquí porque como está vacía le pones un ancho que es ficticio porque es cero porque no hay contenido adentro qué más tenemos fuera aquí tenemos el encabezado típico que incluso pueden ser dinámicos si este encabezado puedes escribirlo a mano o en rayito le podemos decir dinámicamente qué queremos de todo sea increíble lo que queráis y le puedes decir qué etiqueta tiene ese título controlamos todo, para lo bueno y para lo malo controlamos todo podemos decir qué etiqueta queremos incluso si queremos que ese título le hace algo tenemos texto básico texto rico texto link aquí los tres se pueden convertir en uno el básico no te deja hacer nada solo escribir el rico es el típico W te permite poner negritas te permite editarlo un poquito y el otro te permite poner un enlace texto luego está el botón te lo vamos a poner aquí un botón un botón, muy chulo aquí es donde están los estilos que nos muestran de los precios aquellos de colores para botones también hay presence puedes configurar diferentes presence de botón en los estilos globales y luego cambiarán todos los botones que sean primadrio, todos los que sean secundario todos los que sean o incluso dejarlo vacío y poner el de base estilos globales vamos a botón aquí está el por defecto y abajo está el primadrio, el secundario claro, no sé qué, no sé cuánto por utilizar cuántos como quieras por ejemplo si al por defecto le digo que el color de fondo sea blanco que el borde sea radio cero lo quiero ¿dónde está viendo el radio? ¿dónde está ya la la televisión? sí hay que tener algunos pequeños cerraris que dices ¿dónde hay a cargar la rueda del cargar? ya, el primero lo he guardado no lo está pillando este caso no lo está pillando algo ahora por ahí la tipología le puedo decir se la quiero en mayúsculas si quiero un mejor de la fuente más grande lo te quiero hay cosas que antes de cargar la rueda que antes de cargar la página entera y el mejor te lo pido si a veces tiene pequeños bugs así que dices en este caso te está dejando el botón otra opción sería ponerle una ponerle el botón que he dejado sin estilo, ponerle el primadrio es raro porque ah, mira aquí vestimos sin querer ¿ha visto que se va te marcado? claro, te voy a ir machacando los efectivos ya está, mira este este aquí vale luego el bloque le podemos decir como queremos que se que se comporte en aquí el flex, el grip etc, por ejemplo ahora mismo está todo arriba, a izquierda por le podría decir no, no, yo lo quiero centrado o lo quiero que se expanda en todo eso no es espacio es espacio si está, lo tienes pegado si miras que hacer el contenido más grande el contenido más grande más ancho el bloque, el bloque dale una altura un poco pero ya tiene una altura ahora ahora vale, como no tengo una altura sin nada no te lo ponía cierto, entre todos nos hacemos uno espacio arriba y abajo menos más espacio o a pegado que luego digo a pegado pero quiero un pequeño margen de arriba y abajo en CSA se le puedo dar un relleno de 30 30 es súper maquitable qué más tenemos por aquí, hemos dejado, vídeo, imagen, lo típico icono menú encajable de menús hay dos encajable y el normal el menú normal es el típico que hacemos desde la apariencia menú y el encajable es como más personalizable, lo puedes personalizar como más, uno dentro de otro te crea como esto naflin, no sé qué, otro desplegable yo no sé hasta qué punto depende del menú que quieras hacer si quieres hacer un mega-menú si quieres hacer un mega-menú si quieres hacer un mega-menú y eso sí qué más unos cambas es típico que cuando hemos dejado un desplegable, alternar hay miles, hay miles pestañas vamos a ver otro más interesante que son los schooly looks en el evento lo he llevado creo que habrá ya así si, lleva ya algo de serie como le llaman creo que es listing si en el evento le he dado de boledad pero tienes que puedes crearlo tu también como donde este bol de aquí, supongo veremos pero también te permite crearlo tu como como quieras ser el listing es más básico del mentor cuando te lo provees era básiquito vale, vamos a crear una sección nueva una sección, otra nueva aquí abajo y aquí tenía tengo por ejemplo, uno de testimonios tengo un cpt de testimonios no estoy hablando mucho donde hay testimonios que me han dejado gente donde está el nombre el texto que me ha dejado la web y el nombre de la web, el link si vale podemos hacer que se vea en esto dinamicamente por ejemplo vamos aquí y ahora le digo, le creo dentro de esto le creo un div otro div eso sí que me aquí al primer div le vamos a hacer un query loop le llaman aquí query loop que será entradas y será testimonios si era dentro de esto le meto un texto para que lo veáis le meto un encabezado veis que ya me saca varios encabezados pero todos son el mismo porque no le he dicho solamente que quiero que muestre dinamicamente el tiro de la estrada tienes frío ya me muestran todos los nombres de todas las reseñas que tengo veis todas le puedo decir que no me muestre todas que me muestre 10 le puedo decir que me muestre 5 me muestra 5 le puedo poner tanto contenido como yo quiera de ese custom que tengo vale y la gracia también es que puedo utilizar la tipo de css clip que es muy editable por ejemplo el básico sería esto luego hay cosas tanto por cientos y historias pero podría hacer por ejemplo de tres filas tres filas iguales se convierten en filas iguales en este caso sería guay ponerle que fuera en 6 que quede con besito 6 le puedo decir que dentro de cada de esto me ponga un título un texto que el texto será dinamicamente el contenido de la entrada que es donde está escrito lo que me han dicho cada uno si es que ahí tendríamos pa' horas que pudiéramos estar aquí para el 50,000,000 y todavía nos faltaría le puedo dar un poco de relleno le puedo aplicar el relleno con lados con este botoncito de aquí que no lo he aplicado lo puedo bloquear con lados vale le puedo decir que el dif este este aquí flex y que me lo ponga todo vertical y centralito y el texto, también centralito puedo ir al texto flex aquí no sé si me lo pilla, aquí no tengo que ir al texto tipoografía centralita por ejemplo le podríamos poner un color de fondo ya te digo, aquí tenemos para lo que queráis bueno es que diseñan lo que tú quieras dentro de ese vídeo metes imágenes en medio de escorchet cosas todo dinamicamente lo cogen de la cuerda que tú lo has hecho es brutal efecto el primer post que siempre lo pone así extraño lo pone con los scorchetes pero luego nos sale así lo consigo a saberlo sale normal vale que quiero dejar un espacio entre todas las columnas tengo en el contenedor que le he dicho el grip tengo el gap, que es el espacio entre columnas y se deja un espacio entre todas el grip es bastante nuevo y es una pasada si deje un espacio y pones espacio 10 a 9 si te hacen las verticales aquí tiene espacio 10 no es que el css, el gap te permite poner 2 y es el vertical y horizontal aquí no lo aplicaran seguro lo que te mía más abajo o no lo tiene con un gap y todo eso no lo tiene más abajo igual si lo tiene más abajo para hacerlo separado ah, ya me hay más abajo ah, eso es en el flex cambiar el orden es decir, este quiero que vaya antes, este quiero que vaya después o sea, hay mucha historia en grip es una pasada y aquí también te permitía decirle, quiero que hay sean 3 columnas pero un mínimo de 200 px cada columna yo no lo he hecho y he estado guay pero en cuanto vas reduciendo la pantalla automáticamente se adapta en este caso sería lo típico es que venirte a móvil y decirle no no quiero 3, quiero 2 quiero 1 y 2 siguiendo el columna es más básico tengo 2 y para que quede la caja con la misma altura todas si, le podríamos decir que esta caja tenga un alto de mínimo por ejemplo de un alto fijo de 50 por ejemplo si aprendes un poco de SSS es una pasada y lo que hablamos al principio esto es lo que hemos hecho si vamos a inspeccionar en el código inspeccionamos quito la versión móvil y esto voy a poner de bajo aquí este encabezado es un H3 que está dentro de una caja que está dentro de una sección o sea dentro del contenedor, perdonad dentro de la sección y dentro de todo el contenido y esto, no hay más, aquí está el G el G, el body el sección y es adentro de una A porque ha dicho que es un enlace el enlace es una A si no no tendrían y este de aquí es un H1 porque hemos dicho que fuera un H1 que tiene las extensiones del mentor contra alguna cosa y se lo tiene en el código esencial un H1 no tiene para que la imagen es que el elemento te hacía tres cajas adicionales por cada elemento es que va a buscar los elementos que necesito ahora buscare un H1 de 100.000 productos un H1 super mal de BecheSpeed hecho con Brix que lo hemos re hecho ahora super bien de BecheSpeed con un montón de productos en la página de inicio con un montón de historias y carga a 80 pico 90 de BecheSpeed super bien por qué haces lo que tú quieres no haces lo que tú quieres el elemento le está transformando está poniendo clases globales, está haciendo cosas por que han visto que se les come se les come voy a aprender ahora a priori puede decir tengo que aprender CSS si yo con el elemento le hace con bastante pero es que eso te ayuda en el futuro cuando tú te encuentras con una cosa que no puedes apreciar coges CSS muchas veces he tenido que a la hoja de estilo CSS y aplicar ahí una regla porque es imposible hacerlo entonces tú si sabes CSS pues ya, no tienes límite siento sido un poco rápido un poco de esto pero hay vídeos, hay uno en youtube que hace vídeos que están muy bien de Brix gratuitos luego si no está la máquina de branding que es donde pago y no tengo miedo poco a poco vais aprendiendo con él y nosotros iré poniendo más hay lo que falta quizás lo chulo para tener un acordeón el slide el slide encajable si, el acordeón que permite maquetarlo dentro cada elemento lo que tú quieras lo que te hace es que lo haces tú como quieres creo una sección y creo aquí un slide encajable y ya te crea te crea el slide encajable con cada diapositiva lo que es y tú lo que dice él puedes poner en cada diapositiva lo que te dé la gana todas las cosas que quieras dentro pero el primero le acabas diciendo que es un query loop la primera diapositiva las otras creo que te las puedes ventilar entonces la dejas una esa que dinámicamente él te lo va a montar como las tarjetitas estas que se amontan pero será tipo slider si le damos a esta y le decimos que esto es un query loop de entradas testimonios y ya está y le ponemos que queremos 4 y le decimos que el encajado sea el título y el botón sea botón será la testimonios la web y el enlace también será dinámico y será yo voy a tope es un hecho con bricks es un slider hecho con bricks guardamos, vamos aquí lo vemos y aquí está la reseña aquí está un botón y tiene el botoncito que le clica si te va a la web de esta tenía que haber puesto a la nota festaña y toda la historia pero lo que dice te permite hacer lo que te dé la gana creo que te permitía hasta código si puedes meter funciones short codes creados tu en sitio de hubo comest si hubo comest igual productos categorías de productos de todo los widgets de hubo comest hay un apartado en general que configura hubo comest pero como no tenía hubo comest ah vale no tienes lo de hubo comest es brutal es lo que más te permite personalizar hubo comest te permite tocar las plantillas de cada cosa pero a un nivel de que lo tocas como si fuera cualquier template como has invitado pero mucho mejor que en el elemento eso es súper importante hemos explicado como crear una página pero no he explicado como crear el header el footer la template de archivo de testimonios eso se hace desde aquí plantillas crea una nueva le digo header le digo que es un header cabecera publico y me voy a editar con bricks ahora editaré la cabecera voy a hacerla muy rápido le pongo aquí una imagen cualquiera solo para que se vea no puedes coger lo que definida pero como dinámica puedes también pero que tienes lo tecas de que ya tengas un gilete ah si, si, si de aquí de plantillas seleccionas de ahí comodidad y aquí le digo tipo de plantilla cabecera y por ejemplo yo me sé contiene el tema, es importante o no contiene en paeta colores una vez has pagado bricks todas las plantillas que hay dentro de la comodidad entiendo que son gratis de ese caso ya me digo esto me digo esto fuera me ha creado aquí una cabecera super guapa para que se vea en toda la web le tenemos que decir donde quemos que se vea, en ajustes tenemos que decir ajustes de plantilla hay unos ajustes especiales para cabecera tipo la cabecera adensiva que se quede siempre que la veas y las condiciones todas las plantillas quiere decir donde quieres que se vea esa cabecera, porque tú puedes ser que en un lado no quieres que se vea el footer, por ejemplo la típica página de instagram, la que pones ahí tipo lin tree, esa no tiene ni cabecera ni footer no tiene nada, pues ya está por ejemplo, en este caso le ponemos que en todo el sitio guardamos y así vamos a ver la página que he hecho antes de test que ya no lo tengo por aquí por ejemplo aquí esta página de test tiene la cabecera y todas las páginas tendrán la cabecera por hecho a todas excepto si excluye es una sí, aquí excluye hay muchas cosas que se llama lin tree la página de lin tree que se está de aquí me invento y le digo que excluye a ver que esa te da un paso más un paso o dos cintos para mí, o excluye por roves por todo, por lo que vais a hacer de todo a mí lo que para mí es lo bueno de bricks es que dominas lo que tú haces no creas un título y son 20 cajas no, un título es un título si ya la creo, aquí abajo me cargo todo esto, eh me lo borro todo y yo pongo un título inseriduro es una h3 creo que lo pones de serie, si es h3 me voy a ver está el título si infecciono es un título ya está dentro del main que te lo crea dentro del contenido punto no hay nada que yo me haya puesto es más óptimo super super pero el elemento lo acabara está mejorando pero tienen faena porque ha hecho hay un caos que te cagas y WordPress que está con el site full editing que también está pegando fuerte lo que hace claro es ser código abierto vamos a despargar pero se podrá hacer también de hecho estamos planteando hacer una pararril del full site editing ¿qué es eso? es el editor que ya prácticamente está de serie WordPress no tienes que añadir ningún builder así el propio WordPress pero algo parecido a Elementor si si puedes editar la cabecera el pie todo absolutamente todo lo que se ve pero en plan elemento en plan bricks pero de momento está verde butenberg cuando salió estaba verde y ahora está bastante bien bueno porque te acostumas y te acostumas a Elementor no os olvidéis no deja totalmente muchas cosas desde Elementor siempre vas más allá bueno básicamente la idea es que cogierais una opción máfica lo probáis