{"id":111508,"date":"2023-05-17T12:02:28","date_gmt":"2023-05-17T12:02:28","guid":{"rendered":"https:\/\/elementor.com\/blog\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/"},"modified":"2025-12-01T15:17:39","modified_gmt":"2025-12-01T13:17:39","slug":"presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid","status":"publish","type":"post","link":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/","title":{"rendered":"Pr\u00e9sentation d&rsquo;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid"},"content":{"rendered":"\n<p>Am\u00e9liorez vos capacit\u00e9s de conception et profitez de nouvelles fa\u00e7ons de styliser votre site web avec <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/\" title=\"Elementor\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"1283\">Elementor<\/a> 3.13 afin de r\u00e9aliser des designs uniques qui maintiennent l&rsquo;engagement de vos visiteurs.\nCette version inclut une nouvelle option de mise en page dans les conteneurs &#8211; <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/what-is-css\/\" title=\"CSS\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"4532\">CSS<\/a> Grid, une excellente fa\u00e7on de concevoir des mises en page sophistiqu\u00e9es et l\u00e9g\u00e8res tout en maintenant un haut niveau de coh\u00e9rence.\nDe plus, cette mise \u00e0 jour introduit plus d&rsquo;options de style dans le widget Menu et ajoute de nouvelles capacit\u00e9s \u00e0 la nouvelle barre sup\u00e9rieure.  <\/p>\n\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Container-CSS-Grid.png\" alt=\"\" class=\"wp-image-85167\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\"><strong>Nouveau &#8211; Conteneur CSS Grid &#8211; Concevez des mises en page l\u00e9g\u00e8res, r\u00e9actives et professionnelles<\/strong><\/h2>\n\n<p>D\u00e9sormais, lorsque vous ajoutez un conteneur, vous pouvez choisir entre des conteneurs Flexbox ou Grid.\nL&rsquo;utilisation des conteneurs Grid est id\u00e9ale pour les mises en page de type grille, aide \u00e0 maintenir l&rsquo;alignement des \u00e9l\u00e9ments dans le conteneur et r\u00e9duit la courbe d&rsquo;apprentissage associ\u00e9e \u00e0 la transition de la mise en page section-colonne \u00e0 la mise en page conteneur.  <\/p>\n\n<p>Avec les conteneurs Grid, vous pouvez choisir le nombre de lignes et de colonnes pour composer votre grille, d\u00e9terminer la distance entre vos colonnes et lignes \u00e0 l&rsquo;aide du contr\u00f4le des \u00e9carts, et choisir si vous souhaitez que l&rsquo;auto-flux se base sur la colonne ou la ligne.\nVous pouvez \u00e9galement justifier et aligner le contenu et les \u00e9l\u00e9ments, de la m\u00eame mani\u00e8re que vous le feriez avec un conteneur Flexbox.  <\/p>\n\n<p>Chaque cellule de la grille peut accepter un \u00e9l\u00e9ment, qui peut \u00eatre stylis\u00e9 et \u00e9dit\u00e9 comme vous le feriez normalement.\nPour atteindre un niveau de sophistication plus \u00e9lev\u00e9, vous pouvez placer un conteneur Flexbox \u00e0 l&rsquo;int\u00e9rieur de la cellule d&rsquo;une grille et y placer autant d&rsquo;\u00e9l\u00e9ments que vous le souhaitez.  <\/p>\n\n<p>Pour utiliser le conteneur Grid, assurez-vous d&rsquo;activer les fonctionnalit\u00e9s du conteneur Flexbox et du conteneur Grid depuis le tableau de bord WordPress \u2192 Elementor \u2192 Param\u00e8tres \u2192 Fonctionnalit\u00e9s.<\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-4.png\" alt=\"\" class=\"wp-image-85169\"\/><\/figure>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\"><strong>[Pro] Nouvelles capacit\u00e9s de style dans le widget Menu<\/strong><\/h2>\n\n<p>Dans la version pr\u00e9c\u00e9dente, Elementor a introduit un nouveau widget Menu, qui vous permet de cr\u00e9er des menus simples \u00e0 un seul niveau et des menus d\u00e9roulants sophistiqu\u00e9s avec du contenu imbriqu\u00e9.\nCe widget est une r\u00e9volution pour la cr\u00e9ation de sites web, vous permettant de concevoir des menus beaux et fonctionnels pour vos sites. <\/p>\n\n<p><a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/pro\/\" title=\"Elementor Pro\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"2910\">Elementor Pro<\/a> 3.13 introduit deux nouvelles capacit\u00e9s d\u00e9sormais disponibles dans le widget Menu :<\/p>\n\n<ul class=\"wp-block-list\"><li><strong>Ic\u00f4nes dans le niveau sup\u00e9rieur du menu<\/strong> &#8211; cette nouvelle capacit\u00e9 de style vous permet d&rsquo;am\u00e9liorer la conception de vos menus en ajoutant des ic\u00f4nes accrocheuses qui attirent l&rsquo;attention des visiteurs.\nAvec une vari\u00e9t\u00e9 d&rsquo;ic\u00f4nes \u00e0 choisir dans la biblioth\u00e8que d&rsquo;ic\u00f4nes, ou la possibilit\u00e9 de t\u00e9l\u00e9charger n&rsquo;importe quel <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/svg\/\" title=\"SVG\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"4911\">SVG<\/a>, vous pouvez personnaliser vos menus pour correspondre au style de votre site web et les faire ressortir. <\/li><\/ul>\n\n<p><strong>\u00c9tat actif pour les liens d&rsquo;ancrage<\/strong> &#8211; indiquez aux visiteurs du site quelle partie de la page ils ont fait d\u00e9filer ou cliqu\u00e9 lorsque votre menu inclut des liens d&rsquo;ancrage.\nDe cette mani\u00e8re, vous pouvez am\u00e9liorer l&rsquo;exp\u00e9rience des visiteurs en les aidant \u00e0 naviguer sur votre site. <\/p>\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Editor-UI-Revamp-Next-Steps.png\" alt=\"\" class=\"wp-image-85170\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\">Am\u00e9liorations de la barre sup\u00e9rieure &#8211; Continuation de la refonte de l&rsquo;interface utilisateur d&rsquo;Elementor<\/h2>\n\n<p>Dans Elementor 3.12, nous avons commenc\u00e9 le d\u00e9ploiement progressif des changements \u00e0 venir de l&rsquo;interface Elementor.\nCes changements sont \u00e9crits en React, ce qui am\u00e9liore les performances et permet une croissance et une \u00e9chelle futures du produit.\nDe plus, ces changements favorisent les meilleures pratiques d&rsquo;Elementor, r\u00e9sultant en une meilleure exp\u00e9rience utilisateur plus fluide.   <\/p>\n\n<p>L&rsquo;un des plus grands changements est la nouvelle barre sup\u00e9rieure, introduite comme une exp\u00e9rience que vous pouvez activer depuis la page des fonctionnalit\u00e9s d&rsquo;Elementor dans WordPress (Elementor \u2192 Param\u00e8tres \u2192 Fonctionnalit\u00e9s \u2192 Barre sup\u00e9rieure de l&rsquo;\u00e9diteur).\nDans cette version, la barre sup\u00e9rieure inclut deux mises \u00e0 jour :  <\/p>\n\n<ol class=\"wp-block-list\"><li><strong>Options de sauvegarde dans le bouton Publier<\/strong> &#8211; bien que ce ne soit pas une nouvelle capacit\u00e9, cette fonctionnalit\u00e9 n&rsquo;\u00e9tait pas disponible dans la premi\u00e8re version de la barre sup\u00e9rieure.\nD\u00e9sormais, vous avez acc\u00e8s \u00e0 toutes les options de sauvegarde disponibles dans l&rsquo;\u00e9diteur &#8211; Enregistrer en tant que brouillon, Enregistrer en tant que mod\u00e8le et Conditions d&rsquo;affichage (le cas \u00e9ch\u00e9ant).\nCela signifie \u00e9galement que la barre sup\u00e9rieure inclut d\u00e9sormais toutes les capacit\u00e9s pr\u00e9c\u00e9demment disponibles dans l&rsquo;interface utilisateur h\u00e9rit\u00e9e de l&rsquo;\u00e9diteur.   <\/li><li><strong>Navigation de page<\/strong> &#8211; une nouvelle fonctionnalit\u00e9 qui rationalisera votre flux de travail et rendra la transition entre diff\u00e9rentes pages et parties de th\u00e8me plus fluide.\nCliquer sur l&rsquo;indication de la page au centre de la barre sup\u00e9rieure ouvrira un menu d\u00e9roulant qui inclut les cinq derni\u00e8res pages \/ publications \/ parties de th\u00e8me sur lesquelles vous avez travaill\u00e9, et vous permettra de rediriger vers l&rsquo;une d&rsquo;elles en un seul clic, sans avoir \u00e0 revenir au tableau de bord WordPress.  <\/li><\/ol>\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Automatically-Populate-The-Post-Excerpt-from-Your-Posts-Content.png\" alt=\"\" class=\"wp-image-85171\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\"><strong>[Pro] Remplissez dynamiquement votre extrait de publication avec le contenu de votre publication<\/strong><\/h2>\n\n<p>Auparavant, l&rsquo;utilisation du widget Extrait de publication ou de la balise dynamique dans WordPress signifiait que le contenu se remplissait automatiquement \u00e0 partir de l&rsquo;extrait personnalis\u00e9 que vous aviez ins\u00e9r\u00e9 manuellement dans WordPress.\nCependant, avec Elementor 3.13, vous avez maintenant la possibilit\u00e9 de choisir si vous souhaitez que le contenu se remplisse automatiquement \u00e0 partir des premiers caract\u00e8res de votre publication ou de l&rsquo;extrait personnalis\u00e9 dans WordPress.\nCette mise \u00e0 jour r\u00e9sout l&rsquo;une des principales demandes depuis l&rsquo;introduction du constructeur de boucles, et en particulier depuis la possibilit\u00e9 d&rsquo;ajouter le widget Extrait de publication dans votre \u00e9l\u00e9ment de boucle.  <\/p>\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Performance-Improvements-2.png\" alt=\"\" class=\"wp-image-85180\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\"><strong>Nouveau : Exploitez Elementor AI, parfaitement adapt\u00e9 \u00e0 Elementor <\/strong><\/h2>\n\n<p>Elementor 3.13 inclut \u00e9galement <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/products\/ai\/\" title=\"Elementor AI\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"2303\">Elementor AI<\/a>, qui est int\u00e9gr\u00e9 nativement dans l&rsquo;\u00e9diteur, et transformera la fa\u00e7on dont vous cr\u00e9ez des sites web.\nCette version introduit la premi\u00e8re phase d&rsquo;Elementor AI, qui vous permet de cr\u00e9er du texte et du code avec la puissance de l&rsquo;IA.\nVous pouvez l&rsquo;utiliser pour cr\u00e9er du contenu \u00e0 partir de z\u00e9ro, am\u00e9liorer le contenu existant sur votre site web, le traduire vers n&rsquo;importe quel site web, et plus encore.\nDe plus, vous pouvez utiliser Elementor AI pour \u00e9crire du code pour le CSS personnalis\u00e9 ou le code personnalis\u00e9 (n\u00e9cessite Elementor Pro ou Hosting), ou des extraits de code HTML.\nVous pouvez en savoir plus sur ce que vous pouvez faire avec Elementor AI <a href=\"https:\/\/elementor.com\/blog\/introducing-elementor-ai\/\">ici<\/a>.     <\/p>\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Performance-Improvements-1.png\" alt=\"\" class=\"wp-image-85173\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\"><strong>Am\u00e9liorations des performances<\/strong><\/h2>\n\n<p>Dans les versions pr\u00e9c\u00e9dentes, les am\u00e9liorations de performance se concentraient sur les <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/widgets\/\" title=\"widgets\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"4034\">widgets<\/a> les plus courants sur les pages principales.\nAvec Elementor 3.13, l&rsquo;accent a \u00e9t\u00e9 mis sur les widgets utilis\u00e9s principalement sur les pages internes, o\u00f9 les visiteurs du site passent souvent la plupart de leur temps. <\/p>\n\n<p>Les widgets Bo\u00eete d&rsquo;auteur, Infos sur l&rsquo;article et Liste de prix affichent des images et des photos de profil d&rsquo;utilisateur, ces images ont maintenant un chargement diff\u00e9r\u00e9 appliqu\u00e9.\nCe changement devrait am\u00e9liorer le chargement initial de vos pages internes. <\/p>\n\n<p>De plus, puisque l&rsquo;en-t\u00eate appara\u00eet au-dessus du pli, il devrait toujours se charger imm\u00e9diatement lors du chargement de la page.\nPar cons\u00e9quent, le chargement diff\u00e9r\u00e9 a \u00e9t\u00e9 supprim\u00e9 des en-t\u00eates pour am\u00e9liorer l&rsquo;exp\u00e9rience des visiteurs lors de l&rsquo;utilisation de l&rsquo;exp\u00e9rience de chargement diff\u00e9r\u00e9 des images d&rsquo;arri\u00e8re-plan. <\/p>\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2401\" height=\"1261\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/Accessibility.png\" alt=\"\" class=\"wp-image-85174\"\/><\/figure>\n\n<h2 class=\"wp-block-heading\"><strong>Am\u00e9liorations de l&rsquo;accessibilit\u00e9<\/strong><\/h2>\n\n<p>Elementor 3.13 est rempli de r\u00e9glages et de corrections qui am\u00e9liorent l&rsquo;accessibilit\u00e9 de votre site web, ainsi que de l&rsquo;\u00e9diteur.\nDans cette version, nous nous sommes concentr\u00e9s sur la navigation au clavier, la mise en \u0153uvre de balises ARIA suppl\u00e9mentaires, la correction des probl\u00e8mes de conformit\u00e9 ARIA existants et l&rsquo;application de balisage s\u00e9mantique.  <\/p>\n\n<p>Vous pouvez en savoir plus sur ces am\u00e9liorations d&rsquo;accessibilit\u00e9 dans le <a href=\"https:\/\/developers.elementor.com\/elementor-3-13-developers-update\/\">Blog des d\u00e9veloppeurs<\/a>. <\/p>\n\n<h2 class=\"wp-block-heading\"><strong>Profitez de plus d&rsquo;options de style et de design pour des exp\u00e9riences de site web hautement marqu\u00e9es et engageantes <\/strong><\/h2>\n\n<p>\u00c9levez le design de votre site web et d\u00e9bloquez de nouvelles possibilit\u00e9s de style pour personnaliser votre site web en utilisant Elementor 3.13.\nAvec les conteneurs de grille CSS, vous pouvez cr\u00e9er des mises en page l\u00e9g\u00e8res, flexibles et en grille de mani\u00e8re transparente, et avec les nouvelles capacit\u00e9s de style dans le widget de menu, vous pouvez cr\u00e9er des designs distinctifs qui captivent et maintiennent l&rsquo;engagement de vos visiteurs.  <\/p>\n\n<p>Cette version inclut \u00e9galement de nouvelles capacit\u00e9s dans la fonctionnalit\u00e9 de la barre sup\u00e9rieure, ce qui signifie que toutes les capacit\u00e9s pr\u00e9c\u00e9demment disponibles dans l&rsquo;\u00e9diteur sont maintenant disponibles lors de l&rsquo;utilisation de l&rsquo;exp\u00e9rience de la barre sup\u00e9rieure. <\/p>\n\n<p>Elementor 3.13 inclut \u00e9galement un essai gratuit d&rsquo;Elementor AI, qui transformera la fa\u00e7on dont vous construisez des sites web en vous permettant de cr\u00e9er instantan\u00e9ment du texte original, d&rsquo;am\u00e9liorer le texte existant et de coder pour am\u00e9liorer votre site web et son design. <\/p>\n\n<p>Essayez les nouvelles fonctionnalit\u00e9s d&rsquo;Elementor 3.13 et faites-nous savoir ce que vous en pensez dans les commentaires ci-dessous.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l&rsquo;exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication. <\/p>\n","protected":false},"author":2024207,"featured_media":107403,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[218,230,238],"tags":[],"marketing_persona":[],"marketing_intent":[],"class_list":["post-111508","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog-fr","category-elementor-fr","category-nouvelles-fonctionnalites-fr"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Pr\u00e9sentation d&#039;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid<\/title>\n<meta name=\"description\" content=\"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l&#039;exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Pr\u00e9sentation d&#039;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid\" \/>\n<meta property=\"og:description\" content=\"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l&#039;exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/elemntor\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-05-17T12:02:28+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-01T13:17:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2401\" \/>\n\t<meta property=\"og:image:height\" content=\"1260\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Gabriella Laster\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@elemntor\" \/>\n<meta name=\"twitter:site\" content=\"@elemntor\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Gabriella Laster\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\"},\"author\":{\"name\":\"Gabriella Laster\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/840e05baf69a34292aefbd48f3372a2a\"},\"headline\":\"Pr\u00e9sentation d&rsquo;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid\",\"datePublished\":\"2023-05-17T12:02:28+00:00\",\"dateModified\":\"2025-12-01T13:17:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\"},\"wordCount\":1611,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#organization\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png\",\"articleSection\":[\"Blog\",\"Elementor\",\"Nouvelles fonctionnalit\u00e9s\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\",\"url\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\",\"name\":\"Pr\u00e9sentation d'Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png\",\"datePublished\":\"2023-05-17T12:02:28+00:00\",\"dateModified\":\"2025-12-01T13:17:39+00:00\",\"description\":\"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l'exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.\",\"breadcrumb\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png\",\"width\":2401,\"height\":1260},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/elementor.com\/blog\/fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blog\",\"item\":\"https:\/\/elementor.com\/blog\/fr\/category\/blog-fr\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Pr\u00e9sentation d&#8217;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#website\",\"url\":\"https:\/\/elementor.com\/blog\/fr\/\",\"name\":\"Elementor\",\"description\":\"Website Builder for WordPress\",\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/elementor.com\/blog\/fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#organization\",\"name\":\"Elementor\",\"url\":\"https:\/\/elementor.com\/blog\/fr\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"width\":225,\"height\":225,\"caption\":\"Elementor\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/elemntor\/\",\"https:\/\/x.com\/elemntor\",\"https:\/\/www.instagram.com\/elementor\/\",\"https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1\",\"https:\/\/en.wikipedia.org\/wiki\/Elementor\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/840e05baf69a34292aefbd48f3372a2a\",\"name\":\"Gabriella Laster\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d05a13ed44651430b9565d128ead6845482cddcafc9c725e89ecf083b78288e9?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d05a13ed44651430b9565d128ead6845482cddcafc9c725e89ecf083b78288e9?s=96&d=mm&r=g\",\"caption\":\"Gabriella Laster\"},\"description\":\"Gabriella is a Product Marketing Director at Elementor, where she helps bridge the gap between complex web technology and seamless user experiences. With a decade of experience in marketing and entrepreneurship, she\u2019s passionate about empowering creators to build their digital dreams.\",\"url\":\"https:\/\/elementor.com\/blog\/fr\/author\/gabriellal\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Pr\u00e9sentation d'Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid","description":"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l'exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/","og_locale":"fr_FR","og_type":"article","og_title":"Pr\u00e9sentation d'Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid","og_description":"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l'exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.","og_url":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/","og_site_name":"Blog","article_publisher":"https:\/\/www.facebook.com\/elemntor\/","article_published_time":"2023-05-17T12:02:28+00:00","article_modified_time":"2025-12-01T13:17:39+00:00","og_image":[{"width":2401,"height":1260,"url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png","type":"image\/png"}],"author":"Gabriella Laster","twitter_card":"summary_large_image","twitter_creator":"@elemntor","twitter_site":"@elemntor","twitter_misc":{"\u00c9crit par":"Gabriella Laster","Dur\u00e9e de lecture estim\u00e9e":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/"},"author":{"name":"Gabriella Laster","@id":"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/840e05baf69a34292aefbd48f3372a2a"},"headline":"Pr\u00e9sentation d&rsquo;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid","datePublished":"2023-05-17T12:02:28+00:00","dateModified":"2025-12-01T13:17:39+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/"},"wordCount":1611,"commentCount":0,"publisher":{"@id":"https:\/\/elementor.com\/blog\/fr\/#organization"},"image":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png","articleSection":["Blog","Elementor","Nouvelles fonctionnalit\u00e9s"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/","url":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/","name":"Pr\u00e9sentation d'Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png","datePublished":"2023-05-17T12:02:28+00:00","dateModified":"2025-12-01T13:17:39+00:00","description":"Elementor 3.13 inclut des conteneurs CSS Grid, de nouvelles options de style et de personnalisation dans le widget Menu, \u00e9tend l'exp\u00e9rience de la barre sup\u00e9rieure et vous offre des options de contenu dynamique suppl\u00e9mentaires pour les extraits de publication.","breadcrumb":{"@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#primaryimage","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/05\/cover-3.png","width":2401,"height":1260},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/blog\/fr\/presentation-delementor-3-13-creez-des-mises-en-page-de-sites-web-legeres-et-flexibles-avec-css-grid\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/elementor.com\/blog\/fr\/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https:\/\/elementor.com\/blog\/fr\/category\/blog-fr\/"},{"@type":"ListItem","position":3,"name":"Pr\u00e9sentation d&#8217;Elementor 3.13 \u2013 Cr\u00e9ez des mises en page de sites web l\u00e9g\u00e8res et flexibles avec CSS Grid"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/blog\/fr\/#website","url":"https:\/\/elementor.com\/blog\/fr\/","name":"Elementor","description":"Website Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/blog\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/blog\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/elementor.com\/blog\/fr\/#organization","name":"Elementor","url":"https:\/\/elementor.com\/blog\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/elementor.com\/blog\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","width":225,"height":225,"caption":"Elementor"},"image":{"@id":"https:\/\/elementor.com\/blog\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/elemntor\/","https:\/\/x.com\/elemntor","https:\/\/www.instagram.com\/elementor\/","https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1","https:\/\/en.wikipedia.org\/wiki\/Elementor"]},{"@type":"Person","@id":"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/840e05baf69a34292aefbd48f3372a2a","name":"Gabriella Laster","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/elementor.com\/blog\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d05a13ed44651430b9565d128ead6845482cddcafc9c725e89ecf083b78288e9?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d05a13ed44651430b9565d128ead6845482cddcafc9c725e89ecf083b78288e9?s=96&d=mm&r=g","caption":"Gabriella Laster"},"description":"Gabriella is a Product Marketing Director at Elementor, where she helps bridge the gap between complex web technology and seamless user experiences. With a decade of experience in marketing and entrepreneurship, she\u2019s passionate about empowering creators to build their digital dreams.","url":"https:\/\/elementor.com\/blog\/fr\/author\/gabriellal\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/posts\/111508","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/users\/2024207"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/comments?post=111508"}],"version-history":[{"count":3,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/posts\/111508\/revisions"}],"predecessor-version":[{"id":111519,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/posts\/111508\/revisions\/111519"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/media\/107403"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/media?parent=111508"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/categories?post=111508"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/tags?post=111508"},{"taxonomy":"marketing_persona","embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/marketing_persona?post=111508"},{"taxonomy":"marketing_intent","embeddable":true,"href":"https:\/\/elementor.com\/blog\/fr\/wp-json\/wp\/v2\/marketing_intent?post=111508"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}