{"id":4382,"date":"2019-04-13T18:26:29","date_gmt":"2019-04-13T16:26:29","guid":{"rendered":"https:\/\/www.allaboutiweb.com\/?p=4382"},"modified":"2019-04-16T15:14:04","modified_gmt":"2019-04-16T13:14:04","slug":"votre-premier-site-web-reactif-everweb-4-les-blogs","status":"publish","type":"post","link":"https:\/\/www.allaboutiweb.com\/fr\/2019\/04\/votre-premier-site-web-reactif-everweb-4-les-blogs\/","title":{"rendered":"Votre premier site web r\u00e9actif EverWeb 4\u00a0: Les blogs"},"content":{"rendered":"

Dans l’article pr\u00e9c\u00e9dent de cette s\u00e9rie, \u00ab\u00a0Votre premier site web r\u00e9actif EverWeb 3\u00a0: Travailler avec des pages r\u00e9actives<\/a>\u00a0\u00bb, nous avons expliqu\u00e9 comment ajouter et d\u00e9placer des objets de pleine largeur et de largeur fixe autour d’une page r\u00e9active dans EverWeb<\/a>. Nous avons \u00e9galement explor\u00e9 les widgets EverWeb qui ont \u00e9t\u00e9 sp\u00e9cialement cr\u00e9\u00e9s pour \u00eatre utilis\u00e9s dans la conception de sites web r\u00e9actifs.<\/p>\n

Dans cet article, nous allons ajouter un blog r\u00e9actif \u00e0 un site web …<\/p>\n

Ajouter un blog r\u00e9actif \u00e0 votre site web<\/strong>
\nIl est facile d’ajouter un blog r\u00e9actif \u00e0 votre site web. Cliquez sur le bouton \u00ab\u00a0Add Page\u00a0\u00bb (Ajouter une page) dans la barre d’outils, puis s\u00e9lectionnez \u00ab\u00a0Blank Responsive Theme Template\u00a0\u00bb (mod\u00e8le de th\u00e8me r\u00e9actif vide) dans la colonne de gauche. Choisissez le style de page \u00ab\u00a0blog\u00a0\u00bb dans la partie droite de la page et cliquez sur \u00ab\u00a0Select\u00a0\u00bb (S\u00e9lectionner) pour ajouter le blog au projet de site web.<\/p>\n

Conversion d’un blog de largeur fixe en un blog r\u00e9actif<\/strong>
\nSi vous avez d\u00e9j\u00e0 cr\u00e9\u00e9 un blog, celui-ci a probablement une pr\u00e9sentation de page \u00e0 largeur fixe (c’est-\u00e0-dire centr\u00e9e ou align\u00e9e \u00e0 gauche). Vous pouvez changer cela pour qu’il soit \u00ab\u00a0r\u00e9actif\u00a0\u00bb dans la section Mise en page de l’onglet Param\u00e8tres de page de la fen\u00eatre Inspecteur pour les pages \u00ab\u00a0blog\u00a0\u00bb, \u00ab\u00a0publications\u00a0\u00bb et \u00ab\u00a0archive\u00a0\u00bb. Si vous venez de cr\u00e9er un blog de largeur fixe ou si vous avez un blog avec seulement quelques objets sur ses pages, le placement des objets sur les pages du blog ne devrait pas poser de probl\u00e8mes. Cependant, si vous convertissez plusieurs objets sur la page, EverWeb vous avertira que le changement de type de page ne peut pas \u00eatre annul\u00e9 et vous demandera si vous souhaitez continuer malgr\u00e9 tout. Modifier la pr\u00e9sentation des pages existantes de fixe \u00e0 r\u00e9active (et vice versa) est une d\u00e9cision importante \u00e0 prendre car les deux styles de mise en page sont fondamentalement diff\u00e9rents dans leur fonctionnement. Vous devrez donc g\u00e9n\u00e9ralement reconstruire les pages de votre projet. Lorsque vous passez d’une disposition de page fixe \u00e0 une page r\u00e9active, les objets seront d\u00e9plac\u00e9s et vos pages peuvent sembler tr\u00e8s confuses. Il faut donc \u00eatre prudent car, comme l’indique le message d’avertissement, il est impossible d’annuler le type de mise en page. Par cons\u00e9quent, il est pr\u00e9f\u00e9rable de dupliquer votre fichier de projet existant et de travailler sur celui-ci plut\u00f4t que sur un fichier de projet existant (et probablement d\u00e9j\u00e0 en production).<\/p>\n

Utiliser un blog r\u00e9actif<\/strong><\/p>\n

Si vous avez ajout\u00e9 un nouveau blog r\u00e9actif \u00e0 votre site web, vous remarquerez que le widget de blog (c\u2019est-\u00e0-dire l\u2019index du blog sur la page) est un objet pleine largeur. Une marge gauche et droite de taille 30 est incluse et peut \u00eatre modifi\u00e9e dans l’inspecteur de mesures si vous le souhaitez. Si vous avez converti votre blog \u00e0 partir d’une mise en page de largeur fixe, d\u00e9finissez le widget de blog en \u00ab\u00a0Full Width\u00a0\u00bb (pleine largeur) ??dans l’inspecteur des mesures, puis ajoutez des marges gauche et droite.<\/p>\n

Le logo \u00ab\u00a0Made with Love with EverWeb\u00a0\u00bb est inclus dans un widget Responsive Row dans le pied de page. Si vous avez converti votre blog en un blog r\u00e9actif, vous constaterez peut-\u00eatre que le contenu du pied de page a \u00e9t\u00e9 transf\u00e9r\u00e9 dans le corps principal de la page. Vous devrez donc d\u00e9placer ces objets vers le pied de page. L\u2019utilisation d\u2019un widget Responsive Row dans le pied de page permet de conserver ces objets correctement plac\u00e9s et redimensionnables dans la pr\u00e9sentation de page r\u00e9active.<\/p>\n

La r\u00e9organisation de votre blog, de vos publications et de vos pages d\u2019archives peut \u00eatre r\u00e9alis\u00e9e assez rapidement, mais n’oubliez pas que vous devrez peut-\u00eatre repenser votre design \u00e0 largeur fixe pour qu\u2019il s\u2019adapte aux m\u00e9thodes de conception r\u00e9actives. Cela peut impliquer d’explorer les nouveaux widgets r\u00e9actifs d’EverWeb, d’utiliser des widgets tiers ou de r\u00e9fl\u00e9chir \u00e0 de nouvelles fa\u00e7ons d’obtenir ce que vous voulez pour tous les appareils, du mobile au bureau. Nous traiterons de ce sujet dans notre prochain article\u00a0!<\/p>\n

Utiliser une image de couverture dans un blog<\/strong><\/p>\n

L’environnement de blogage EverWeb n’a gu\u00e8re chang\u00e9 entre la version 2.7 et la version 2.8, de nombreux aspects du blog \u00e9tant d\u00e9j\u00e0 pr\u00eats au r\u00e9actif, comme l\u2019\u00e9diteur de publication de blog et les moteurs de commentaires Facebook et Disqus. EverWeb 2.8 a introduit les options \u00ab\u00a0Max Image Width\u00a0\u00bb (Largeur d’image maximale) et \u00ab\u00a0Max Image Height\u00a0\u00bb (Hauteur d’image maximale) dans les param\u00e8tres du widget de la page \u00ab\u00a0posts\u00a0\u00bb. Ces param\u00e8tres d\u00e9finissent la taille souhait\u00e9e pour l’image de couverture de publication de blog. S\u00e9lectionnez d’abord l’image que vous souhaitez utiliser pour votre couverture \u00e0 l’aide du bouton \u00ab\u00a0Post Image\u00a0\u00bb (Image de l\u2019article), \u00ab\u00a0Choose\u2026\u00a0\u00bb (Choisir …). S\u00e9lectionnez ensuite l’emplacement d’affichage de l’image \u00e0 l’aide de l’option \u00ab\u00a0Style\u00a0\u00bb. L’image peut \u00eatre au-dessus du message ou align\u00e9e \u00e0 gauche ou \u00e0 droite du message. Utilisez ensuite les options Largeur \/ Hauteur maximales de l’image pour d\u00e9finir la hauteur et la largeur maximales de l’image. Si vous choisissez z\u00e9ro, l’image sera affich\u00e9e dans sa taille d’origine.<\/p>\n

Dans cet article, nous avons bri\u00e8vement \u00e9voqu\u00e9 la conversion d’un site web d’une mise en page de largeur fixe en une mise en page r\u00e9active. Dans le prochain blog, nous examinerons ce sujet de mani\u00e8re plus approfondie…<\/p>\n

Si vous avez un commentaire, une question ou des conseils pour d’autres utilisateurs EverWeb, veuillez nous en informer ! Nous aimerions avoir de vos nouvelles !<\/p>\n","protected":false},"excerpt":{"rendered":"

Dans l’article pr\u00e9c\u00e9dent de cette s\u00e9rie, \u00ab\u00a0Votre premier site web r\u00e9actif EverWeb 3\u00a0: Travailler avec des pages r\u00e9actives\u00a0\u00bb, nous avons expliqu\u00e9 comment ajouter et d\u00e9placer des objets de pleine largeur et de largeur fixe autour d’une page r\u00e9active dans EverWeb. Nous avons \u00e9galement explor\u00e9 les widgets EverWeb qui ont \u00e9t\u00e9 sp\u00e9cialement cr\u00e9\u00e9s pour \u00eatre utilis\u00e9s dans la conception de sites web r\u00e9actifs. Dans cet article, nous allons ajouter un blog r\u00e9actif \u00e0 un site web … Ajouter un blog r\u00e9actif \u00e0 votre site web Il est facile d’ajouter un blog r\u00e9actif \u00e0 votre site web. Cliquez sur le bouton \u00ab\u00a0Add […]<\/p>\n","protected":false},"author":32825,"featured_media":4384,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[264,258,265,259,249,266,261],"tags":[],"class_list":["post-4382","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-didacticiels","category-everweb-fr","category-logiciel","category-site-web-reactif","category-trucs-et-astuces","category-web-design-fr","category-widgets-fr"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/posts\/4382\/"}],"collection":[{"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/posts\/"}],"about":[{"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/types\/post\/"}],"author":[{"embeddable":true,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/users\/32825\/"}],"replies":[{"embeddable":true,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/comments\/?post=4382"}],"version-history":[{"count":2,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/posts\/4382\/revisions\/"}],"predecessor-version":[{"id":4386,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/posts\/4382\/revisions\/4386\/"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/media\/4384\/"}],"wp:attachment":[{"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/media\/?parent=4382"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/categories\/?post=4382"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.allaboutiweb.com\/fr\/wp-json\/wp\/v2\/tags\/?post=4382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}