{"id":866,"date":"2020-03-11T10:00:41","date_gmt":"2020-03-11T10:00:41","guid":{"rendered":"https:\/\/meetanshi.com\/blog\/2020\/03\/11\/allow-file-attachment-in-wysiwyg-in-magento-2\/"},"modified":"2025-05-22T14:47:38","modified_gmt":"2025-05-22T09:17:38","slug":"allow-file-attachment-in-wysiwyg-in-magento-2","status":"publish","type":"post","link":"https:\/\/meetanshi.com\/blog\/allow-file-attachment-in-wysiwyg-in-magento-2\/","title":{"rendered":"Easy Way to Allow File Attachment in WYSIWYG in Magento 2"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">WYSIWYG is an HTML editor for easily adding, editing the content and formatting it. However, for Magento 2 stores, it is always more than just text!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Adding any type of files such as PDF, Doc, Docx, png, zip, etc. on the product page, category page, or CMS block is required in order to optimize the page for better product understanding, improve the shopping process, or add any legal docs.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Hence, I\u2019ve come up with a programmatic solution to&nbsp;<em><strong>allow file attachment in WYSIWYG in Magento 2<\/strong><\/em>&nbsp;admin. Using the solution, enable pdf on WYSIWYG to upload attachments to products or any other file type in Magento 2 store.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Steps to allow file attachment in WYSIWYG in Magento 2:<\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Create&nbsp;<em><strong>di.xml<\/strong><\/em>&nbsp;in&nbsp;<strong>app\/code\/[Vendor]\/[Module]\/etc<\/strong>&nbsp;and add the following code:<\/li>\n<\/ol>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?xml version=\"1.0\" ?>\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\"\n        xsi:noNamespaceSchemaLocation=\"urn:magento:framework:ObjectManager\/etc\/config.xsd\">\n        \n    &lt;type name=\"Magento\\Cms\\Model\\Wysiwyg\\Images\\Storage\">\n                \n        &lt;plugin disabled=\"false\" name=\"Vendor_Module_Plugin_Magento_Cms_Model_Wysiwyg_Images_Storage\"\n                sortOrder=\"10\" type=\"Vendor\\Module\\Plugin\\Magento\\Cms\\Model\\Wysiwyg\\Images\\Storage\"\/>\n            \n    &lt;\/type>\n    &lt;type name=\"Magento\\Cms\\Model\\Wysiwyg\\Images\\Storage\">\n    &lt;arguments>\n        &lt;argument name=\"extensions\" xsi:type=\"array\">           \n            &lt;item name=\"allowed\" xsi:type=\"array\">\n                &lt;item name=\"pdf\" xsi:type=\"string\">application\/pdf&lt;\/item>\n                &lt;item name=\"doc\" xsi:type=\"string\">application\/msword&lt;\/item>\n                &lt;item name=\"csv\" xsi:type=\"string\">text\/plain&lt;\/item>\n            &lt;\/item>\n            &lt;item name=\"image_allowed\" xsi:type=\"array\">               \n                &lt;item name=\"pdf\" xsi:type=\"string\">application\/pdf&lt;\/item>\n                &lt;item name=\"doc\" xsi:type=\"string\">application\/msword&lt;\/item>\n                &lt;item name=\"csv\" xsi:type=\"string\">text\/plain&lt;\/item>\n            &lt;\/item>\n        &lt;\/argument>\n    &lt;\/arguments>\n    &lt;\/type>\n&lt;\/config><\/pre>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Create&nbsp;<em><strong>Storage.php<\/strong><\/em>&nbsp;in&nbsp;<strong>app\/code\/[Vendor]\/[Module]\/Plugin\/Magento\/Cms\/Model\/Wysiwyg\/Images<\/strong>&nbsp;and add the following code:<\/li>\n<\/ol>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?php\nnamespace Vendor\\Module\\Plugin\\Magento\\Cms\\Model\\Wysiwyg\\Images;\nclass Storage\n{\n    public function afterGetAllowedExtensions(\\Magento\\Cms\\Model\\Wysiwyg\\Images\\Storage $subject, $result)\n    {\n        $defaultFiletypes = array('doc', 'csv','pdf');\n        return array_merge($result, $defaultFiletypes);\n    }\n}<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">That\u2019s it.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Do share the solution with the fellow Magento developers via social media.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Thanks.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>WYSIWYG is an HTML editor for easily adding, editing the content and formatting it. However, for Magento 2 stores, it is always more than just&#8230;<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[34],"tags":[],"class_list":["post-866","post","type-post","status-publish","format-standard","hentry","category-magento"],"acf":[],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/866","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=866"}],"version-history":[{"count":3,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/866\/revisions"}],"predecessor-version":[{"id":15037,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/866\/revisions\/15037"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=866"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=866"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=866"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}