{"id":8782,"date":"2019-07-01T23:08:43","date_gmt":"2019-07-01T23:08:43","guid":{"rendered":"https:\/\/blog.hostinger.io\/co-tutoriales\/?p=8782"},"modified":"2025-01-31T10:56:18","modified_gmt":"2025-01-31T09:56:18","slug":"editar-plantillas-wordpress","status":"publish","type":"post","link":"\/co\/tutoriales\/editar-plantillas-wordpress\/","title":{"rendered":"\u00bfC\u00f3mo editar las plantillas de WordPress?"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Un <a href=\"\/co\/tutoriales\/temas-wordpress-mas-rapidos\/\">tema de WordPress<\/a> es un conjunto de archivos que incluye im&aacute;genes, hojas de estilo y c&oacute;digo. El tema define la apariencia visual de tu sitio web y determina su funcionalidad.<\/p><p class=\"wp-block-paragraph\">Sin embargo, los temas no siempre incluyen todo lo que un sitio web puede necesitar. Por eso es bueno saber c&oacute;mo personalizar sus plantillas para incluir m&aacute;s funciones y mejorar la experiencia del usuario.<\/p><p class=\"wp-block-paragraph\">En este art&iacute;culo, explicaremos c&oacute;mo editar las plantillas de WordPress para conseguir el sitio web que necesitas. Tambi&eacute;n mencionaremos otros m&eacute;todos que puedes utilizar para personalizar tu <a href=\"\/co\/tutoriales\/que-es-wordpress\/\">sitio web de WordPress<\/a> de forma segura.<\/p><h2 class=\"wp-block-heading\" id=\"h-como-personalizar-wordpress-video\">C&oacute;mo personalizar WordPress &ndash; Video<\/h2><p class=\"wp-block-paragraph\">En la Academia de Hostinger hemos creado un video por si prefieres un formato audiovisual. <\/p><figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"C&oacute;mo Personalizar WordPress (2024)\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/FKp0dvhEN8o?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure><p>\n\n\n\n  <div class=\"youtube-shortcode\">\n    <div class=\"row\">\n      <div class=\"col-7 col-sm-8 d-flex align-items-center\">\n        <img decoding=\"async\" class=\"channel-logo\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/themes\/tutorialsthemeuplift\/public\/images\/youtube-channels\/hostinger-spain.jpg\" alt=\"youtube channel logo\">\n        <div class=\"d-flex flex-column justify-content-between\">\n          <span class=\"slogan d-none d-sm-block\">Suscribirse \u00a1Para m\u00e1s videos educativos!<\/span>\n          <span class=\"channel-name\">Academia de Hostinger<\/span>\n                    <\/div>\n      <\/div>\n      <div class=\"col-5 col-sm-4 d-flex align-items-center justify-content-end\">\n        <a class=\"subscribe-button\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" href=\"http:\/\/www.youtube.com\/channel\/UCYmKCu1yo_L0fqKe3U_oMnw?sub_confirmation=1\">\n          <img decoding=\"async\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/themes\/tutorialsthemeuplift\/public\/images\/icons\/youtube.svg\" alt=\"subscribe\">\n          <span>Suscribirse<\/span>\n        <\/a>\n      <\/div>\n    <\/div>\n  <\/div>\n\n    \n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-que-es-el-editor-de-temas-de-wordpress\">&iquest;Qu&eacute; es el editor de temas de WordPress?<\/h2><p class=\"wp-block-paragraph\">El editor de temas de WordPress es un sencillo editor de texto dentro del <a href=\"\/co\/tutoriales\/acceder-al-escritorio-wordpress\/\">panel de control de WordPress<\/a>. Permite a los usuarios personalizar los archivos del tema, ya sea adjuntando una barra lateral adicional, haci&eacute;ndola compatible con los dispositivos m&oacute;viles o incrustando v&iacute;deos personalizados en el header.<\/p><p class=\"wp-block-paragraph\">Para editar las <a href=\"\/co\/tutoriales\/mejores-plantillas-wordpress\/\">plantillas de WordPress<\/a>, puedes acceder al editor desde <strong>Apariencia<\/strong> -&gt; <strong>Editor de temas<\/strong>. La parte derecha de la ventana muestra una lista de los archivos de plantilla que incluye el tema. Al hacer clic en uno de ellos, se mostrar&aacute; el c&oacute;digo en el editor de temas, donde los usuarios pueden empezar a hacer cambios.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1137\" height=\"508\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress.png\" alt=\"interfaz de editor de plantillas de wordpress\" class=\"wp-image-8788\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress.png 1137w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress-150x67.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress-300x134.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress-768x343.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress-1024x458.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/vista-del-editor-de-plantillas-de-wordpress-990x442.png 990w\" sizes=\"(max-width: 1137px) 100vw, 1137px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Para seleccionar otros temas a modificar, ve a la esquina superior derecha de la pantalla y hacer clic en el men&uacute; desplegable.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1139\" height=\"505\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla.png\" alt=\"Men&uacute; desplegable para seleccionar temas en el editor de plantillas de WordPress\" class=\"wp-image-8789\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla.png 1139w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla-150x67.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla-300x133.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla-768x341.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla-1024x454.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/seleccionar-plantilla-990x439.png 990w\" sizes=\"(max-width: 1139px) 100vw, 1139px\" \/><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Seleccionar otro tema aqu&iacute; s&oacute;lo abrir&aacute; los archivos del tema pero no lo activar&aacute;. Si quieres activar uno, debes ir a <strong>Apariencia<\/strong> -&gt; <strong>Temas<\/strong>.<\/p><p class=\"wp-block-paragraph\">Como todos los archivos de plantillas est&aacute;n escritos en <a href=\"\/co\/tutoriales\/que-es-php\/\">PHP<\/a>, <a href=\"\/co\/tutoriales\/anadir-css-personalizado-wordpress\/\">CSS<\/a>, JS y <a href=\"\/co\/tutoriales\/que-es-json\/\">JSON<\/a>, es crucial que te sientas c&oacute;modo editando esos archivos, ya que no hay opci&oacute;n de deshacer los cambios.<\/p><p class=\"wp-block-paragraph\">Una vez que hayas terminado de personalizar el tema, haz clic en el bot&oacute;n <strong>Actualizar archivo<\/strong>. Una cosa buena del editor de temas de WordPress es que evitar&aacute; que se guarden accidentalmente cambios no deseados cuando haya errores en el c&oacute;digo, permiti&eacute;ndote volver atr&aacute;s f&aacute;cilmente.<\/p><p class=\"wp-block-paragraph\">Sin embargo, hay que asegurarse de editar los archivos correctamente y tener cuidado al pegar fragmentos de c&oacute;digo. Pegar el c&oacute;digo de forma incorrecta podr&iacute;a dar lugar a errores de sintaxis y provocar el bloqueo de tu sitio.<\/p><p class=\"wp-block-paragraph\">Si eres un desarrollador y est&aacute;s trabajando para un cliente, puede que sea mejor desactivar el acceso al editor de temas. Esto evitar&aacute; errores no deseados, ya que el cliente podr&iacute;a no darse cuenta de los riesgos potenciales de editar el c&oacute;digo fuente.<\/p><p class=\"wp-block-paragraph\">Adem&aacute;s, deshabilitar el acceso al editor de c&oacute;digo del tema puede evitar que los hackers introduzcan c&oacute;digo malicioso en el sitio.<\/p><p class=\"wp-block-paragraph\">        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                    Consejo profesional                <\/p>\n            <\/div>\n            <p class=\"protip__content\">Crea siempre copias de seguridad si est&aacute;s personalizando el c&oacute;digo del tema. Aprende c&oacute;mo <a href=\"\/co\/tutoriales\/una-copia-seguridad-sitio-wordpress\/\">crear una copia de seguridad<\/a> de WordPress con nuestra gu&iacute;a.<\/p>\n                    <\/div>\n        <\/p><h2 class=\"wp-block-heading\" id=\"h-otras-formas-de-personalizar-tu-tema-de-wordpress\">Otras formas de personalizar tu tema de WordPress<\/h2><p class=\"wp-block-paragraph\">Adem&aacute;s de utilizar el editor de temas, hay varias otras formas de editar la apariencia de tu sitio web de WordPress.<\/p><h3 class=\"wp-block-heading\" id=\"h-usar-constructores-de-paginas\">Usar constructores de p&aacute;ginas<\/h3><p class=\"wp-block-paragraph\">Muchos temas de WordPress son compatibles con varios constructores de p&aacute;ginas, como <a href=\"https:\/\/www.elegantthemes.com\/gallery\/divi\/\" target=\"_blank\" rel=\"noopener\">Divi<\/a> y <a href=\"https:\/\/www.wpbeaverbuilder.com\/\" target=\"_blank\" rel=\"noopener\">Beaver Builder<\/a>. La mayor&iacute;a de los constructores ofrecen la funci&oacute;n de arrastrar y soltar, lo que permite personalizar el tema sin tener que cambiar manualmente una sola l&iacute;nea de c&oacute;digo.<\/p><p class=\"wp-block-paragraph\">Para personalizar tu sitio usando un constructor de p&aacute;ginas, simplemente instala uno que sea compatible con tu tema y usa las opciones proporcionadas para empezar a modificar el dise&ntilde;o de tus p&aacute;ginas.<\/p><p class=\"wp-block-paragraph\">Aunque los constructores de p&aacute;ginas ofrecen una gran flexibilidad a la hora de modificar el contenido de tu sitio web, tambi&eacute;n hay que tener en cuenta las desventajas.<\/p><p class=\"wp-block-paragraph\">Los constructores de WordPress transforman el dise&ntilde;o en shortcodes espec&iacute;ficos que dependen del plugin. Esto significa que si desactivas el plugin del constructor de p&aacute;ginas, los shortcodes dejar&aacute;n de funcionar y perder&aacute;s tu dise&ntilde;o.<\/p><p class=\"wp-block-paragraph\">Adem&aacute;s, los shortcodes tambi&eacute;n pueden afectar negativamente al tiempo de carga de la p&aacute;gina de tu sitio.<\/p><h3 class=\"wp-block-heading\" id=\"h-editar-los-archivos-del-tema\">Editar los archivos del tema<\/h3><p class=\"wp-block-paragraph\">Otra forma de editar las plantillas de WordPress es directamente desde los archivos del tema. Para ello, ve al panel de control de hPanel y haz clic en <strong>Administrador de archivos<\/strong>.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"425\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel.png\" alt=\"Administrador de archivos en el hPanel de Hostinger\" class=\"wp-image-14329\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel-300x125.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel-150x62.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel-768x319.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-hpanel-1536x638.png 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div><ol class=\"wp-block-list\">\n<li>Busca la carpeta <strong>public_html<\/strong>.<br><img decoding=\"async\" class=\"aligncenter wp-image-14330 size-full\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1.png\" alt=\"Carpeta public_html en el Administrador de archivos\" width=\"1589\" height=\"415\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1.png 1589w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1-300x78.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1-1024x267.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1-150x39.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1-768x201.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-1-1536x401.png 1536w\" sizes=\"(max-width: 1589px) 100vw, 1589px\" \/><\/li>\n\n\n\n<li>Haz clic en una carpeta denominada <strong>wp_content -&gt; themes<\/strong>.<br><img decoding=\"async\" class=\"aligncenter wp-image-14331 size-full\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2.png\" alt=\"Carpeta themes en el Administrador de archivos de Hostinger\" width=\"1590\" height=\"536\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2.png 1590w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2-300x101.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2-1024x345.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2-150x51.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2-768x259.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-2-1536x518.png 1536w\" sizes=\"(max-width: 1590px) 100vw, 1590px\" \/><\/li>\n\n\n\n<li>Esta carpeta contiene todos los temas que has descargado en tu sitio de WordPress. Haz doble clic en el archivo del tema actualmente activo que quieras editar.<br><img decoding=\"async\" class=\"aligncenter wp-image-14332 size-full\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3.png\" alt=\"Elegir el archivo tu tema de WordPress\" width=\"1584\" height=\"638\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3.png 1584w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3-300x121.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3-1024x412.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3-150x60.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3-768x309.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-3-1536x619.png 1536w\" sizes=\"(max-width: 1584px) 100vw, 1584px\" \/><\/li>\n\n\n\n<li>Luego, selecciona el archivo del tema que quieres personalizar y haz clic en el icono <strong>Editar<\/strong> en la barra del men&uacute;.<\/li>\n\n\n\n<li>Esto abrir&aacute; el editor de texto que se puede utilizar para personalizar el c&oacute;digo seg&uacute;n tus necesidades. Al hacer clic en el bot&oacute;n <strong>Save<\/strong>, los cambios se actualizar&aacute;n en tu sitio.<br><img decoding=\"async\" class=\"aligncenter wp-image-14333 size-full\" src=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4.png\" alt=\"Editar plantilla de WordPress en el Administrador de archivos\" width=\"1583\" height=\"674\" srcset=\"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4.png 1583w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4-300x128.png 300w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4-1024x436.png 1024w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4-150x64.png 150w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4-768x327.png 768w, https:\/\/www.hostinger.com\/co\/tutoriales\/wp-content\/uploads\/sites\/40\/2019\/07\/administrador-archivos-4-1536x654.png 1536w\" sizes=\"(max-width: 1583px) 100vw, 1583px\" \/><\/li>\n<\/ol><p class=\"wp-block-paragraph\">La lista de archivos del tema puede variar dependiendo del tema. Sin embargo, todos los temas de WordPress incluyen estos archivos esenciales:<\/p><ul class=\"wp-block-list\">\n<li><strong>Stylesheet (style.css)<\/strong> &ndash; caracter&iacute;sticas relacionadas con el dise&ntilde;o, como fuentes, colores y dise&ntilde;os.<\/li>\n\n\n\n<li><strong>Functions.php<\/strong> &ndash; caracter&iacute;sticas y funcionalidad del tema, como <a href=\"\/co\/tutoriales\/crear-widgets-wordpress-personalizados\/\">widgets<\/a> y logotipos personalizados.<\/li>\n\n\n\n<li><strong>Archivos de plantilla<\/strong> &ndash; una combinaci&oacute;n de HTML, etiquetas de plantilla y c&oacute;digo PHP que generan el contenido de tu sitio web.<\/li>\n<\/ul><h3 class=\"wp-block-heading\" id=\"h-usar-plugins-de-wordpress\">Usar plugins de WordPress<\/h3><p class=\"wp-block-paragraph\">Si lo que le falta a tu sitio es s&oacute;lo una funci&oacute;n b&aacute;sica, bastar&aacute; con <a href=\"\/co\/tutoriales\/plugins-en-wordpress-gratis\/\">instalar un plugin adicional<\/a>. Hay miles de opciones en el <a href=\"https:\/\/es.wordpress.org\/plugins\/\" target=\"_blank\" rel=\"noopener\">directorio de plugins de WordPress<\/a>, que van desde plugins de comercio electr&oacute;nico y seguridad hasta de integraci&oacute;n con redes sociales y <a href=\"\/co\/tutoriales\/que-es-seo\/\">optimizaci&oacute;n SEO<\/a>.<\/p><p class=\"wp-block-paragraph\">Para asegurarte de que est&aacute;s instalando el plugin adecuado, conviene que prestes atenci&oacute;n a cu&aacute;ndo se actualiz&oacute; por &uacute;ltima vez, cu&aacute;l es la valoraci&oacute;n de los usuarios y si es compatible con la <a href=\"\/co\/tutoriales\/como-saber-version-de-wordpress\/\">&uacute;ltima versi&oacute;n de WordPress<\/a>.<\/p><p class=\"wp-block-paragraph\">Adem&aacute;s, si simplemente quieres editar el estilo y el dise&ntilde;o del tema, puedes utilizar un plugin como <a href=\"https:\/\/www.csshero.org\/\" target=\"_blank\" rel=\"noopener\">CSS Hero<\/a>. Este plugin genera una copia de la hoja de estilos y anula la original. Permite a los usuarios modificar el dise&ntilde;o y el estilo de su sitio web sin tocar los archivos originales del tema.<\/p><h3 class=\"wp-block-heading\" id=\"h-instalar-un-tema-hijo\">Instalar un tema hijo<\/h3><p class=\"wp-block-paragraph\">Un <a href=\"\/co\/tutoriales\/utilizar-child-theme\/\">tema hijo<\/a> act&uacute;a como un subtema que hereda todas las caracter&iacute;sticas del tema padre. Anula las caracter&iacute;sticas y funciones del tema principal, permitiendo a los usuarios realizar cambios sin perder la funcionalidad principal del tema padre.<\/p><p class=\"wp-block-paragraph\">Tambi&eacute;n ayuda a preservar tus ediciones en caso de que el tema padre se actualice.<\/p><p class=\"wp-block-paragraph\">Un tema hijo tiene sus propios archivos <strong>style.css<\/strong> y <strong>functions.php<\/strong> y se almacena en un directorio separado del tema padre. All&iacute; puedes a&ntilde;adir nuevos archivos y realizar cambios en el estilo, los par&aacute;metros del dise&ntilde;o, la programaci&oacute;n y los scripts.<\/p><p class=\"wp-block-paragraph\">Hay varias formas de crear temas hijo en WordPress. Por ejemplo, puedes configurar una carpeta de temas hijo a trav&eacute;s del Administrador de Archivos o instalar un plugin, como <a href=\"https:\/\/es.wordpress.org\/plugins\/child-theme-generator\/\" target=\"_blank\" rel=\"noopener\">Child Theme Generator<\/a>.<\/p><h2 class=\"wp-block-heading\" id=\"h-consejos-adicionales-para-editar-las-plantillas-de-wordpress\">Consejos adicionales para editar las plantillas de WordPress<\/h2><p class=\"wp-block-paragraph\">Aunque editar el c&oacute;digo original con el editor de temas te da control total, tambi&eacute;n es posible que tu sitio se caiga y se pierdan las partes de c&oacute;digo necesarias.<\/p><p class=\"wp-block-paragraph\">No hay que preocuparse, ya que en la secci&oacute;n que sigue veremos algunas pr&aacute;cticas de seguridad que hay que aplicar antes de empezar a personalizar un tema de WordPress.<\/p><h3 class=\"wp-block-heading\" id=\"h-crea-siempre-una-copia-de-seguridad-de-los-archivos\">Crea siempre una copia de seguridad de los archivos<\/h3><p class=\"wp-block-paragraph\">Crear una copia de seguridad de tu sitio de WordPress es fundamental a la hora de realizar ediciones importantes. Esto puede evitar tener que rehacer la configuraci&oacute;n y las personalizaciones desde cero si algo va mal. En su lugar, puedes simplemente descargar los archivos de la copia de seguridad y tener tu sitio de nuevo en funcionamiento.<\/p><p class=\"wp-block-paragraph\">A veces puede que no necesites una copia de seguridad completa. En este caso, guardar una copia del <strong>stylesheet.css<\/strong> es una buena idea. Si algo va mal, puedes borrar el archivo y subir el original para sobrescribir los cambios.<\/p><h3 class=\"wp-block-heading\" id=\"h-configura-un-servidor-de-prueba-local\">Configura un servidor de prueba local<\/h3><p class=\"wp-block-paragraph\">Cuando personalizas el c&oacute;digo o utilizas un tema hijo, siempre es recomendable hacerlo primero en un servidor local. Esto te permitir&aacute; previsualizar las personalizaciones que realices antes de aplicarlas a tu sitio en vivo.<\/p><p class=\"wp-block-paragraph\">Para ello, necesitar&aacute;s <a href=\"\/co\/tutoriales\/como-instalar-wordpress\/\">instalar WordPress<\/a> localmente usando <strong>MAMP<\/strong> o <strong>WampServer<\/strong>. Esto te dar&aacute; acceso a un <a href=\"\/co\/tutoriales\/entorno-staging-wordpress\/\">entorno de ensayo<\/a>.<\/p><p class=\"wp-block-paragraph\">All&iacute; podr&aacute;s probar las ediciones que has hecho en tu tema de WordPress y revisar el contenido de tu sitio web, como las p&aacute;ginas o las entradas. Una vez que est&eacute;s conforme con los cambios, puedes subirlos a tu sitio web en vivo.<\/p><h3 class=\"wp-block-heading\" id=\"h-utiliza-el-control-de-versiones\">Utiliza el control de versiones<\/h3><p class=\"wp-block-paragraph\">Con el control de versiones, los usuarios pueden rastrear y deshacer los cambios dentro de su sitio web de WordPress. Tambi&eacute;n permite restaurar las versiones anteriores y ahorra la molestia de hacer ediciones manuales.<\/p><p class=\"wp-block-paragraph\">El control de versiones es especialmente &uacute;til si trabajas en equipo, ya que es una excelente herramienta para el trabajo colaborativo.<\/p><p class=\"wp-block-paragraph\">Existen m&uacute;ltiples soluciones para el control de versiones en WordPress, desde el uso de repositorios Git, como <a href=\"https:\/\/github.com\/\" target=\"_blank\" rel=\"noopener\">GitHub<\/a> y <a href=\"\/co\/tutoriales\/que-es-gitlab\/\">GitLab<\/a>, hasta la instalaci&oacute;n de un plugin, como <a href=\"https:\/\/es.wordpress.org\/plugins\/wp-rollback\/\" target=\"_blank\" rel=\"noopener\">WP Rollback<\/a>, <a href=\"https:\/\/versionpress.com\/\" target=\"_blank\" rel=\"noopener\">VersionPress<\/a> y <a href=\"https:\/\/revisr.io\/\" target=\"_blank\" rel=\"noopener\">Revisr<\/a>.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"\/co\/hosting-wordpress\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\/public\" alt=\"\" class=\"wp-image-40615\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/40\/2024\/06\/ES-New-WP_in-text-banner.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n<\/div><h2 class=\"wp-block-heading\" id=\"h-conclusion\">Conclusi&oacute;n<\/h2><p class=\"wp-block-paragraph\">Al ser una plataforma CMS flexible, WordPress ofrece a sus usuarios una gran cantidad de opciones de personalizaci&oacute;n, incluyendo su editor de c&oacute;digo de temas. Este proporciona una manera f&aacute;cil de acceder al c&oacute;digo fuente del tema, permiti&eacute;ndote personalizar el dise&ntilde;o de tu sitio.<\/p><p class=\"wp-block-paragraph\">Sin embargo, el editor de temas de texto s&oacute;lo se recomienda si tienes los conocimientos de programaci&oacute;n adecuados, ya que puede romper tu sitio y perder las modificaciones realizadas antes de una actualizaci&oacute;n. Como alternativa, existen otros m&eacute;todos que implican menos riesgos, como instalar un plugin que responda a tus necesidades y crear un tema hijo.<\/p><p class=\"wp-block-paragraph\">En definitiva, sea cual sea el m&eacute;todo que elijas para editar las plantillas de WordPress, aseg&uacute;rate de tener en cuenta los consejos de seguridad mencionados en este art&iacute;culo para obtener los mejores resultados. &iexcl;Buena suerte!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un tema de WordPress es un conjunto de archivos que incluye im&aacute;genes, hojas de estilo y c&oacute;digo. El tema define la apariencia visual de tu sitio web y determina su funcionalidad. Sin embargo, los temas no siempre incluyen todo lo que un sitio web puede necesitar. Por eso es bueno saber c&oacute;mo personalizar sus plantillas [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/co\/tutoriales\/editar-plantillas-wordpress\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":85,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"\u00bfC\u00f3mo editar una plantilla en WordPress? Gu\u00eda y consejos","rank_math_description":"El editor de temas se utiliza para editar las plantillas de WordPress. Mira este art\u00edculo para aprender c\u00f3mo usarlo y personalizar tu sitio.","rank_math_focus_keyword":"editar plantillas wordpress","footnotes":""},"categories":[4747,14344],"tags":[14225],"class_list":["post-8782","post","type-post","status-publish","format-standard","hentry","category-wordpress","category-temas","tag-editar-plantillas-wordpress"],"hreflangs":[{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/editar-plantillas-wordpress","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/editar-plantillas-wordpress","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/editar-plantillas-wordpress","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/editar-plantillas-wordpress","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/posts\/8782","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/users\/85"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/comments?post=8782"}],"version-history":[{"count":19,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/posts\/8782\/revisions"}],"predecessor-version":[{"id":44357,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/posts\/8782\/revisions\/44357"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/media?parent=8782"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/categories?post=8782"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/co\/tutoriales\/wp-json\/wp\/v2\/tags?post=8782"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}