Magento: Allow Other File Types in Wysiwyg Editor

While the Wysiwyg editor built-in to Magento is great, especially not having to install a wysiwyg module for every Magento installation, it lacks in any way to configure it. I am kind of shocked by this, but, that’s just the way it is right now (at least as of 1.4.2.0 currently).

If you want to be able to upload other types of files besides the few limited image types and media types, I’ll walk you through the ‘right’ way to do it, without modifying core code. We are going to make a very simple module with just 2 files. Here’s how you do it:

Configuration File

Create this file: app/code/local/Prattski/WysiwygFiles/etc/config.xml with the following code:

<?xml version="1.0" encoding="UTF-8"?>
<config>
  <modules>
    <Prattski_WysiwygFiles>
      <version>1.0.0</version>
    </Prattski_WysiwygFiles>
  </modules>
  <adminhtml>
    <cms>
      <browser>
        <extensions>
          <allowed>
            <jpg>1</jpg>
            <jpeg>1</jpeg>
            <png>1</png>
            <gif>1</gif>
            <pdf>1</pdf>
          </allowed>
        </extensions>
      </browser>
    </cms>
  </adminhtml>
</config>

This configuration file will just build off of Magento’s configuration file, adding allowed extensions (the original configuration file is app/code/core/Mage/Cms/etc/config.xml). As you can see, I added pdf as an allowed extension. Just follow the same format for other extensions if you’d like to add more.

Module File

Create the following file: app/etc/modules/Prattski_WysiwygFiles.xml with the following code:

<?xml version="1.0"?>
<config>
  <modules>
    <Prattski_WysiwygFiles>
      <active>true</active>
      <codePool>local</codePool>
    </Prattski_WysiwygFiles>
  </modules>
</config>

This is what enables the module and allows Magento to recognize it’s there and active.

Once that is done, you should see the module listed in System >> Configuration >> Advanced, and it should work immediately. Enjoy!

This entry was posted in Magento. Bookmark the permalink.

29 Responses to Magento: Allow Other File Types in Wysiwyg Editor

  1. Loopion says:

    Clever tip! Easy simple and quick! Useful for PDF and Flash files

  2. Pingback: Tweets that mention Magento: Allow Other File Types in Wysiwyg Editor | Prattski | Magento & Web Development -- Topsy.com

  3. BoSua says:

    Hi,

    Thanks for the tip.
    However, how can I enable PDF file upload?

    Thanks

    • Josh Pratt says:

      BoSua – Ok, there is no possible way that you fully read my article if you are asking that question… Try re-reading the article.

  4. Joao Amado says:

    Hi! I’m able to upload a pdf, but not without a warning that the file isn’t an image file… When I try to access it trough a link, the browser thinks it’s a PNG… What I’m doing wrong?

    • will says:

      same warning for me, any tips? to be sure you are using the insert image button to upload the pdf’s? this uploads it fine but puts it in an image tag in the markup

  5. thanks. it works in cms page section. but it doesn’t work in category editor. is there anyway we can do same for category section as well.

  6. Horatiu Taina says:

    Hi Josh!

    That’s quite a cool hint. However, it seems to only work thoroughly for CMS. Can you help with linking to the uploaded PDF for product descriptions?

    The upload seems to work fine when using WYSIWYG editor in product descriptions, but when trying to insert the link to it, the whole thing just doesn’t do anything.

    Thanks in advance,
    HT

  7. Matt Park says:

    Thank you! You saved the day with this module :)

  8. Stity2010 says:

    I am using CE v1.5.
    Your idea and module looks great but it doesn’t work on v1.5. It allows you to upload PDFs but doesn’t link it. I logged out/ogin, cleared cache, tried your module on new and existing product etc.

    Any ideas? Thanks again for your module.

    • Josh Pratt says:

      There’s plenty good chance it doesn’t work properly in 1.5. I haven’t yet tested it on 1.5+. I’m not sure when I’ll have time to take a look into it.

  9. Micheline says:

    Uploading pdf’s works in 1.5 (through images). You can make a link to the pdf-file with the link icon in the tiny editor. Works for me.

    • looking for answer says:

      Hi,
      I am new with Magneto 1.5 and leaning website coding. I didn’t see there is a folder name Prattski, so I create one after app/code/local on and did the rest of coding as above. But it doesn’t work. I can’t see “Prattski_WysiwygFiles” module listed in System >> Configuration >> Advanced. What did I miss?
      Please HELP!!
      Thanks

  10. This tip works perfectly on 1.6, thank you very much for this clever advice ;)

  11. Mon Sarun says:

    Thank very much!!

    I find this along time. You help me, Thank Thank Thank.

  12. Jack N says:

    This is a brilliant hack Prattski, thanks alot!
    In my case, with Magento 1.6.1.0, there’s only one drawback is that it works for Safari, Chrome, but not for IE (not so surprising), Firefox (shocking!). And I mean the Description and Short Description field, the CMS pages are total fine. The symptom is that when I browse to the pdf file, click on Insert File, the link appear on the “Link URL” field, but when I click on “Insert” button to finish the process, the link disappear! Do you guys have any ideas why this could happen?
    I appreciate any suggestions. Thanks in advance!

  13. Luc says:

    Hi,

    Thank for the tip.

    However, it is not necessary to repeat the global config, adding only one entry 1 that is enough to allow the download of pdf and it provides a better compatibility updates.

    But it may be useful to disable an existing entry in this case by adding 0

  14. Nabler says:

    Its not workin in mine, sorry :(

  15. happy_newbee_now says:

    … my fault for trying to skip Magento’s fundamental… but i’m on a crash course…

    anyways, after banging my head on why this great tip wasn’t working on my CE 1.7 install, i finally got it (and this may be useful for those who want to use a different naming than …/Prattski/…)

    if this is where you’ll place your file:
    app/code/local/Custom/WysiwygFiles/etc/config.xml

    Magento will reconstruct the path to the config file using the info you supply in your module file (app/etc/modules/WysiwygFiles.xml). and the main point is that UNDERSCORES GET CONVERTED INTO SLASHES!!!

    so to let Magento pick the config.xml within file Custom/WysiwygFiles you need to tell it by using:
    <Custom_WysiwygFiles>

    </Custom_WysiwygFiles>

    hope that helps
    (got there by reading: http://stackoverflow.com/questions/9337303/magento-does-not-load-module-config-xml)

  16. Mike says:

    Worked for me in ver 1.7.0.2.

    This is definitely getting added to my to-do list at the beginning of every Magento install. Thanks for the help!

  17. Manmeet says:

    Hi, this is working for me. But only one problem. After uploading pdf file from Admin, I am not able to access it from front-end. It’s making wrong URL like this:
    Test Upload

    Please help!!!

  18. victor says:

    Worked like a charm for me in 1.7.0.2 thanks! super easy to implement

  19. keenboy says:

    Not working for me 1.7.

  20. TeknoMan says:

    Works! In my module, i added only new extensions that i need:

    (The code did not come through in your comment)

    I’m using Magento EE 1.12.0.2

  21. Martin says:

    This is a cool mod and it works on CE 1.7.0.2 Just remember to use google chrome to accesss the backend as it doesn’t work in Firefox and IE which is typical.

    Also remember to clear the cache and css and javascript before you try to use it otherwise your mod won’t give you the view you are expecting to see.

    Is there a way of associating a pdf logo in the Media Storage view for a pdf?

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>