Breve historia de la creaci\u00f3n de dise\u00f1os y maquetaci\u00f3n en WordPress<\/h2>\n
Comprender la evoluci\u00f3n del dise\u00f1o de sitios y maquetaci\u00f3n dentro de WordPress es una parte esencial para apreciar la importancia de FSE. La herramienta clave en la que nos encontramos ahora es el Editor Cl\u00e1sico<\/a>.<\/p>\n Por supuesto, esto no siempre ha sido \u00abcl\u00e1sico\u00bb. Primero fue el editor TinyMCE, por defecto desde la primera versi\u00f3n de WordPress hasta 2018. Se trata de un sencillo editor de texto What You See Is What You Get (WYSIWYG, en espa\u00f1ol Lo Que Ves es lo Que Hay) que te permite introducir contenido y HTML b\u00e1sico, junto con algunos estilos de formato. De hecho, todav\u00eda puedes obtener el Editor TinyMCE<\/a>, ya que es una herramienta comercial:<\/p>\n Los principales inconvenientes del Editor TinyMCE son la falta de opciones de previsualizaci\u00f3n front end y una menor flexibilidad de la que a veces te gustar\u00eda. Los frameworks de temas se convirtieron en una alternativa viable y potente. Por supuesto, Genesis Framework<\/a> de StudioPress sigue con nosotros, pero hab\u00eda algunos otros, como Thesis<\/a>.<\/p>\n Aqu\u00ed puedes ver c\u00f3mo pasamos de la edici\u00f3n de texto al dise\u00f1o web visual. El framework te ofrece opciones en el back-end de WordPress, que te permiten cambiar aspectos del front end. Adem\u00e1s, obtienes m\u00e1s funcionalidad a \u00abnivel b\u00e1sico\u00bb para hacer m\u00e1s cambios, como hooks y filtros<\/a>, soporte para plantillas<\/a> y mucho m\u00e1s.<\/p>\n Sin embargo, esto segu\u00eda sin ser muy accesible para un usuario normal, por lo que se popularizaron los plugins constructores de p\u00e1ginas<\/a>. Los utilizar\u00edas junto con el Editor TinyMCE\/Cl\u00e1sico para disponer de un sistema de arrastrar y soltar para dise\u00f1ar tu sitio. Estos plugins son en gran medida los mismos que en 2011. Divi<\/a> y Beaver Builder<\/a> siguen dominando, aunque Elementor<\/a> tambi\u00e9n es un gigante:<\/p>\n Te conviene leer la siguiente secci\u00f3n para entender por qu\u00e9 hay alternativas al Editor TinyMCE y a un plugin constructor de p\u00e1ginas.<\/p>\n WordPress es el n\u00famero uno<\/a> en popularidad, pero para llegar ah\u00ed ha tenido que defender su t\u00edtulo. A lo largo de los a\u00f1os, muchas otras plataformas han saturado el mercado.<\/p>\n Squarespace<\/a>, Wix, Medium y muchas otras quieren el mismo p\u00fablico y la misma base de usuarios que WordPress, y hasta el Editor de Bloques, todas ten\u00edan una experiencia de edici\u00f3n mucho mejor.<\/p>\n Esta era una gran preocupaci\u00f3n<\/a> para la direcci\u00f3n de WordPress, ya que otras plataformas en ese momento estaban ganando una tracci\u00f3n m\u00e1s visible. La competencia tambi\u00e9n ten\u00eda interfaces modernas, visuales y eficaces, incluso para el simple control del dise\u00f1o.<\/p>\n El Editor de Bloques es una forma modular de construir las entradas y p\u00e1ginas de tu sitio, aunque tambi\u00e9n tiene inconvenientes. Para empezar, su alcance limitado significa que usarlo probablemente requiera un plugin constructor de p\u00e1ginas si quieres hacer cambios \u00abm\u00e1s profundos\u00bb. Tambi\u00e9n seguir\u00edas necesitando conocimientos de desarrollo para construir un sitio completo, lo cual es una barrera creativa para la que el equipo de WordPress tiene una soluci\u00f3n.<\/p>\n La edici\u00f3n completa del sitio de WordPress representa la \u00faltima y mejor forma de desarrollar tu sitio<\/a>. Se basa en el uso de Bloques para componer tu dise\u00f1o, y va m\u00e1s all\u00e1 de las entradas y p\u00e1ginas individuales. En esencia, FSE te permite gestionar todos los aspectos del dise\u00f1o de tu sitio web en WordPress mediante una interfaz unificada e intuitiva.<\/p>\n Esta es ahora la forma \u00aboficial\u00bb de editar tu sitio. Abarca todos los aspectos de tu sitio:<\/p>\n Dada la evoluci\u00f3n del editor, algunas funcionalidades tambi\u00e9n est\u00e1n desapareciendo. Por ejemplo, ya no necesitas \u00e1reas de widgets<\/a>, aunque WordPress a\u00fan las utiliza como funcionalidad heredada para los temas que no son Bloques.<\/p>\n Volveremos sobre lo que la edici\u00f3n completa del sitio de WordPress puede ayudarte a conseguir m\u00e1s adelante. Antes de eso, profundicemos primero en por qu\u00e9 necesitamos FSE.<\/p>\n El equipo de WordPress tiene varias razones para introducir FSE. Algunas de ellas son consideraciones t\u00e9cnicas. Por ejemplo, el Editor de Bloques no nos permite editar todos los aspectos del sitio cuando la funcionalidad deber\u00eda estar ah\u00ed en primer lugar.<\/p>\n Es dif\u00edcil entender por qu\u00e9 se ha tardado tanto en dejarnos trabajar en los estilos de las plantillas<\/a> sin necesidad de c\u00f3digo. Entre el Editor Cl\u00e1sico, los frameworks, los plugins constructores de p\u00e1ginas y el Editor de Bloques, nunca hemos tenido la oportunidad. FSE soluciona esto de forma nativa para WordPress.<\/p>\n Esta simplificaci\u00f3n unifica la experiencia de edici\u00f3n y la pone bajo el control del equipo central de WordPress en lugar de desarrolladores externos. Tambi\u00e9n significa que la curva de aprendizaje es consistente. Entre el contenido, la maquetaci\u00f3n y el dise\u00f1o, tienes una experiencia familiar<\/a> de una pantalla a otra.<\/p>\n Esta experiencia tambi\u00e9n aporta longevidad. La edici\u00f3n completa del sitio de WordPress no desaparecer\u00e1; simplemente evolucionar\u00e1 con el tiempo. Esto proporciona a la plataforma una base para adaptarse a lo que el equipo de desarrollo principal desee aportar a WordPress.<\/p>\n En general, este empoderamiento se extiende desde los desarrolladores hasta los usuarios finales. La edici\u00f3n completa del sitio de WordPress ofrece a todos un mayor control sobre los cambios de dise\u00f1o que deseen realizar sin depender de desarrolladores, personalizaciones complejas o conocimientos de programaci\u00f3n.<\/p>\n Para el equipo de WordPress, FSE no es s\u00f3lo el presente, sino el futuro de la plataforma. Sin embargo, necesitar\u00e1s un tema compatible para utilizarlo (de lo que hablaremos m\u00e1s adelante). Es m\u00e1s, puede que otras empresas de WordPress no est\u00e9n de acuerdo, especialmente las que tienen productos de la competencia.<\/p>\n Por ejemplo, los desarrolladores web de WordPress argumentar\u00edan que confiar el dise\u00f1o de tu tema<\/a> a alguien con experiencia es una buena idea. Estar\u00edamos de acuerdo en muchos casos, especialmente si tienes necesidades complejas, el presupuesto adecuado y tiempo.<\/p>\n Por supuesto, el Editor de Bloques sigue siendo viable para la mayor parte de la creaci\u00f3n y personalizaci\u00f3n de contenidos. El salto de esto a la edici\u00f3n completa del sitio ser\u00e1 s\u00f3lo un peque\u00f1o salto, y es probable que ya lo utilices:<\/p>\n Muchos usuarios recurrir\u00e1n al Editor de Bloques en su mayor parte y luego incorporar\u00e1n otra soluci\u00f3n. A\u00f1adir un plugin constructor de p\u00e1ginas proporciona algunas de las funcionalidades<\/a> de las que carece el Editor de Bloques. Divi, Elementor, Beaver Builder, Brizy<\/a> y muchos m\u00e1s tienen grandes conjuntos de funcionalidades y permiten personalizaciones y desarrollos m\u00e1s profundos:<\/p>\n Para una experiencia diametralmente opuesta a la edici\u00f3n completa del sitio en WordPress y un regreso a donde todo esto empez\u00f3, podr\u00edas optar por un CMS completamente nuevo: ClassicPress<\/a>.<\/p>\n La filosof\u00eda del proyecto es que la evoluci\u00f3n de WordPress es una gran idea, aparte del Editor de Bloques y, por extensi\u00f3n, FSE. Como tal, el fork de ClassicPress no lo incluye. En su lugar, crear\u00e1s sitios utilizando el Editor Cl\u00e1sico o TinyMCE, como en el pasado.<\/p>\n Es esencialmente una soluci\u00f3n \u00fanica a la inmadurez del Editor de Bloques en su primer lanzamiento. En su momento, el concepto ten\u00eda sentido te\u00f3rico. Sin embargo, dada la experiencia de edici\u00f3n actual de WordPress, hay pocas razones para optar por ClassicPress.<\/p>\n En pocas palabras, la edici\u00f3n completa del sitio de WordPress extiende la funcionalidad del Editor de bloques a todo tu sitio. Para utilizar FSE, necesitas un \u00abtema de bloques\u00bb o \u00abtema FSE\u00bb que lo soporte. Hablaremos m\u00e1s sobre esto m\u00e1s adelante.<\/p>\n A grandes rasgos, el funcionamiento de FSE es sencillo:<\/p>\n La mayor\u00eda de los usuarios no utilizar\u00e1n una versi\u00f3n de WordPress anterior a la 5.9, pero si es as\u00ed, tendr\u00e1s que actualizarla para aprovechar FSE. Como hemos indicado, tambi\u00e9n necesitar\u00e1s un tema compatible. Hablemos de esto r\u00e1pidamente.<\/p>\n Afortunadamente, elegir un tema de bloque<\/a> requiere el mismo nivel de cuidado que cualquier otro tipo de tema. Tendr\u00e1s que fijarte en algunas facetas objetivas para asegurarte de que descargas una soluci\u00f3n s\u00f3lida:<\/p>\n Dado que la edici\u00f3n completa de sitios en WordPress es una novedad en la plataforma, tienes a tu disposici\u00f3n menos opciones de temas. Sin embargo, esto no significa que la calidad sea dif\u00edcil de encontrar. Muchos grandes desarrolladores tienen su propia versi\u00f3n de un tema FSE\/Bloque. Uno de los primeros fue la versi\u00f3n FSE de Neve<\/a> de ThemeIsle:<\/p>\n La versi\u00f3n \u00abtradicional\u00bb o \u00abcl\u00e1sica\u00bb del tema utiliza el antiguo Personalizador de la pantalla Apariencia<\/strong><\/b>. Esta versi\u00f3n incorpora el Editor de Sitios en su totalidad y ofrece un mejor rendimiento subjetivo.<\/p>\n Hay otros temas en bloque a tener en cuenta, como Portfolio WP<\/a> y Mugistore<\/a>. Sin embargo, Ollie<\/a> es probablemente el mejor de todos:<\/p>\n Se compromete con la edici\u00f3n completa del sitio de WordPress sin dudar. Dispone de un agradable asistente de incorporaci\u00f3n, e incluso tiene una versi\u00f3n premium que incluye montones de elementos y plantillas de la Biblioteca de Patrones.<\/p>\n Incluso el tema predeterminado Twenty Twenty-Four<\/a> es ahora una opci\u00f3n viable para tu sitio:<\/p>\n La capacidad y profundidad del Editor de Sitios nos permite construir sobre (y ampliar) temas que a menudo requieren mucho c\u00f3digo y recursos. Democratiza la capacidad de construir y desarrollar temas, y la interfaz principal es el primer punto de contacto para ello.<\/p>\n Para encontrar el Editor de Sitios, ve a Apariencia > Editor <\/strong>dentro de WordPress:<\/p>\n Esta pantalla es bastante sencilla. En la parte derecha, ver\u00e1s la vista previa del dise\u00f1o. Puedes hacer clic en ella para abrir la interfaz del Editor de Sitios para tu p\u00e1gina de inicio. A la izquierda hay una serie de enlaces a otras p\u00e1ginas de edici\u00f3n para tareas espec\u00edficas. En breve veremos en profundidad estas pantallas.<\/p>\n Antes de entrar en cada una de las cinco pantallas de FSE, ten en cuenta que puedes salir del Editor de Sitios mediante el logotipo de WordPress situado en la esquina superior izquierda de la pantalla. Como alternativa, puedes hacer clic en la flecha \u00abatr\u00e1s\u00bb de la p\u00e1gina principal de Dise\u00f1o <\/strong>:<\/p>\n Una vez aclarado esto, pasemos a utilizar FSE.<\/p>\n Ahora examinaremos cada pantalla del editor de sitios en el orden en que aparece en su navegaci\u00f3n. De hecho, \u00a1esto nos lleva a hablar de esa pantalla!<\/p>\n La p\u00e1gina Navegaci\u00f3n sustituye a la pantalla Apariencia > Men\u00fas<\/strong>. Una vez que entres en ella, ver\u00e1s una lista de entradas y p\u00e1ginas de tu sitio:<\/p>\n Si se trata de un sitio nuevo, aqu\u00ed ver\u00e1s todas tus entradas y p\u00e1ginas. Esto puede resultar confuso porque representa tu men\u00fa de navegaci\u00f3n principal. Cerca del encabezado Navegaci\u00f3n, abre el men\u00fa Acciones<\/strong>. Esto te dar\u00e1 opciones para editar el men\u00fa, cambiarle el nombre, borrarlo o duplicarlo:<\/p>\n Si haces clic en Editar<\/strong>, se abrir\u00e1 una versi\u00f3n del Editor de Bloques que contiene tu men\u00fa como Bloque de Navegaci\u00f3n:<\/p>\n En la barra lateral, tienes opciones para mover cada entrada hacia arriba o hacia abajo, eliminarla del men\u00fa o crear un submen\u00fa a partir de ella:<\/p>\n Cada entrada del men\u00fa utiliza un Bloque de Enlace de P\u00e1gina, que tendr\u00e1 sus propias opciones. Tienes ajustes de formato inline, junto con ajustes de estilo de la barra lateral:<\/p>\n Ten en cuenta que aqu\u00ed puedes a\u00f1adir im\u00e1genes inline, submen\u00fas y mucho m\u00e1s. Es m\u00e1s flexible que la forma cl\u00e1sica de crear navegaci\u00f3n. Para a\u00f1adir simplemente un elemento al men\u00fa, haz clic en el icono M\u00e1s<\/strong> y selecciona tu entrada o p\u00e1gina:<\/p>\n Una vez guardados los cambios, ver\u00e1s que la navegaci\u00f3n refleja tus retoques. Para crear m\u00e1s men\u00fas, puedes utilizar el enlace Acciones > Duplicar<\/strong> en la p\u00e1gina Navegaci\u00f3n.<\/p>\n La pantalla Estilos<\/strong> es la forma en que controlas el aspecto de tu sitio a nivel global. La barra lateral ofrece unas cuantas paletas diferentes y ajustes de tipograf\u00eda para distintos dise\u00f1os:<\/p>\n Si haces clic en cualquiera de ellas, ver\u00e1s el dise\u00f1o en su lugar en tu sitio. Sin embargo, en la parte superior de la barra lateral hay un icono en forma de \u00abl\u00e1piz\u00bb<\/strong> para realizar m\u00e1s cambios en el Editor de Sitios:<\/p>\n Cada una de las opciones de la barra lateral abarca colores, dise\u00f1os, tipograf\u00eda e incluso ajustes de sombra. Por ejemplo, puedes seleccionar fuentes para todo el sitio y aplicarlas a varios elementos de tu dise\u00f1o:<\/p>\n Profundizar en los men\u00fas a menudo te dar\u00e1 m\u00e1s opciones con las que jugar, como espaciado, colores y m\u00e1s. La secci\u00f3n Dise\u00f1o <\/strong>te permite personalizar las dimensiones de tu \u00e1rea de contenido principal, junto con el relleno y el espaciado entre bloques:<\/p>\n Si quieres ver c\u00f3mo quedan estos cambios sin navegar por tu sitio, puedes utilizar el icono del \u00abojo\u00bb para abrir el Libro de Estilo. Es una pr\u00e1ctica herramienta de visualizaci\u00f3n que encantar\u00e1 a los dise\u00f1adores:<\/p>\n Por \u00faltimo, aunque no nos centraremos en ello aqu\u00ed, tambi\u00e9n puedes personalizar el aspecto de cada Bloque de tu sitio. Por ejemplo, puedes basarte en el estilo global de un Bloque de P\u00e1rrafo. De nuevo, cuando termines, puedes guardar tus cambios, y \u00e9stos se aplicar\u00e1n a tu sitio.<\/p>\n Antes de pasar a la siguiente pantalla de FSE, debes conocer el archivo theme.json<\/strong><\/a>. Se trata esencialmente de la versi\u00f3n para desarrolladores<\/a> de las pantallas de Estilos.<\/p>\n Te permite definir los estilos predeterminados para tu sitio y sus Bloques, y lo utilizar\u00e1s como archivo de configuraci\u00f3n. Adem\u00e1s, utiliza el formato JSON<\/a>, por lo que ofrece una experiencia menos pesada en cuanto a c\u00f3digo que en el pasado.<\/p>\n En \u00faltima instancia, debes saber que todo lo que puedas hacer en theme.json<\/strong>, tambi\u00e9n podr\u00e1s hacerlo en el Editor de Sitios.<\/p>\n La pantalla P\u00e1ginas<\/strong> duplica la funcionalidad de las pantallas cl\u00e1sicas Entradas y P\u00e1ginas del panel de control de WordPress. Por ejemplo, ver\u00e1s una lista de estados que filtran tus p\u00e1ginas en Publicado<\/strong><\/strong><\/strong>, Programado<\/strong><\/strong><\/strong>, Borradores <\/strong><\/strong><\/strong>y otros:<\/p>\n Cada p\u00e1gina tiene acciones adicionales, como Editar<\/strong>, Ver<\/strong><\/strong>, Renombrar <\/strong><\/strong><\/strong>y Borrar<\/strong><\/strong><\/strong><\/strong>. Tambi\u00e9n puedes editar una p\u00e1gina utilizando el icono del \u00abl\u00e1piz\u00bb. En la parte superior de la lista, hay un bot\u00f3n A\u00f1adir nueva p\u00e1gina<\/strong><\/strong><\/strong><\/strong><\/strong> que hace lo obvio.<\/p>\n Si ya utilizas el Editor de Bloques, estas pantallas te resultar\u00e1n m\u00e1s familiares. Sin embargo, aunque aqu\u00ed tienes la misma funcionalidad que habitualmente, el Editor de Sitios te ofrece algunos Bloques de Temas<\/a> adicionales para ayudarte a construir tu sitio. \u00c9stos incluyen casos de uso t\u00edpicos como a\u00f1adir un logotipo del sitio, navegaci\u00f3n, autores, comentarios y mucho m\u00e1s:<\/p>\n Uno de ellos \u2014 el Bloque de Bucle de Consulta<\/a> \u2014 puede ayudarte a realizar tareas para las que a menudo necesitar\u00edas PHP. Por ejemplo, como te permite mostrar entradas bas\u00e1ndote en par\u00e1metros espec\u00edficos, podr\u00edas mostrar tus \u00faltimas entradas o incluso crear un portfolio. Sin embargo, nada de esto puede suceder sin las dos \u00faltimas pantallas del Editor de Sitios.<\/p>\n Las plantillas<\/a> son un elemento b\u00e1sico del desarrollo de WordPress. Son dise\u00f1os reutilizables que te ayudan a definir la estructura de las distintas partes de tu sitio. Normalmente se necesitan conocimientos de PHP, pero puedes personalizarlas todas (y crear otras nuevas) sin c\u00f3digo dentro del editor del sitio.<\/p>\n Trabajar con plantillas sigue el mismo enfoque que con las entradas y las p\u00e1ginas: utilizar\u00e1s el Editor de Sitios para a\u00f1adir Bloques a la plantilla y luego guardar los cambios. Por supuesto, \u00e9stos se aplicar\u00e1n a todas las p\u00e1ginas que utilicen la plantilla en cuesti\u00f3n.<\/p>\n Para crear una nueva plantilla, haz clic en el bot\u00f3n A\u00f1adir nueva plantilla<\/strong>:<\/p>\n Esto te llevar\u00e1 a trav\u00e9s de un asistente r\u00e1pido para seleccionar el tipo de plantilla que deseas crear y un Patr\u00f3n de Bloques adecuado para iniciar el dise\u00f1o. Estos patrones son el tema central de nuestra \u00faltima secci\u00f3n.<\/p>\n Los Patrones de Bloques son colecciones relacionadas de Bloques que cumplen funciones espec\u00edficas en tu sitio. Por ejemplo, puedes introducir un patr\u00f3n de cabecera completo con logotipo, navegaci\u00f3n y t\u00edtulo del sitio:<\/p>\n Crearlos<\/a> es sencillo, aunque, sin el editor del sitio, tendr\u00edas que registrar estos patrones utilizando PHP. Ahora, sin embargo, puedes utilizar la p\u00e1gina Patrones<\/strong>:<\/p>\n En la parte izquierda, ver\u00e1s todos los patrones disponibles divididos en carpetas llamadas \u00abtipos\u00bb Son una forma estupenda de construir r\u00e1pidamente el dise\u00f1o de un sitio, y a menudo tienen un aspecto fant\u00e1stico.<\/p>\n El bot\u00f3n A\u00f1adir Nuevo Patr\u00f3n <\/strong>abre el editor y te permite crear esas secciones t\u00fa mismo. Esto te permite crear elementos reutilizables para tu sitio, lo que representa una forma sostenible y autosuficiente de desarrollar sitios para ti y para cualquier otra persona con la que trabajes.<\/p>\n Hay mucho en lo que sumergirse cuando se trata de la edici\u00f3n completa del sitio de WordPress, y no podemos abarcar todo lo que puedes hacer con \u00e9l. Sin embargo, podemos darte algunos consejos para sacar el m\u00e1ximo partido a FSE.<\/p>\n Por ejemplo, puedes exportar tus plantillas y estilos para reutilizarlos en otros sitios. Para ello, entra en el editor del sitio para cualquier entrada o p\u00e1gina y haz clic en el men\u00fa Opciones<\/strong> de la barra de herramientas superior. En el men\u00fa desplegable, elige Exportar<\/strong><\/strong>:<\/p>\n Esto te dar\u00e1 un archivo ZIP de tu tema, y si necesitas importarlo<\/a>, puedes hacerlo utilizando el plugin Importador de WordPress<\/a>.<\/p>\n![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/classic-editor_1.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/tinymce-editor.png\")
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/genesis-framework_1.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/elementor-page-builder_1.png\")
El Editor de bloques y la edici\u00f3n completa del sitio de WordPress<\/h2>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/wix-editor_1.png\")
Qu\u00e9 es la edici\u00f3n completa de tu sitio en WordPress: (FSE, full site editing)<\/h3>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/full-site-editing.png\")
\n
Por qu\u00e9 FSE est\u00e1 en WordPress<\/h2>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/templates-pages.png\")
Las alternativas a FSE<\/h3>\n
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/theme-development.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/block-editor-1.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/page-builder-screen.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/classicpress-homepage.png\")
C\u00f3mo funciona la edici\u00f3n completa de WordPress<\/h2>\n
\n
Elegir un tema de FSE adecuado<\/h3>\n
\n
![\"El](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/neve-fse.png\")
![\"Un](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/ollie-theme.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/twenty-twenty-four_1.png\")
Recorriendo la interfaz principal de FSE<\/h3>\n
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/editor-link.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/back-arrow.png\"){kind=icon}
Los 5 pilares de la edici\u00f3n completa de sitios de WordPress<\/h2>\n
1. Navegaci\u00f3n<\/h3>\n
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/navigation-screen.png\")
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/nav-more-items.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/nav-block-editor.png\")
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/nav-sidebar.png\")
![\"El](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/page-link-block.png\")
![\"Un](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/add-page-nav.png\")
2. Estilos<\/h3>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/styles-screen.png\")
![\"Un](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/styles-editor.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/typography-settings.png\")
![\"Una](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/layout-tab.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/style-book.png\")
Utilizar el archivo theme.json con la edici\u00f3n completa del sitio de WordPress<\/h4>\n
![\"Es](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/theme-json.png\")
3. P\u00e1ginas<\/h3>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/pages-screen.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/theme-blocks.png\")
4. Plantillas<\/h3>\n
![\"A\u00f1adir](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/add-template.png\")
5. Patrones<\/h3>\n
![\"El](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/block-pattern.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/patterns-page.png\")
Consejos sobre c\u00f3mo utilizar la edici\u00f3n completa del sitio de WordPress para crear dise\u00f1os<\/h2>\n
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/options-export.png\")
![\"La](\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/command-palette-search.png\")