Comment changer votre thème WordPress pour élargir la zone de contenu de votre site Web

Publié: 2022-10-31

Un thème WordPress définit l'apparence de votre site Web, y compris sa mise en page et sa conception. Le thème WordPress que vous choisissez détermine la largeur de la zone de contenu de votre site Web. Certains thèmes WordPress ont une largeur fixe, ce qui signifie que le contenu de votre site Web sera toujours limité à une largeur spécifique, quelle que soit la taille de l'écran de votre visiteur. D'autres thèmes WordPress ont une largeur fluide ou réactive, ce qui signifie que la zone de contenu de votre site Web s'ajustera à la taille de l'écran de votre visiteur. Si vous n'êtes pas satisfait de la largeur de la zone de contenu de votre site Web, vous pouvez la modifier en sélectionnant un autre thème WordPress . Dans cet article, nous allons vous montrer comment élargir la zone de contenu de votre site WordPress en modifiant votre thème.

Comment puis-je rendre ma couverture WordPress pleine largeur ?

Image par – https://pinimg.com

Vérifiez si la page est pleine largeur à 100 % en la modifiant dans WordPress, en faisant défiler l'onglet principal dans la section des paramètres d'oceanwordpress et en sélectionnant la mise en page 100 % pleine largeur .

Dans cette leçon, nous verrons comment créer une page WordPress pleine largeur. De nombreuses pages de thèmes WordPress ne sont pas entièrement présentées. Si vous ne voulez pas qu'il fonctionne comme il le fait, vous pouvez le modifier à l'aide d'un plugin. Dans la démonstration d'aujourd'hui, je vais vous montrer comment utiliser le plugin Beaver Builder pour créer une page pleine largeur. Vous pouvez apprendre à utiliser le plugin Beaver Builder en suivant le tutoriel Beaver Builder. C'est à vous de choisir un nouveau thème ou d'en créer un après avoir terminé le tutoriel. Après avoir cliqué sur le bouton Mettre à jour, vous pouvez apporter des modifications à vos pages.

Le plugin de création de pages le plus populaire, Beaver Builder, compte plus d'un million d'installations. Un site Web Page Builder peut avoir un large éventail de fonctionnalités qui vous permettent de le personnaliser pour répondre à vos besoins spécifiques. Ce qui rend une page vraiment belle doit toujours être utilisé. Avec l'aide de ces plugins supplémentaires, vous pouvez créer une page pleine largeur dans WordPress. Un autre plugin à explorer est le Live Composer. Vous pouvez personnaliser vos thèmes avec cet outil entièrement gratuit et disponible en téléchargement immédiat. En utilisant cette disposition, vous pouvez supprimer les barres latérales des pages WordPress. Est-il possible d'utiliser une mise en page pleine largeur avec un design personnalisé ?

Comment changer la pleine largeur d'un thème WordPress ?

Plus d'informations peuvent être trouvées dans notre guide étape par étape sur la façon d'installer les plugins WordPress. Une fois que vous l'avez activé, vous pouvez soit créer une nouvelle page, soit en modifier une existante. Sur le côté droit de votre écran, cliquez sur "Attributs de la page", puis sélectionnez un modèle pleine largeur dans le menu déroulant.

Qu'est-ce qu'une mise en page en boîte dans WordPress ?

Image par – https://wp.com

Une mise en page en boîte dans WordPress est une mise en page où le contenu est contenu dans une boîte. La boîte peut être de n'importe quelle taille et peut être centrée ou alignée à gauche ou à droite. La box peut aussi être fixe ou fluide.

Mises en page en boîte : la solution idéale pour les pages de base

Il existe de nombreuses façons de créer un site WordPress, mais il peut être nécessaire d'avoir une page de base avec seulement quelques fonctionnalités de base. Une page de base peut avoir un en-tête et un pied de page en haut, du contenu au milieu et une barre latérale à gauche ou à droite. La création de ces types de pages dans une mise en page en boîte est un excellent moyen de le faire car elle nécessite moins de codage. Une mise en page est une page préconçue qui contient du contenu d'espace réservé qui peut être remplacé par votre propre texte ou image. Les blocs sont utilisés dans la création de ces modèles, vous pouvez donc ajouter plus de blocs à une mise en page ou modifier le contenu existant. Pour cette raison, les mises en page qui utilisent les constructeurs de pages WordPress, telles que le modèle pleine largeur ou le modèle sans barre latérale , peuvent être créées. Une mise en page en boîte est la meilleure option si vous n'avez pas besoin de cloches et de sifflets.

Quelle est la largeur du conteneur dans WordPress ?

Vous pouvez modifier la largeur du conteneur sur le thème WordPress GeneratePress . Sous Apparence, cliquez sur la section Conteneur. Avec le curseur, vous pouvez modifier la largeur des pixels ou entrer votre nombre directement dans le champ (par exemple, 1200).

Pour créer un conteneur, vous devez d'abord choisir un nom, définir la taille de la police et la hauteur de ligne, puis appliquer quelques styles de base. Un conteneur occupera l'intégralité de son div parent, quelle que soit la largeur de son div parent.
Le conteneur sert de ligne de base à la grille et détermine son ordre. La ligne invisible sur laquelle chaque élément de la grille semble se trouver. En définissant automatiquement la largeur de base de la grille sur la même largeur que le conteneur, vous pouvez aligner votre contenu sur les lignes invisibles.
Les conteneurs font d'excellents centres de contenu parce que leur parent Div. est entièrement limité en largeur. Lorsque le parent d'un Div a une largeur de 980 pixels, le conteneur occupera 980 pixels, quelle que soit la taille du conteneur à l'intérieur.
Les conteneurs, en revanche, peuvent être difficiles à utiliser sur des appareils plus petits en raison de leur pleine largeur, ce qui les rend incompatibles avec certains. Pour centrer votre contenu dans un conteneur, vous devrez définir une marge pour décaler le contenu de son bord.

Comment utiliser les conteneurs WordPress pour améliorer la mise en page de votre site Web

Avec WordPress, vous pouvez créer votre propre conteneur et utiliser des types de conteneurs intégrés. Ils peuvent être utilisés pour gérer le contenu, créer des zones distinctes pour différents types de contenu, et bien plus encore. Les conteneurs facilitent l'organisation de votre site Web et améliorent sa mise en page. À l'aide de conteneurs, vous pouvez contrôler la largeur de votre contenu et vous assurer de sa cohérence sur tous les appareils. En allant dans Apparence - basculez le curseur sur la largeur souhaitée d'une section dans WordPress. Ils ont une liste de dispositions et de largeurs, ainsi que les largeurs de conteneur qu'ils utilisent. Le curseur permettant de modifier la largeur de votre zone de contenu peut être choisi en cliquant sur l' option Largeur du contenu . Les modifications seront mises en place dès qu'elles seront jugées appropriées.

Site Web de mise en page en boîte

Un site Web de mise en page en boîte est un site dans lequel le contenu du site est contenu dans une boîte ou des boîtes sur la page. Ce type de mise en page peut être utilisé pour créer un design visuellement intéressant ou pour mettre en valeur le contenu du site. Les dispositions en boîte sont souvent utilisées en combinaison avec d'autres éléments de conception, comme une disposition en grille.

Afin de créer un effet unique, chaque élément HTML utilise les propriétés margin, border et padding. Nous découvrirons le modèle de boîte dans ce didacticiel et comment chacune de ses couches fonctionne ensemble pour organiser le contenu sur un site Web. Chacune des quatre couches du modèle de boîte a un objectif spécifique et chacune a son propre ensemble de caractéristiques. Une propriété de bordure dans le modèle de boîte CSS est une propriété qui fait partie de la troisième couche. Cette fonctionnalité permet aux développeurs de manipuler les côtés des éléments HTML avec des propriétés spécifiques. Il n'y a qu'une seule propriété requise pour fonctionner comme une propriété de bordure. Bien que la propriété border-style ait une valeur par défaut de zéro, vous pouvez la remplacer par n'importe quel nombre de valeurs différentes.

La propriété padding, comme la propriété margin, a quatre propriétés. Il existe deux manières d'utiliser chaque propriété individuellement ou en tant que valeur de pile pour la propriété padding. Par exemple, si vous voulez une bordure rouge unie autour d'un paragraphe d'une largeur de 2, ce code le fera. Vous recevrez le résultat suivant si vous ajoutez la marge après l'ajout du code ci-dessus dans votre navigateur : Oui, c'est un peu mieux, n'est-ce pas ? C'est un espace suffisant pour que les éléments div répondent à leurs besoins. Avec l'ajout d'une marge de 20 pixels, chaque élément div a désormais une marge de 20. La propriété padding peut désormais être concentrée sur l'intérieur de la bordure, là où elle s'intègre dans le modèle de boîte.

Pourquoi devriez-vous passer à un modèle de site Web pleine largeur

Le domaine de la conception Web est en constante évolution car de nouvelles techniques plus sophistiquées sont développées quotidiennement. Les sites Web pleine largeur sont de plus en plus courants en ce moment, car ils tirent parti de l'espace supplémentaire qui apparaît sur les écrans plus grands. Si vous utilisez toujours une mise en page en boîte, vous devez passer à un modèle pleine largeur. Un certain nombre de modèles WordPress incluent un modèle sans barre latérale et un modèle pleine largeur, qui suppriment tous deux la barre latérale de la page. L'utilisation de cette fonctionnalité rend la conception plus moderne et plus propre, ce qui est idéal pour une utilisation avec les constructeurs de pages. Créez un site Web entièrement réactif avec l'un de ces modèles et lancez-vous immédiatement.