{"id":237,"date":"2020-10-07T14:49:45","date_gmt":"2020-10-07T14:49:45","guid":{"rendered":"https:\/\/cinnk.com\/index.php\/2020\/10\/07\/comment-charger-des-images-et-les-inserer-dans-un-article\/"},"modified":"2020-10-07T14:49:45","modified_gmt":"2020-10-07T14:49:45","slug":"comment-charger-des-images-et-les-inserer-dans-un-article","status":"publish","type":"post","link":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/","title":{"rendered":"Comment charger des images et les ins\u00e9rer dans un article"},"content":{"rendered":"

Comment charger des images et m\u00e9dias<\/strong> sur votre site puis les int\u00e9grez correctement \u00e0 vos articles.<\/strong><\/p>\n


\nComment charger des images et les ins\u00e9rer dans un article Vous chargez des images et m\u00e9dias sur votre site puis voulez les int\u00e9grez correctement \u00e0 vos articles afin de les illustrer. Probl\u00e8me :
\nVous chargez des images et m\u00e9dias sur votre site puis les int\u00e9grez \u00e0 vos articles afin de les illustrer.
\n Solution :
\nAfin d’organiser correctement tous vos m\u00e9dias, Joomla! poss\u00e8de un gestionnaire d’images. Pour y acc\u00e9der, connectez-vous \u00e0 l’administration de votre site et rendez-vous dans Contenu > Gestion des m\u00e9dias .La page suivante s’affiche (avec les donn\u00e9es d’exemple de Joomla!) :
\n 
\n 1 \u2013 Vous pouvez naviguer dans l’arborescence de vos m\u00e9dias. 2 \u2013 Le r\u00e9pertoire dans lequel vous \u00eates en train de naviguer. 3 \u2013 Transf\u00e9rer de nouveaux m\u00e9dias sur votre site. 4 \u2013 Cr\u00e9er un nouveau dossier afin d’organiser vos m\u00e9dias. 5 \u2013 Supprimer des m\u00e9dias ou des dossiers. 6 \u2013 Param\u00e8tres du gestionnaire de m\u00e9dias. 7 \u2013 R\u00e9gler l’affichage de vos m\u00e9dias.
\nAfin de vous y retrouver plus facilement par la suite, il est conseill\u00e9 de cr\u00e9er une arborescence compr\u00e9hensible, surtout si vous \u00eates amen\u00e9 \u00e0 avoir de nombreux m\u00e9dias.
\nPour commencer, nous allons donc cr\u00e9er un nouveau dossier. Cliquez donc sur le bouton Cr\u00e9er un dossier.<\/p>\n

La page \u201cglisse\u201d, entrez un nom de r\u00e9pertoire, puis cliquez sur le bouton Cr\u00e9er un dossier.<\/p>\n

Si votre dossier a bien \u00e9t\u00e9 cr\u00e9\u00e9, vous devez le voir en 2 . Cliquez sur ce dossier, puis cliquez sur le bouton Transf\u00e9rer.<\/p>\n

La page \u201cglisse\u201d de nouveau, cliquez sur le bouton choisir le fichierz. Une page s’ouvre, choisissez le fichier \u00e0 transf\u00e9rer. Vous pouvez transf\u00e9rer plusieurs fichiers en m\u00eame temps. Une fois le(s) fichier(s) s\u00e9lectionn\u00e9(s), cliquez sur le bouton Choisir. De retour sur la page de transfert, cliquez sur le bouton D\u00e9marrer l’envoi<\/p>\n

Suivant le nombre et la taille des fichiers, le transfert peut prendre quelques instants.Une fois le transfert termin\u00e9, rendez-vous dans Contenu > Gestion des articles et \u00e9ditez l’article dans lequel vous souhaitez placer votre image.<\/p>\n

Positionnez votre curseur \u00e0 l’endroit o\u00f9 vous souhaitez placer votre image ( 1 ), puis cliquez sur le bouton Image ( 2 ). La fen\u00eatre popup suivante s’ouvre :<\/p>\n

Allez chercher votre image, puis cliquez sur le bouton Ins\u00e9rer ( 1 ). Une fois votre image ins\u00e9r\u00e9e dans votre article, s\u00e9lectionnez-la en cliquant dessus, puis cliquez sur le bouton image de votre \u00e9diteur (ici TinyMCE, l’\u00e9diteur fourni par d\u00e9faut avec Joomla!) :<\/p>\n

La fen\u00eatre popup suivante s’ouvre :
\n 
\n 1 \u2013 G\u00e9n\u00e9ral : Donnez un titre et une description \u00e0 votre image (cela est utile entre autre pour les mal voyants ainsi que pour le r\u00e9f\u00e9rencement de votre site Joomla!) 2 \u2013 Apparence : d\u00e9finissez l’alignement de votre image, ses dimensions, les espaces verticaux et horizontaux (afin que le texte ne soit pas trop coll\u00e9 \u00e0 l’image) et \u00e9ventuellement une bordure. 3 \u2013 Avanc\u00e9 : Vous trouverez ici d’autres param\u00e8tres tels que les r\u00e9glages pour les images alternatives.
\nUne fois que tout est r\u00e9gl\u00e9, cliquez sur le bouton Mettre \u00e0 jour. Cliquez ensuite sur le bouton enregistrer afin d’enregistrer votre article, puis rendez-vous sur le frontend pour voir le r\u00e9sultat :
\n 
\nDans les dossiers et fichiers de votre site (auxquels vous acc\u00e9dez par FTP), les m\u00e9dias sont class\u00e9s dans le r\u00e9pertoire \/images et non \/medias.<\/p>\n","protected":false},"excerpt":{"rendered":"

Comment charger des images et m\u00e9dias sur votre site puis les int\u00e9grez correctement \u00e0 vos articles.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[11],"tags":[],"class_list":["post-237","post","type-post","status-publish","format-standard","hentry","category-sixtine"],"yoast_head":"\nComment charger des images et les ins\u00e9rer dans un article | Cinnk<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Comment charger des images et les ins\u00e9rer dans un article | Cinnk\" \/>\n<meta property=\"og:description\" content=\"Comment charger des images et m\u00e9dias sur votre site puis les int\u00e9grez correctement \u00e0 vos articles.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\" \/>\n<meta property=\"og:site_name\" content=\"Cinnk\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Cinnk.formation\" \/>\n<meta property=\"article:published_time\" content=\"2020-10-07T14:49:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cinnk.com\/wp-content\/uploads\/2024\/10\/Logo-font.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"500\" \/>\n\t<meta property=\"og:image:height\" content=\"500\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Cinnk\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@CinnkCom\" \/>\n<meta name=\"twitter:site\" content=\"@CinnkCom\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Cinnk\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\"},\"author\":{\"name\":\"Cinnk\",\"@id\":\"https:\/\/cinnk.com\/fr\/#\/schema\/person\/eacaed860bb77e88b654cab0718cdc3d\"},\"headline\":\"Comment charger des images et les ins\u00e9rer dans un article\",\"datePublished\":\"2020-10-07T14:49:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\"},\"wordCount\":601,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/cinnk.com\/fr\/#organization\"},\"articleSection\":[\"sixtine\"],\"inLanguage\":\"fr-FR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\",\"url\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\",\"name\":\"Comment charger des images et les ins\u00e9rer dans un article | Cinnk\",\"isPartOf\":{\"@id\":\"https:\/\/cinnk.com\/fr\/#website\"},\"datePublished\":\"2020-10-07T14:49:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/cinnk.com\/fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Comment charger des images et les ins\u00e9rer dans un article\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cinnk.com\/fr\/#website\",\"url\":\"https:\/\/cinnk.com\/fr\/\",\"name\":\"Cinnk\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/cinnk.com\/fr\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cinnk.com\/fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/cinnk.com\/fr\/#organization\",\"name\":\"Cinnk\",\"url\":\"https:\/\/cinnk.com\/fr\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/cinnk.com\/fr\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cinnk.com\/wp-content\/uploads\/2023\/10\/logo-svg-orange_new.svg\",\"contentUrl\":\"https:\/\/cinnk.com\/wp-content\/uploads\/2023\/10\/logo-svg-orange_new.svg\",\"width\":125,\"height\":32,\"caption\":\"Cinnk\"},\"image\":{\"@id\":\"https:\/\/cinnk.com\/fr\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Cinnk.formation\",\"https:\/\/x.com\/CinnkCom\",\"https:\/\/www.instagram.com\/cinnk\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/cinnk.com\/fr\/#\/schema\/person\/eacaed860bb77e88b654cab0718cdc3d\",\"name\":\"Cinnk\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/cinnk.com\/fr\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2110805a2e278c633c677ec50fd5a9944d8f66b4fac05f86ebb21a2f87be8e0b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2110805a2e278c633c677ec50fd5a9944d8f66b4fac05f86ebb21a2f87be8e0b?s=96&d=mm&r=g\",\"caption\":\"Cinnk\"},\"sameAs\":[\"https:\/\/cinnk.com\"],\"url\":\"https:\/\/cinnk.com\/fr\/author\/cinnkdev\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Comment charger des images et les ins\u00e9rer dans un article | Cinnk","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:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/","og_locale":"fr_FR","og_type":"article","og_title":"Comment charger des images et les ins\u00e9rer dans un article | Cinnk","og_description":"Comment charger des images et m\u00e9dias sur votre site puis les int\u00e9grez correctement \u00e0 vos articles.","og_url":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/","og_site_name":"Cinnk","article_publisher":"https:\/\/www.facebook.com\/Cinnk.formation","article_published_time":"2020-10-07T14:49:45+00:00","og_image":[{"width":500,"height":500,"url":"https:\/\/cinnk.com\/wp-content\/uploads\/2024\/10\/Logo-font.jpg","type":"image\/jpeg"}],"author":"Cinnk","twitter_card":"summary_large_image","twitter_creator":"@CinnkCom","twitter_site":"@CinnkCom","twitter_misc":{"\u00c9crit par":"Cinnk","Dur\u00e9e de lecture estim\u00e9e":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#article","isPartOf":{"@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/"},"author":{"name":"Cinnk","@id":"https:\/\/cinnk.com\/fr\/#\/schema\/person\/eacaed860bb77e88b654cab0718cdc3d"},"headline":"Comment charger des images et les ins\u00e9rer dans un article","datePublished":"2020-10-07T14:49:45+00:00","mainEntityOfPage":{"@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/"},"wordCount":601,"commentCount":0,"publisher":{"@id":"https:\/\/cinnk.com\/fr\/#organization"},"articleSection":["sixtine"],"inLanguage":"fr-FR"},{"@type":"WebPage","@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/","url":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/","name":"Comment charger des images et les ins\u00e9rer dans un article | Cinnk","isPartOf":{"@id":"https:\/\/cinnk.com\/fr\/#website"},"datePublished":"2020-10-07T14:49:45+00:00","breadcrumb":{"@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/cinnk.com\/fr\/comment-charger-des-images-et-les-inserer-dans-un-article\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/cinnk.com\/fr\/"},{"@type":"ListItem","position":2,"name":"Comment charger des images et les ins\u00e9rer dans un article"}]},{"@type":"WebSite","@id":"https:\/\/cinnk.com\/fr\/#website","url":"https:\/\/cinnk.com\/fr\/","name":"Cinnk","description":"","publisher":{"@id":"https:\/\/cinnk.com\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cinnk.com\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/cinnk.com\/fr\/#organization","name":"Cinnk","url":"https:\/\/cinnk.com\/fr\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/cinnk.com\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/cinnk.com\/wp-content\/uploads\/2023\/10\/logo-svg-orange_new.svg","contentUrl":"https:\/\/cinnk.com\/wp-content\/uploads\/2023\/10\/logo-svg-orange_new.svg","width":125,"height":32,"caption":"Cinnk"},"image":{"@id":"https:\/\/cinnk.com\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Cinnk.formation","https:\/\/x.com\/CinnkCom","https:\/\/www.instagram.com\/cinnk"]},{"@type":"Person","@id":"https:\/\/cinnk.com\/fr\/#\/schema\/person\/eacaed860bb77e88b654cab0718cdc3d","name":"Cinnk","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/cinnk.com\/fr\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/2110805a2e278c633c677ec50fd5a9944d8f66b4fac05f86ebb21a2f87be8e0b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2110805a2e278c633c677ec50fd5a9944d8f66b4fac05f86ebb21a2f87be8e0b?s=96&d=mm&r=g","caption":"Cinnk"},"sameAs":["https:\/\/cinnk.com"],"url":"https:\/\/cinnk.com\/fr\/author\/cinnkdev\/"}]}},"_links":{"self":[{"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/posts\/237","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/comments?post=237"}],"version-history":[{"count":0,"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/posts\/237\/revisions"}],"wp:attachment":[{"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/media?parent=237"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/categories?post=237"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cinnk.com\/fr\/wp-json\/wp\/v2\/tags?post=237"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}