{"id":22505,"date":"2026-07-20T16:32:40","date_gmt":"2026-07-20T14:32:40","guid":{"rendered":"https:\/\/help.mapal-os.com\/?p=22505"},"modified":"2026-07-21T04:38:41","modified_gmt":"2026-07-21T02:38:41","slug":"crear-temas-en-studio","status":"publish","type":"post","link":"https:\/\/help.mapal-os.com\/es\/flow-learning-es\/aprendizaje-y-desarrollo\/studio-1\/crear-temas-en-studio\/","title":{"rendered":"Crear temas en Studio"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>Empieza desde:<\/strong> El panel de Flow Learning.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Ve a <strong>Aprendizaje y desarrollo &gt; Studio<\/strong>.<\/li>\n\n\n\n<li>Selecciona tu <strong>lecci\u00f3n espec\u00edfica<\/strong>.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">Crear un tema<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Una vez dentro del editor de lecciones, selecciona <strong>Tema<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"559\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-57.png\" alt=\"\" class=\"wp-image-22506\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-57.png 1024w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-57-300x164.png 300w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-57-768x419.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>El panel <strong>Tema<\/strong> se abre. Si a\u00fan no has creado un tema, Studio aplica un tema predeterminado, como <strong>Clean Blue<\/strong>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> Recomendamos empezar desde cualquier tema predeterminado de Studio.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Para crear un nuevo tema, modifica cualquier elemento de un tema predeterminado, lo que te permitir\u00e1 guardarlo como un nuevo tema:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Elige uno de los colores de tu marca. Studio trabaja con c\u00f3digos hexadecimales.<\/li>\n\n\n\n<li>Cambia cualquiera de las opciones de color existentes.<\/li>\n\n\n\n<li>Selecciona <strong>Guardar como nuevo<\/strong> en la parte inferior del panel <strong>Tema<\/strong>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Por ejemplo, cuando cambias el segundo color de \u00e9nfasis a <code>#c7305e<\/code>, el tema se convierte en un nuevo borrador porque se ha realizado un cambio en un tema existente.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Selecciona <strong><strong>Guardar como nuevo<\/strong><\/strong>.<\/li>\n\n\n\n<li>Introduce un nombre para tu tema y selecciona <strong>Guardar<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"369\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-58.png\" alt=\"\" class=\"wp-image-22507\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-58.png 1024w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-58-300x108.png 300w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-58-768x277.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Esto crea un duplicado del tema <strong>Clean Blue<\/strong> con el cambio de color aplicado. Ahora puedes modificar los dem\u00e1s elementos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> Guarda los cambios cada vez que realices uno.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Establecer los colores<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>El segundo color de \u00e9nfasis cambia todos los botones, iconos y los contornos de selecci\u00f3n que se muestran al editar la lecci\u00f3n.<\/li>\n\n\n\n<li>El primer color de \u00e9nfasis cambia todos los componentes, que adoptan un tono de ese color, as\u00ed como el subrayado bajo los t\u00edtulos.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"239\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-59.png\" alt=\"\" class=\"wp-image-22508\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-59.png 1024w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-59-300x70.png 300w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-59-768x179.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Establecer los colores de las fuentes<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Elige el color que deseas para la fuente <strong>Encabezado<\/strong>, que abarca todos los t\u00edtulos y subt\u00edtulos, y para tu fuente <strong>P\u00e1rrafo<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> Si eliges un color con poco contraste respecto al <strong>Color de fondo de la p\u00e1gina<\/strong>, a la <strong>Imagen de fondo de la p\u00e1gina<\/strong> O a tus componentes, Studio te lo indicar\u00e1. Aseg\u00farate de que el texto cumple el nivel m\u00ednimo de contraste requerido.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"683\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-60.png\" alt=\"\" class=\"wp-image-22509\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-60.png 600w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-60-264x300.png 264w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Establecer el fondo de la p\u00e1gina<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">El <strong>Color de fondo de la p\u00e1gina<\/strong> debe ofrecer suficiente contraste con el color del texto.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Ve a <strong>Fondo de p\u00e1gina<\/strong>.<\/li>\n\n\n\n<li>Copia y pega el c\u00f3digo hexadecimal del color elegido.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"292\" height=\"669\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-61.png\" alt=\"\" class=\"wp-image-22510\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-61.png 292w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-61-131x300.png 131w\" sizes=\"auto, (max-width: 292px) 100vw, 292px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Tambi\u00e9n puedes subir una imagen de fondo de p\u00e1gina. Esta se aplica a todas las p\u00e1ginas, por lo que recomendamos una imagen de fondo que no resulte demasiado distractora o recargada, para que el contenido sea siempre visible y legible.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Selecciona el icono de carga.<\/li>\n\n\n\n<li>Localiza y selecciona tu imagen.<\/li>\n\n\n\n<li>Selecciona <strong>Abrir<\/strong>. La imagen se aplica a tu lecci\u00f3n.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"730\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-62.png\" alt=\"\" class=\"wp-image-22528\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-62.png 1024w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-62-300x214.png 300w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-62-768x548.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h5 class=\"wp-block-heading\">Superposici\u00f3n de t\u00edtulos y contenido<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Bajo <strong>Fondo de p\u00e1gina<\/strong>, puedes establecer el color <strong>Superposici\u00f3n de t\u00edtulos<\/strong> para cambiar el color de fondo de las p\u00e1ginas de introducci\u00f3n y los separadores de secciones \u00fanicamente.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Introduce tu c\u00f3digo hexadecimal y pulsa Intro. El color se actualiza al formato RGBA, por ejemplo <code>RGBA 255, 255, 255, 1<\/code>.<\/li>\n\n\n\n<li>Para mantener tu imagen de fondo visible en estas p\u00e1ginas, establece el \u00faltimo n\u00famero entre par\u00e9ntesis en 0. Esto establece la opacidad del color en cero, por ejemplo <code>RGBA 255, 255, 255, 0<\/code>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Tambi\u00e9n puedes establecer el color <strong>Superposici\u00f3n de contenido<\/strong> para que coincida con el <strong>Color de fondo de la p\u00e1gina<\/strong> de la misma forma, con la opacidad establecida en 100 %.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"401\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-63.png\" alt=\"\" class=\"wp-image-22529\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-63.png 1024w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-63-300x117.png 300w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-63-768x301.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Establecer las fuentes<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Studio tiene dos opciones de fuente: una para los <strong>Encabezados<\/strong> (todos los t\u00edtulos y subt\u00edtulos) y otra para el cuerpo del texto (el contenido principal). Studio incluye fuentes integradas entre las que elegir, como Montserrat. Tambi\u00e9n puedes seleccionar el grosor de la fuente, por ejemplo normal, negrita O cursiva.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"683\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-64.png\" alt=\"\" class=\"wp-image-22530\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-64.png 600w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-64-264x300.png 264w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure>\n\n\n\n<h5 class=\"wp-block-heading\">Subir una fuente personalizada<\/h5>\n\n\n\n<p class=\"wp-block-paragraph\">Si la fuente de tu marca no est\u00e1 en la lista, puedes subirla:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Selecciona el desplegable de fuentes y luego selecciona <strong>Fuente personalizada<\/strong>.<\/li>\n\n\n\n<li>Sube el archivo de fuente <strong>Normal<\/strong>. Este paso es obligatorio.<\/li>\n\n\n\n<li>Selecciona <strong>Cargar fuente<\/strong>.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">No es necesario subir las versiones en negrita o cursiva, ya que Studio las genera autom\u00e1ticamente.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> No recomendamos subir una fuente para la que no dispongas de una licencia comercial. Todas las fuentes de Google tienen licencia comercial: son gratuitas y de c\u00f3digo abierto para cualquier uso.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"561\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-65.png\" alt=\"\" class=\"wp-image-22531\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-65.png 768w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-65-300x219.png 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Subir tu logotipo<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Selecciona <strong>Temas<\/strong> &gt; <strong>Logotipo<\/strong> &gt; <strong>Subir logotipo<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"654\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-66.png\" alt=\"\" class=\"wp-image-22532\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-66.png 768w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-66-300x255.png 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> En Studio, los logotipos se suben por lecci\u00f3n. No est\u00e1n vinculados al tema.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Una vez subido, tu logotipo puede mostrarse de tres formas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Fondo blanco:<\/strong> a\u00f1ade un fondo blanco a tu logotipo. Esto solo funciona si subes el logotipo en formato PNG con fondo transparente.<\/li>\n\n\n\n<li><strong>Redondeado:<\/strong> a\u00f1ade bordes redondeados a tu logotipo en la vista previa.<\/li>\n\n\n\n<li><strong>Ninguno:<\/strong> no se aplica ning\u00fan fondo al logotipo en la vista previa.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"455\" height=\"368\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-67.png\" alt=\"\" class=\"wp-image-22533\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-67.png 455w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-67-300x243.png 300w\" sizes=\"auto, (max-width: 455px) 100vw, 455px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Observaciones:<\/strong> Si estableces el estilo visual en <strong>Ninguno<\/strong>, el logotipo puede superponerse al contenido seg\u00fan la maquetaci\u00f3n, lo que puede dificultar la lectura de uno o del otro. Recomendamos asignar un color de fondo al logotipo, o utilizar la opci\u00f3n <strong>Fondo blanco<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"378\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-69.png\" alt=\"\" class=\"wp-image-22535\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-69.png 768w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-69-300x148.png 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Tambi\u00e9n puedes a\u00f1adir tu logotipo como imagen en la p\u00e1gina de inicio de tu lecci\u00f3n para presentar el curso y reforzar tu imagen de marca.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"378\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-70.png\" alt=\"\" class=\"wp-image-22536\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-70.png 768w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-70-300x148.png 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Aplicar un tema y establecer un tema predeterminado<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Tu tema ya est\u00e1 completo. Al crear una lecci\u00f3n, puedes seleccionar este tema para aplicarlo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Para aplicar el tema autom\u00e1ticamente a cualquier lecci\u00f3n que crees, establ\u00e9celo como predeterminado:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Ve al panel de Studio y selecciona <strong>Ajustes<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"337\" height=\"59\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-71.png\" alt=\"\" class=\"wp-image-22537\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-71.png 337w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-71-300x53.png 300w\" sizes=\"auto, (max-width: 337px) 100vw, 337px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>En la ventana emergente, selecciona <strong>Imagen de marca<\/strong>.<\/li>\n\n\n\n<li>En <strong>Tema predeterminado<\/strong>, selecciona el desplegable y elige tu nuevo tema.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"478\" src=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-72.png\" alt=\"\" class=\"wp-image-22538\" srcset=\"https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-72.png 768w, https:\/\/help.mapal-os.com\/wp-content\/uploads\/2026\/07\/image-72-300x187.png 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Crear un tema en Studio te ayuda a mantener una identidad de marca coherente en cada lecci\u00f3n y experiencia de aprendizaje. Un tema bien definido establece un marco visual unificado que abarca elementos como los colores de tu marca, las fuentes, las im\u00e1genes y el logotipo.<\/p>\n","protected":false},"author":251318858,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[133059],"tags":[133226,131476,131365],"class_list":["post-22505","post","type-post","status-publish","format-standard","hentry","category-studio-1","tag-theme","tag-studio","tag-branding"],"acf":{"article_type":"default","post_id":"","post_url_text":"","post_url":"","info_box":{"title":"","info":""},"post_video":"","import_category":"","overview_item":null,"troubleshoot_case":null},"_links":{"self":[{"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/posts\/22505","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/users\/251318858"}],"replies":[{"embeddable":true,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/comments?post=22505"}],"version-history":[{"count":2,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/posts\/22505\/revisions"}],"predecessor-version":[{"id":22571,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/posts\/22505\/revisions\/22571"}],"wp:attachment":[{"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/media?parent=22505"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/categories?post=22505"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/help.mapal-os.com\/es\/wp-json\/wp\/v2\/tags?post=22505"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}