Faire en-tête, la navigation et le pied de page largeur dans Blogger - XOmisse
S'il vous plaît noter que ceci est juste pour rendre la zone plus large, de sorte que vous pouvez appliquer CSS à plein écran. Si vous utilisez une image d'en-tête et l'image est seulement 900 pixels de largeur, ce tutoriel ne modifiera pas cela. Il vous permettra d'ajouter une couleur d'arrière-plan en utilisant le CSS pour couvrir toute la largeur de l'écran derrière votre image.
avant + après exemple
Q. Quelles sont ces valeurs avec le $ au préalable dans mon modèle?
Tout code dans votre modèle qui ressemble à (exemple) $; est le code qui est essentiellement contrôlé par les variables en haut de votre CSS et est utilisé par le concepteur de modèle (modèle> Edition> Personnaliser). Vous pouvez modifier le code variable par défaut ou modifier la principale zone CSS (changement des valeurs variables à des valeurs « réelles », comme une couleur ou le numéro), mais si vous supprimez le code de variable puis de modifier les options liées dans le modèle Designer ne fonctionne pas prendre soin en le faisant. Plus à ce sujet dans un prochain tutoriel.
Comment rendre votre tête, navigation + pied pleine largeur
1. Tout d'abord nous devons aller à votre principale zone CSS. Aller au modèle> Modifier le code HTML et cliquez sur la flèche noire sur la gauche à côté du code ci-dessous
2. Entre
Ceci est le code dont nous avons parlé plus tôt. Les $ (content.padding) est réglé par défaut à 10px et $ (content.padding.horizontal) est 40px comme indiqué dans la section variable. Nous voulons supprimer ce rembourrage 40px qui est de chaque côté de notre contenu afin que l'en-tête ne sera pas d'espaces. Changer pour ressembler
ou si vous préférez
4. Maintenant, regardez la section de votre modèle ci-dessous qui ressemble à
5. Entre
cela va changer notre largeur de blog pour être la taille complète du navigateur.
7. Encore une fois trouver et ajouter ce qui suit au-dessus
8. Enregistrez le modèle et vous devriez être en mesure de voir un en-tête complet, navigation et notes de bas avec votre contenu principal restant la même largeur que précédemment. Je l'ai testé cela dans tous les modèles Blogger par défaut et il fonctionne, quelques modèles ont besoin de plus / moins édition que les autres.
l'image d'en-tête Center?
Parce que vous faites ces zones de pleine largeur, ils seront probablement par défaut d'apparaître sur la gauche sauf si vous les avez déjà codé autrement. Si vous avez besoin pour centrer l'image d'en-tête, consultez ce tutoriel.
Fait tout comme vous avez dit, contenu intérieur EXPT chose. J'ai là que « padding: 0; ». Donc rien comme ça: « padding: $ (content.padding) $ (content.padding.horizontal); ». Que puis-je faire? Et continuer, Si je mets là que: « .content-intérieure < padding: 0px; >» Il est mon fond tout blanc blog ...
Bonjour. Quelle est votre URL afin que je puisse vérifier le modèle que vous utilisez et votre code? Vous devez sauter la section variable et ne rien changer là-bas, si .content-intérieure est déjà réglé sur padding: 0px; puis le laisser tel quel.
Je suis aussi allé en arrière et prévisualisé chaque changement avant que je fini par revenir, mais rien ne semblait faire une différence en laissant l'arrière-plan montrant à travers sur les côtés du contenu principal. J'ai aussi seulement une colonne de contenu et aucune barre latérale, je ne sais pas si cela fait une différence.
J'ai fini par revenir à mon modèle enregistré pour l'instant.
Merci de votre aide!
salut! Assurez-vous d'avoir terminé l'étape 6 exactement au bon endroit avant]]> . Je ne peux pas être beaucoup plus d'aide sans voir le code dans votre modèle afin de vérifier tout configuré correctement et pas en conflit avec d'autres codes. Ont vérifié votre code blogs et il devrait certainement travailler.
J'ai ce problème et ma barre de navigation a été rembourré, mais je ne peux pas à centrer. Besoin d'aide et suivi toutes les instructions à un tee-shirt, mais rien ne fonctionne, 1ère minuterie à tout cela. Très apprécié toute aide dans ce!
[** PROBLÈME: NAVBAR est pas centré mais aligné à gauche]
[** Ce que je veux: Pour centrer la barre de navigation après que j'ai largeur le blogueur]
Bonjour. Trouver #cssnav et ajouter du texte-align: center; entre les crochets # 128578;
Merci! Cela a résolu!
Permettez-moi de demander est-il possible de mettre Lettrine dans l'en-tête de la description du blogueur?
Si oui pouvez-vous faire un tutoriel sur ce ou envoyez-moi le lien.
Encore une fois merci et prendre soin!
Hey, ce serait similaire à ce tutoriel, mais en utilisant le titre en-têtes ou classe de description au lieu des sélecteurs (h3.post-titre) affichés.
Merci, m'a beaucoup aidé.
Mais maintenant, comment puis-je faire rester centré le contenu de pied de page? La zone principale contenu est centrée très bien, mais les widgets du pied de page encore à la largeur consacre 100%. Que fais-je?
Merci encore pour votre aide! Ce fut le meilleur / plus simple tutoriel, j'ai trouvé en ligne!
tutoriel génial!
Le seul problème que j'ai est que je ne peux pas centrer en-tête de mon blog. Pourriez-vous m'aider?
Merci!
Bonjour je vous remercie! Essayez les étapes de ce tutoriel et laissez-moi savoir s'ils travaillent pour vous.
Comment puis-je faire ma tête toute la largeur sans mon pied de page ou la barre de navigation la pleine largeur?
Je me demande aussi si vous pouvez me dire comment avoir une image comme un ruban comme l'arrière-plan pour ma barre de navigation?
Merci,
Eilidh xo
Vous devez faire ce tutoriel pour enlever la largeur maximale qui est définie sur votre blog, à l'étape 6 ajouter les sélecteurs de tous les éléments à l'exclusion l'en-tête. Cette étape leur donnera la largeur maximale à nouveau tout en gardant la tête pleine largeur. Cela a-t-il du sens? Ajouter background-image: url ( 'URL DIRECT IMAGE'); à la barre de navigation dans votre CSS, remplacer URL de l'image avec le lien vers le fichier image.
Il a encore un petit bar à droite qui font des choses pas vraiment centrées. Pouvez-vous aider? Merci!
Et, je voudrais que mes onglets de la page Aligné à gauche avec ma section « Post », pourrais-je le faire? Merci encore.
Oui merci! Je veux dire la zone de contenu principal. Je voudrais plus d'espace blanc autour de la zone de contenu principal. Quand je vais dans Customize Template> Ajuster la largeur, il n'y a qu'une option pour régler la barre latérale droite et le blog entier. Si je régler la barre latérale droite, il est tout simplement la barre de droite plus grande et scoots la zone de contenu principale sur. J'aime la barre latérale de la taille, il est. Y at-il une autre option que vous connaissez? Ou tutoriel que vous offrez?
SALUT!
Je ne pouvais pas trouver ... dans mon HTML. Pouvez-vous me guider où et qui de suivre les tutoriels ci-dessus? Votre aide est tres apprecie. # 128521;