How to add an image uploader (to record an image and its path in the Magento store config) to the admin form, using .xml files?

Question

I made a plugin that adds a custom menu item in the left-hand side menu in admin. Now I have the item, and also the form that the item leads to. Form already has some text field for inputting text value. I need to make a field for uploading (saving) an image, for later usage somewhere else (also by referencing it through ::StoreConfig). How can I make use of the image uploader (image upload field)? Apparently the image is not saved this way. I added the image upload field by adding this code to system.xml (as a child of config/sections/mynamespace/groups/mynamespace_group/fields), successfuly:

<mynamespace_image translate="label">
    <label>Image 1: </label>
    <comment>First image for the carousel</comment>
    <frontend_type>image</frontend_type>
    <sort_order>90</sort_order>
    <show_in_default>1</show_in_default>
    <show_in_website>1</show_in_website>
    <show_in_store>1</show_in_store>
</mynamespace_image>

When I save the form data, the name of the image is successfuly saved, but the image itself is apparently not saved anywhere - when I try and access the image through

$first = Mage::getStoreConfig('mynamespace/mynamespace_group/mynamespace_image');

in a block, I only get the name of the file (ie. "Milka.png", or "Milka.jpg"), and not the whole URL. I need to save the image and have it accessible in Block, in order to display it. How can I do that?

Answer 1

Use the following:

<mynamespace_image>
    <label>Image 1: </label>
    <comment>First image for the carousel</comment>
    <frontend_type>image</frontend_type>
    <backend_model>adminhtml/system_config_backend_image</backend_model>
    <upload_dir config="system/filesystem/media" scope_info="1">myfolder</upload_dir>
    <base_url type="media" scope_info="1">myfolder</base_url>
    <sort_order>1</sort_order>
    <show_in_default>1</show_in_default>
    <show_in_website>1</show_in_website>
    <show_in_store>1</show_in_store>
</mynamespace_image>

Note as the backend_model will take care of the upload, the upload_dir will tell it to put the file in myfolder in the root media directory. base_url will be the URL of the image.

Then you just need to get the config value, and appending it to the exact path you have specified in your system.xml