{"id":886,"date":"2015-05-27T12:30:57","date_gmt":"2015-05-27T12:30:57","guid":{"rendered":"http:\/\/www.majory-cubizolles.fr\/blog\/?p=886"},"modified":"2017-01-23T18:28:39","modified_gmt":"2017-01-23T18:28:39","slug":"supprimer-le-cadre-blanc-autour-de-vos-images-sous-prestashop","status":"publish","type":"post","link":"https:\/\/www.majory-cubizolles.fr\/blog\/supprimer-le-cadre-blanc-autour-de-vos-images-sous-prestashop\/","title":{"rendered":"Supprimer le cadre blanc autour de vos images |  Astuce Prestashop 1.6"},"content":{"rendered":"<p>Lorsqu\u2019on upload une image dans Prestashop, ce dernier la\u00a0redimensionne selon les diff\u00e9rents formats sp\u00e9cifi\u00e9s dans \u00ab\u00a0pr\u00e9f\u00e9rences\/images\u00a0\u00bb.<\/p>\n<p>Mais si vous regardez bien le front-office de\u00a0\u00a0votre boutique,\u00a0vous pouvez remarquer que Prestashop ajoute par d\u00e9faut un cadre blanc autour de votre image.<\/p>\n<p><strong><strong>Cette astuce Prestashop est valable pour la version 1.6<\/strong><\/strong><\/p>\n<p><span style=\"color: #800000;\"><strong>Voici la solution pour rem\u00e9dier \u00e0 ce probl\u00e8me :<\/strong><\/span><\/p>\n<p><!--more--><\/p>\n<p>1) Cr\u00e9ez un fichier nomm\u00e9 \u00ab\u00a0imageManager.php\u00a0\u00bb dans le dossier \u00ab\u00a0override\/classes\u00a0\u00bb et ajoutez-le code suivant:<\/p>\n<pre class=\"lang:default decode:true \">&lt;?php\r\nclass ImageManager extends ImageManagerCore\r\n{\r\n\r\n\t\/**\r\n\t * Resize, cut and optimize image\r\n\t *\r\n\t * @param string $src_file Image object from $_FILE\r\n\t * @param string $dst_file Destination filename\r\n\t * @param integer $dst_width Desired width (optional)\r\n\t * @param integer $dst_height Desired height (optional)\r\n\t * @param string $file_type\r\n\t * @return boolean Operation result\r\n\t *\/\r\n\tpublic static function resize($src_file, $dst_file, $dst_width = null, $dst_height = null, $file_type = 'jpg', $force_type = false)\r\n\t{\r\n\t\tif (PHP_VERSION_ID &lt; 50300)\r\n\t\t\tclearstatcache();\r\n\t\telse\r\n\t\t\tclearstatcache(true, $src_file);\r\n\t\t\r\n\t\tif (!file_exists($src_file) || !filesize($src_file))\r\n\t\t\treturn false;\r\n\t\tlist($src_width, $src_height, $type) = getimagesize($src_file);\r\n\r\n\t\t\/\/ If PS_IMAGE_QUALITY is activated, the generated image will be a PNG with .jpg as a file extension.\r\n\t\t\/\/ This allow for higher quality and for transparency. JPG source files will also benefit from a higher quality\r\n\t\t\/\/ because JPG reencoding by GD, even with max quality setting, degrades the image.\r\n\t\tif (Configuration::get('PS_IMAGE_QUALITY') == 'png_all'\r\n\t\t\t|| (Configuration::get('PS_IMAGE_QUALITY') == 'png' &amp;&amp; $type == IMAGETYPE_PNG) &amp;&amp; !$force_type)\r\n\t\t\t$file_type = 'png';\r\n\r\n\t\tif (!$src_width)\r\n\t\t\treturn false;\r\n\t\tif (!$dst_width)\r\n\t\t\t$dst_width = $src_width;\r\n\t\tif (!$dst_height)\r\n\t\t\t$dst_height = $src_height;\r\n\r\n\t\t$src_image = ImageManager::create($type, $src_file);\r\n\r\n\t\t$width_diff = $dst_width \/ $src_width;\r\n\t\t$height_diff = $dst_height \/ $src_height;\r\n\r\n\t\tif ($width_diff &gt; 1 &amp;&amp; $height_diff &gt; 1)\r\n\t\t{\r\n\t\t\t$next_width = $src_width;\r\n\t\t\t$next_height = $src_height;\r\n\t\t}\r\n\t\telse\r\n\t\t{\r\n\t\t\tif (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 2 OR (intval(Configuration::get('PS_IMAGE_GENERATION_METHOD')) == 0 AND $heightDiff &gt; $widthDiff))\r\n\r\n\t\t\t{\r\n\t\t\t\t$next_height = $dst_height;\r\n\t\t\t\t$next_width = round(($src_width * $next_height) \/ $src_height);\r\n\t\t\t\t$dst_width = (int)(!Configuration::get('PS_IMAGE_GENERATION_METHOD') ? $dst_width : $next_width);\r\n\t\t\t}\r\n\t\t\telse\r\n\t\t\t{\r\n\t\t\t\t$next_width = $dst_width;\r\n\t\t\t\t$next_height = round($src_height * $dst_width \/ $src_width);\r\n\t\t\t\t$dst_height = (int)(!Configuration::get('PS_IMAGE_GENERATION_METHOD') ? $dst_height : $next_height);\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tif (!ImageManager::checkImageMemoryLimit($src_file))\r\n\t\t\treturn false;\r\n\t\t\r\n\t\t$dest_image = imagecreatetruecolor($dst_width, $dst_height);\r\n\r\n\t\t\/\/ici on applique un fond transparent quelque soit le type de fichier.\r\n\t\timagealphablending($dest_image, false);\r\n\t\timagesavealpha($dest_image, true);\r\n\t\t$transparent = imagecolorallocatealpha($dest_image, 255, 255, 255, 127);\r\n\t\timagefilledrectangle($dest_image, 0, 0, $dst_width, $dst_height, $transparent);\r\n\r\n\t\timagecopyresampled($dest_image, $src_image, (int)(($dst_width - $next_width) \/ 2), (int)(($dst_height - $next_height) \/ 2), 0, 0, $next_width, $next_height, $src_width, $src_height);\r\n\t\treturn (ImageManager::write($file_type, $dest_image, $dst_file));\r\n\t}\r\n}\r\n\r\n<\/pre>\n<p>2) Allez dans le back-office de prestashop, Pr\u00e9f\u00e9rences &gt; Images &gt; Reg\u00e9n\u00e9rer les miniatures et cliquez sur le bouton \u00ab\u00a0Reg\u00e9n\u00e9rer des miniatures\u00a0\u00bb . Selon peut prendre un peu de temps&#8230;.<\/p>\n<p><a href=\"http:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2015\/05\/Capture-d\u2019\u00e9cran-2015-05-25-\u00e0-21.39.06.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-888\" src=\"http:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2015\/05\/Capture-d\u2019\u00e9cran-2015-05-25-\u00e0-21.39.06.png\" alt=\"Prestashop \" width=\"1180\" height=\"345\" \/><\/a><\/p>\n<p>3) Param\u00e8tres avanc\u00e9s &gt; Performances =&gt; videz le cache<\/p>\n<p>&#8212;&#8212;&#8212;&#8211;<\/p>\n<p><strong>Voici le r\u00e9sultat :\u00a0<\/strong><\/p>\n<p><a href=\"http:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2015\/05\/prestashop-cade-blanc.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-889\" src=\"http:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2015\/05\/prestashop-cade-blanc.png\" alt=\"prestashop-cade-blanc\" width=\"709\" height=\"350\" \/><\/a><\/p>\n<!-- Begin Yuzo --><div class='yuzo_related_post style-2'  data-version='5.12.88'><!-- without result --><div class='yuzo_clearfixed yuzo__title yuzo__title'><h2>Articles similaires<\/h2><\/div>\n\t\t\t\t\t\t<div class=\"relatedthumb yuzo-list  \" style=\"\"  >  \n\t\t\t\t\t\t  <a  href=\"https:\/\/www.majory-cubizolles.fr\/blog\/comment-bien-poster-sur-facebook-infographie\/\" class=\"image-list\" target='_blank' >\n\t\t\t\t\t\t  <div class=\"yuzo-img-wrap \" style=\"width: 185px;height:150px;\">\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t <div class=\"yuzo-img\" style=\"background:url('https:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2016\/07\/wsi-imageoptim-Comment-Publier-Efficacement-sur-Facebook1-400x249.jpg') 50% 50% no-repeat;width: 190px;height:150px;margin-bottom: 5px;background-size:  cover;  \"><\/div>\n\t\t\t\t\t\t  <\/div>\n\t\t\t\t\t\t  <\/a>\n\t\t\t\t\t\t  <a  class=\"link-list yuzo__text--title\" href=\"https:\/\/www.majory-cubizolles.fr\/blog\/comment-bien-poster-sur-facebook-infographie\/\" style=\"font-size:15px;font-weight:bold;;line-height:23px;\"> Comment bien poster sur Facebook | Infographie  <div class='yuzo_views_post yuzo_icon_views yuzo_icon_views__bottom' style='font-size:13px;'>views 351<\/div><\/a>\n\t\t\t\t\t\t\t\t<span class=\"yuzo_text\" style=\"font-size:11px;\" >Cette infographie, vous montre comment publier efficacement sur FacebooK.\r\n\r\n\r\n\r\n<\/span>\n\t\t\t\t\t\t   \n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"relatedthumb yuzo-list  \" style=\"\"  >  \n\t\t\t\t\t\t  <a  href=\"https:\/\/www.majory-cubizolles.fr\/blog\/parametrer-nouvelle-langue-prestashop-1-6-1-7\/\" class=\"image-list\" target='_blank' >\n\t\t\t\t\t\t  <div class=\"yuzo-img-wrap \" style=\"width: 185px;height:150px;\">\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t <div class=\"yuzo-img\" style=\"background:url('https:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2016\/12\/creer-manuellement-langue-prestashop-400x249.jpg') 50% 50% no-repeat;width: 190px;height:150px;margin-bottom: 5px;background-size:  cover;  \"><\/div>\n\t\t\t\t\t\t  <\/div>\n\t\t\t\t\t\t  <\/a>\n\t\t\t\t\t\t  <a  class=\"link-list yuzo__text--title\" href=\"https:\/\/www.majory-cubizolles.fr\/blog\/parametrer-nouvelle-langue-prestashop-1-6-1-7\/\" style=\"font-size:15px;font-weight:bold;;line-height:23px;\"> Comment cr\u00e9er une langue manuellement | Prestashop 1.6 \/ 1.7  <div class='yuzo_views_post yuzo_icon_views yuzo_icon_views__bottom' style='font-size:13px;'>views 2621<\/div><\/a>\n\t\t\t\t\t\t\t\t<span class=\"yuzo_text\" style=\"font-size:11px;\" >Vous ne d\u00e9sirez pas utiliser le pack de traduction de Prestashop ? Vous d\u00e9sirez faire vos traductions vous-m\u00eame ?\r\n\r\nPrestashop 1.6 et 1.7 permet facilement de cr\u00e9er une nouvelle langue\u00a0sur une boutique e-commerce.\r\n\r\nLe param\u00e9trage est identique pour les deux versions, la seule diff\u00e9rence est le chemin pour arriver \u00e0 la page de cr\u00e9ation de langue.\r\n\r\n\r\n\r\n--------------------------------------\r\nSi...<\/span>\n\t\t\t\t\t\t   \n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"relatedthumb yuzo-list  \" style=\"\"  >  \n\t\t\t\t\t\t  <a  href=\"https:\/\/www.majory-cubizolles.fr\/blog\/pourquoi-faut-il-migrer-sur-prestashop-1-6-infographie\/\" class=\"image-list\" target='_blank' >\n\t\t\t\t\t\t  <div class=\"yuzo-img-wrap \" style=\"width: 185px;height:150px;\">\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t <div class=\"yuzo-img\" style=\"background:url('https:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2016\/07\/wsi-imageoptim-header-upgrade-prestashop-400x249.jpg') 50% 50% no-repeat;width: 190px;height:150px;margin-bottom: 5px;background-size:  cover;  \"><\/div>\n\t\t\t\t\t\t  <\/div>\n\t\t\t\t\t\t  <\/a>\n\t\t\t\t\t\t  <a  class=\"link-list yuzo__text--title\" href=\"https:\/\/www.majory-cubizolles.fr\/blog\/pourquoi-faut-il-migrer-sur-prestashop-1-6-infographie\/\" style=\"font-size:15px;font-weight:bold;;line-height:23px;\"> Pourquoi faut-il migrer sur Prestashop 1.6 | Infographie  <div class='yuzo_views_post yuzo_icon_views yuzo_icon_views__bottom' style='font-size:13px;'>views 264<\/div><\/a>\n\t\t\t\t\t\t\t\t<span class=\"yuzo_text\" style=\"font-size:11px;\" >Cette infographie, met en avant les diff\u00e9rentes raisons pour migrer son site Prestashop sur la version 1.6\r\nEn voici quelques-unes :\r\n- le th\u00e8me par d\u00e9faut de Prestashop est plus esth\u00e9tique que l'ancien, plus \u00a0\u00e9l\u00e9gant, souple et permet de mettre en avant des banni\u00e8res personnalisables.\r\n- il est possible de modifier les couleurs, les polices, etc directement depuis le Front Office.\r\n- la cr\u00e9ation ...<\/span>\n\t\t\t\t\t\t   \n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"relatedthumb yuzo-list  \" style=\"\"  >  \n\t\t\t\t\t\t  <a  href=\"https:\/\/www.majory-cubizolles.fr\/blog\/10-palette-de-couleurs-web-sur-le-theme-du-gris\/\" class=\"image-list\" target='_blank' >\n\t\t\t\t\t\t  <div class=\"yuzo-img-wrap \" style=\"width: 185px;height:150px;\">\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t <div class=\"yuzo-img\" style=\"background:url('https:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2016\/07\/wsi-imageoptim-palette-couleurs-gris1-400x249.jpg') 50% 50% no-repeat;width: 190px;height:150px;margin-bottom: 5px;background-size:  cover;  \"><\/div>\n\t\t\t\t\t\t  <\/div>\n\t\t\t\t\t\t  <\/a>\n\t\t\t\t\t\t  <a  class=\"link-list yuzo__text--title\" href=\"https:\/\/www.majory-cubizolles.fr\/blog\/10-palette-de-couleurs-web-sur-le-theme-du-gris\/\" style=\"font-size:15px;font-weight:bold;;line-height:23px;\"> 10 palettes de couleurs sur le th\u00e8me du gris pour agr\u00e9menter vos site web  <div class='yuzo_views_post yuzo_icon_views yuzo_icon_views__bottom' style='font-size:13px;'>views 6440<\/div><\/a>\n\t\t\t\t\t\t\t\t<span class=\"yuzo_text\" style=\"font-size:11px;\" >Selon, Trinity Advise,\u00a0le gris n\u2019est pas tout \u00e0 fait une couleur, historiquement associ\u00e9 \u00e0 des univers de tristesse, de vieillesse voire de mort. Il suffit aussi de constater les \u00e9l\u00e9ments qui le repr\u00e9sentent (poussi\u00e8re, souris, b\u00e9ton) pour s\u2019apercevoir qu\u2019il n\u2019est pas tr\u00e8s positif au regard actuel des occidentaux. Pourtant, il se marie tr\u00e8s bien avec de nombreuses couleurs vives et peut apporter u...<\/span>\n\t\t\t\t\t\t   \n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"relatedthumb yuzo-list  \" style=\"\"  >  \n\t\t\t\t\t\t  <a  href=\"https:\/\/www.majory-cubizolles.fr\/blog\/desactiver-les-taxes-dans-prestashop\/\" class=\"image-list\" target='_blank' >\n\t\t\t\t\t\t  <div class=\"yuzo-img-wrap \" style=\"width: 185px;height:150px;\">\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t <div class=\"yuzo-img\" style=\"background:url('https:\/\/www.majory-cubizolles.fr\/blog\/wp-content\/uploads\/2015\/01\/Capture-d\u2019e\u0301cran-2015-01-26-a\u0300-12.26.59-300x187.png') 50% 50% no-repeat;width: 190px;height:150px;margin-bottom: 5px;background-size:  cover;  \"><\/div>\n\t\t\t\t\t\t  <\/div>\n\t\t\t\t\t\t  <\/a>\n\t\t\t\t\t\t  <a  class=\"link-list yuzo__text--title\" href=\"https:\/\/www.majory-cubizolles.fr\/blog\/desactiver-les-taxes-dans-prestashop\/\" style=\"font-size:15px;font-weight:bold;;line-height:23px;\"> D\u00e9sactiver les taxes |  Astuce Prestashop 1.6  <div class='yuzo_views_post yuzo_icon_views yuzo_icon_views__bottom' style='font-size:13px;'>views 1626<\/div><\/a>\n\t\t\t\t\t\t\t\t<span class=\"yuzo_text\" style=\"font-size:11px;\" >Si vous d\u00e9sirez d\u00e9sactiver les taxes dans prestashop, suivez les deux \u00e9tapes suivantes\r\n\r\n1) Allez dans pr\u00e9f\u00e9rences > taxes\r\n\r\n\r\n\r\n\r\n2) Options des taxes > Activer les taxes : non\r\n\r\n\r\n\r\nEh voila c'\u00e9tait tout simple les taxes sont d\u00e9sactiv\u00e9es.<\/span>\n\t\t\t\t\t\t   \n\t\t\t\t\t\t<\/div>\n<\/div>  <!-- End Yuzo :) -->","protected":false},"excerpt":{"rendered":"<p>Lorsqu\u2019on upload une image dans Prestashop, ce dernier la\u00a0redimensionne selon les diff\u00e9rents formats sp\u00e9cifi\u00e9s dans \u00ab\u00a0pr\u00e9f\u00e9rences\/images\u00a0\u00bb. Mais si vous regardez bien le front-office de\u00a0\u00a0votre boutique,\u00a0vous pouvez remarquer que Prestashop ajoute par d\u00e9faut un cadre blanc autour de votre image. Cette astuce Prestashop est valable pour la version 1.6 Voici la [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":889,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,11],"tags":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/posts\/886"}],"collection":[{"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/comments?post=886"}],"version-history":[{"count":0,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/posts\/886\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/media\/889"}],"wp:attachment":[{"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/media?parent=886"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/categories?post=886"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.majory-cubizolles.fr\/blog\/wp-json\/wp\/v2\/tags?post=886"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}