¿Quieres crear una página de ancho completo en WordPress?

Un montón de Temas de WordPress ya viene con una plantilla de página de ancho completo incorporada que puede usar. Sin embargo, algunos temas de WordPress no tienen esta función. En esto tutoriel, le mostraremos cómo crear fácilmente una página de ancho completo en WordPress.

Pero antes, si nunca has instalado WordPress, descubre ¿Cómo instalar un blog de WordPress pasos 7 et ¿Cómo encontrar, instalar y activar un tema de WordPress en tu blog 

Luego de vuelta a por qué estamos aquí.

Método 1: usar una plantilla de ancho incorporada en su tema de WordPress

Este método se recomienda si su tema de WordPress ya cuenta con una plantilla de página de ancho completo. Si no tiene uno, consulte la siguiente selección y obtenga uno.

Primero debe editar una página o crear una nueva visitando " Páginas> Agregar Una nueva pagina.

En la ventana de edición de página, seleccione Ancho Completo como plantilla debajo de la casilla de verificación de atributos de página.

Después de seleccionar el modelo Ancho CompletoDebes registrar tu página. Puede continuar personalizando la página para agregar más contenido o haga clic en el botón de vista previa para verla en acción.

Si no tiene una opción de plantilla Ancho completo - Ancho completo en la pantalla de edición de su página, significa que su tema de WordPress no la tiene. 

Pero no se preocupe, le mostraremos cómo crear fácilmente una página de ancho completo sin cambiar un tema de WordPress.

Método 2: cómo crear una plantilla de página con un ancho completo

Este método requiere que edites los archivos del tema de WordPress que estás usando y que tengas un conocimiento básico de PHP, CSS y HTML.

Por cierto, también te invitamos a consultar el Los mejores complementos de WordPress de 8 para crear fácilmente sus diseños 

Pero, antes de continuar, debes crear una copia de seguridad de WordPress o al menos una copia de seguridad de su tema actual de WordPress. Esto le ayudará a restaurar fácilmente su sitio web si sucede algo malo. 

Primero, debe abrir un editor de texto como el Bloc de notas y pegar el siguiente código en un archivo en blanco:

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>

Ahora necesita guardar este archivo como " Full-width.php En tu computadora.

Este código simplemente establece el nombre de una plantilla de archivo y le dice a WordPress que extraiga la plantilla de encabezado.

A continuación, necesitará la parte de contenido del código. Conéctese a su sitio web mediante un cliente FTP (o administrador de archivos en cPanel) luego vaya a " / Wp-content / themes / tu-theme-carpeta / ".

Luego debes localizar el archivo llamado " page.php ". Este es el archivo de plantilla de página predeterminado para su tema.

Copie todo después de la función « get_header () Y pegarlo en un archivo " Full-width.php Que has creado en tu computadora.

Ahora tiene que mirar el contenido del archivo "full-width.php" y eliminar esta línea de código:

<?php get_sidebar(); ?>

Esta línea simplemente toma la barra lateral y la muestra en su tema de WordPress. Al eliminar esto, su tema no mostrará la barra lateral cuando use la plantilla Ancho Completo.

Es posible que vea que esta línea aparece más de una vez en su tema de WordPress. Si su tema de WordPress tiene varios barras laterales (las áreas de widgets del pie de página también se llaman barras laterales)verá cada barra lateral referenciada una vez en el código. Debes decidir qué barras laterales quieres mantener.

Tu sitio web parece estar cargando lentamente, descubre ¿Por qué necesitas comenzar a optimizar tu blog de WordPress por imágenes?

Si su tema no muestra barras laterales en su página, es posible que no encuentre este código en su archivo.

Así es como nuestro código full-width.php se encarga de hacer los cambios. Su código puede verse ligeramente diferente según su tema.

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>
<div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">
        <?php
        // Start the loop.
        while ( have_posts() ) : the_post();

            // Include the page content template.
            get_template_part( 'template-parts/content', 'page' );

            // If comments are open or we have at least one comment, load up the comment template.
            if ( comments_open() || get_comments_number() ) {
                comments_template();
            }

            // End of the loop.
        endwhile;
        ?>

    </main><!-- .site-main -->
</div><!-- .content-area -->
<?php get_footer(); ?>

Luego tienes que descargar el archivo Full-width.php »En su carpeta de temas de WordPress usando el cliente FTP.

Ha creado y subido correctamente una plantilla de página personalizada de ancho completo a su tema. El siguiente paso es utilizar esta plantilla para crear una página de ancho completo.

Dirígete a tu tablero y edita o crea una nueva página.

En la pantalla de edición de página, busque la casilla de verificación de atributos de página y haga clic en el menú desplegable debajo de la opción "Plantilla".

Podrás ver tu modelo. Adelante, selecciónelo y guarde o actualice la página.

Ahora, puede visitar su sitio web y verá que las barras laterales se han ido y su página aparece como una página de una sola columna. Puede que aún no esté lleno, pero ahora está listo para transmitirlo de manera diferente.

Haga que su sitio web sea popular descubriendo el Complementos 7 WordPress para optimizar el SEO de sus imágenes

Deberá utilizar la herramienta Inspeccionar para descubrir las clases CSS que utiliza su tema para definir el área de contenido.

Luego, puede ajustar su ancho al 100% usando CSS. Usamos el siguiente código CSS:

.page-template-full-width .content-area {
    width: 100%;
    margin: 0px;
    border: 0px;
    padding: 0px;
}

.page-template-full-width .site {
margin:0px;
}

Así es como se verá como Twenty Seventeen.

Eso es todo para este tutorial, espero que te permita crear páginas de ancho completo.

Los métodos anteriores son gratuitos para aquellos que pueden permitirse el lujo y desean crear rápidamente diseños de ancho completo o ancho completo fácilmente.

Descubre también algunos complementos premium de WordPress  

Puedes usar otros plugins de WordPress para dar una apariencia moderna y optimizar el manejo de tu blog o sitio web.

Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.

1. Divi Builder

Divi Builder es un generador de páginas de alta calidad muy apreciado por Elegante Temas. Aunque generalmente se usa como parte del tema Divi WordPress, Divi Builder también es un complemento independiente que puede usar en otros temas de WordPress.

Divi Builder le permite editar su contenido usando una interfaz visual en el front-end, así como una interfaz en el back-end, aunque la mayoría de los usuarios prefieren la primera interfaz.

Básicamente, en lugar de las barras laterales, todo está en ventanas emergentes y botones flotantes. Le da acceso a 316 plantillas prediseñadas distribuidas en 40 paquetes de presentación diferentes, así como la capacidad de guardar sus propios diseños como plantillas.

Te proponemos descubrir Cómo crear un blog profesional.

Uno de los rasgos de Divi siempre ha sido el control de los estilos que te da. En tres pestañas diferentes, puede configurar varios ajustes, incluidos controles receptivos, espaciado personalizable y más.

Incluso puede agregar CSS personalizado, ya que su editor de CSS incluye validación básica y autocompletado. Una de las críticas a Divi Builder siempre ha sido que se basa en códigos cortos. Lo que significa que si lo desactiva un día, dejará un montón de códigos cortos en su contenido. Aunque esto es un poco deprimente, ahora es menos problemático que existan complementos como Shortcode Cleaner.

Descargar | Demo | alojamiento web

2. Themify Builder

Themify Builder es, como era de esperar, la oferta del equipo de Themify. Lo integra en varios de sus temas de WordPress para proporcionar a los clientes opciones de personalización simples. Pero también puede comprarlo como un complemento independiente y usarlo con cualquier tema de WordPress.

Al igual que Divi Builder y WPBakery Page Builder, Themify Builder le permite crear diseños en el front-end o el back-end. Otra cosa buena es que este complemento le permite personalizar sus puntos de interrupción de respuesta (pero solo en todo el nivel del sitio web).

Descubre Cómo instalar y configurar WooCommerce para crear una tienda en línea y vende fácilmente tus productos en Internet 

Una cosa interesante de Themify Builder es que todavía te permite usar el editor estándar de WordPress, mientras que otros creadores de páginas te obligan a usar la interfaz de WordPress. constructor de páginas por todo.

Descargar | Demo | alojamiento web

3. Elementor

Lanzado originalmente en 2016, el complemento Elementor WordPress es uno de los creadores de páginas más jóvenes de esta lista. A pesar de su inicio tardío, Elementor acumuló rápidamente más de 1 de instalaciones activas en WordPress.org, lo que lo convierte en uno de los creadores de páginas de WordPress más populares.

Lo que hace que su reputación sea su interfaz visual fluida, sus diferentes opciones de estilo y otras características potentes como la creación completa de temas de WordPress.

Su interfaz se divide en dos partes principales, con una tercera zona para ciertos parámetros. La versión gratuita de Elementor ofrece widgets gratuitos de 28. La versión Pro trae otros widgets 30, un total de widgets 58 en la versión Pro. La versión gratuita incluye aproximadamente plantillas gratuitas de 40, mientras que la versión Pro trae cientos de plantillas adicionales.

 Descargar | Demo | alojamiento web

Otros recursos recomendados

Conozca otros recursos recomendados para ayudarlo a construir y administrar su sitio web.

• Cómo cambiar su tema de WordPress de forma segura
• Cómo configurar las entregas a WooCommerce
• 10 premium plugins de WordPress de Reservas y Reservas
• ¿Cuándo y cómo instalar WordPress en un subdirectorio
• 10 plugins de WordPress para mejorar la velocidad de tu blog

Conclusión

Listo ! Eso es todo por este tutorial. Si tiene un tema de WordPress que no ofrece una página de ancho completo como plantilla, entonces esperamos que este tutorial le haya ayudado a resolver esa deficiencia. No dude en comparte con tus amigos en tus redes sociales favoritas. 

Sin embargo, también podrá consultar nuestra Recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress.

Si tienes sugerencias o comentarios, déjalos en nuestra sección comentarios.

...