Cómo crear una plantilla de página de WordPress personalizada

WordPress utiliza plantillas y temas para guiar el diseño del sitio web. Pero puede haber ocasiones en las que desee crear una página con una apariencia diferente. Por ejemplo, muchos sitios tienen una página de destino que se ve muy diferente al resto del sitio.
Puede crear páginas con su propio diseño y diseño utilizando una plantilla de página personalizada en WordPress. No es tan fácil como instalar un complemento: requiere un poco de trabajo práctico. Pero una vez que haya creado la plantilla, está a solo un clic de distancia en WordPress siempre que la necesite.
Trabajaremos con PHP y FTP , por lo que es útil tener algunos conocimientos básicos de codificación y carga de archivos del sitio. (Personalizar la plantilla también implicará trabajar con CSS, PHP y algo de HTML).
Pero incluso si no tiene experiencia cotidiana en la codificación, puede crear una plantilla en WordPress. Simplemente siga los pasos aquí y, al final del artículo, su plantilla personalizada estará lista y funcionando.
Lo que una página personalizada puede hacer por usted
Una plantilla de página personalizada puede ser útil cuando necesita crear una apariencia separada de su sitio web principal. Eso se puede hacer con fines de marketing o para crear una página que no esté relacionada con el tema general de su sitio.
Puede configurar la página de varias maneras sin que ello tenga un impacto negativo en el resto de su sitio web. Todo lo que cambie en la página personalizada no afectará al resto del diseño de su sitio. Míralo como una página que se comporta independientemente del resto de tu sitio web de WordPress.
Creación de una plantilla de página personalizada
Para crear la plantilla personalizada, usaremos un editor de texto.
Si es un usuario de Windows, el editor de texto del Bloc de notas ya está en su computadora. Pero cualquier editor de texto o sitio web (DreamWeaver, CoffeCup, Notepad++, Atom Text, TextPad, etc.) hará el trabajo.
Para este tutorial, estoy usando el editor Sublime. Es probable que la interfaz de su editor se vea ligeramente diferente.
Paso 1
Abre tu editor de texto. En una página en blanco, ingrese esta línea de código:
1
|
<?php /* Template Name: MyPageTemplate */ ?> |
El código le dice a WordPress que es una plantilla y se mostrará como MyPageTemplate . Puedes usar cualquier nombre que quieras. Solo asegúrate de que sea algo que reconocerás más tarde.
Guarde el archivo como un archivo php. Para mantener las cosas organizadas, asigne al archivo el mismo nombre que el nombre de la plantilla que utilizó. Entonces, en mi caso, guardaría el archivo como MyPageTemplate.php .
Deje la página que acaba de crear abierta en su editor. Vamos a volver a ello.
Paso 2
Ahora vamos a subir el archivo a nuestro sitio web de WordPress, por lo que necesitará un programa FTP. Si aún no usa un programa FTP, pruebe FileZilla . Nombre divertido, gran programa FTP.
También puede enviar archivos FTP desde el Explorador de archivos de Windows o el Administrador de archivos de cPanel para su cuenta de alojamiento . Pero a la larga, un programa FTP independiente será más rápido y eficiente.
Así que abre tu programa FTP. Vamos a conectarnos a nuestro directorio "raíz" de WordPress. (También puede ver directorios denominados carpetas ).
Mi instalación de WordPress se llama "demo", por lo que mi directorio raíz de WordPress se ve así:
Puede ver los archivos de WordPress y los tres directorios "wp-".
Haga clic en el directorio /wp-content.
Luego haga clic en el directorio /themes.
En el directorio /themes, verá los temas de WordPress instalados actualmente.
Ahora haga clic en el directorio raíz del tema que está utilizando. En mi caso, será /twentynineteen.
Cargue su archivo PHP de tema personalizado en el directorio de temas.
Ahora verá el archivo MyPageTemplate.php en el directorio raíz veintinueve.
Vamos a usar el programa FTP nuevamente en un minuto, así que no lo cierres todavía.
Paso 3
Inicie sesión en su panel de administración de WordPress.
Ahora, cuando crea una página nueva o edita una página existente, su plantilla personalizada está disponible.
Creé y guardé una nueva página usando mi plantilla personalizada. Pero cuando lo veo en mi sitio web, está en blanco.
Eso es porque nuestra plantilla contiene solo la única línea que la identifica. No hay código en el archivo de plantilla que le diga a WordPress cómo mostrar la página.
Así que eso es lo que haremos a continuación. Agregue el código a nuestra plantilla personalizada para mostrar el contenido de la página.
No es tan difícil como parece. Vamos a facilitarnos las cosas copiando la plantilla de página de tema existente. Lo usaremos como base de nuestra plantilla personalizada.
Paso 4
Regresa a tu programa FTP.
En el directorio raíz del tema, donde cargamos nuestro archivo de tema personalizado, busque el archivo llamado page.php.
Descárguelo a su computadora.
Ahora ábralo en su editor de texto o sitio web.
Copie el contenido de page.php y péguelo en su archivo de plantilla personalizado.
Nuestra plantilla personalizada ahora se ve así:
Nuestra plantilla de página personalizada ya tiene un encabezado, por lo que vamos a eliminar la sección del encabezado del código que copiamos de page.php.
Estamos cortando la sección que comienza con /* y termina con */, se ve así:
Después de eliminar el encabezado, nuestra plantilla de página personalizada se verá así:
Guarde el archivo de plantilla de página personalizada y cárguelo nuevamente en el directorio raíz del tema. Va al mismo lugar donde subimos la primera versión del archivo.
Ahora, si va a la página de su sitio que usa la nueva plantilla, ya no verá una página en blanco.
Tomando su plantilla personalizada de WordPress desde aquí
Como sin duda notó, su página de plantilla personalizada se parece al resto de su sitio existente. Esto se debe a que usamos la plantilla de la página del tema como punto de partida.
A partir de este punto, tendrá que entrar en una codificación más compleja para crear la página que desea. Pero si eres hábil con HTML o tienes conocimientos básicos de PHP, está a tu alcance.
Para darle un ejemplo simple, agregaré una imagen de encabezado agregando una sola línea al archivo de plantilla. La línea es una etiqueta de imagen que contiene la ruta a una imagen de encabezado que creé y cargué.
Esa pequeña edición le da a las páginas que usan la plantilla una imagen de encabezado.
Donde tome una plantilla de página personalizada depende de su propia creatividad.
¿Este método también funciona para las publicaciones de WordPress?
No es asi. Las publicaciones y las páginas se representan de formas muy diferentes en WordPress. Dicho esto, hay complementos que te permiten crear plantillas de publicaciones personalizadas .
¿Los errores o errores en una plantilla de página personalizada romperán su sitio?
No. La belleza de la plantilla de página personalizada es que está aislada del resto de sus publicaciones y páginas. Entonces, cualquier error en su plantilla solo afecta la página o páginas que la usan. Y si eso sucede, siempre puede volver a cambiar la plantilla de la página a la plantilla de página predeterminada del tema. Eso eliminará el error hasta que pueda arreglar su plantilla.
Alternativas sin codificación para un diseño personalizado
Si el método que hemos descrito aquí parece demasiado complicado, también puede crear una plantilla de página de WordPress personalizada utilizando un complemento .
También es posible crear un diseño personalizado utilizando un creador de páginas. Page Builder de SiteOrigin le brinda la capacidad de hacer un diseño único mientras usa widgets dentro del contenido.
Cualquier complemento es una opción viable. Y hay muchos otros creadores de páginas que puedes probar. Pero la forma en que lo hemos hecho en este artículo es la opción más liviana . No requiere ningún recurso adicional, mientras que muchos (la mayoría) de los complementos utilizan recursos de memoria.
Las páginas personalizadas tienen propósitos que van desde publicitar un producto o servicio hasta crear una página de destino para campañas. Con un poco de conocimiento de programación o HTML, no hay límite para lo que puede diseñar en WordPress.
¿Crees que usarás páginas personalizadas en tu sitio de WordPress? ¿Hay sitios que visitas para aprender HTML o PHP? Házmelo saber en los comentarios.