Loading...


Loading...

Welcome!

Sign up for a free account, or log in here.

Member Login

You can login by following the link.

Not a Member? Sign up! It's Free!

Please feel free to register.

Click to log in.

Multiple Media Uploads in WordPress’ Functions.php

Recently I had a real problem with a theme that I’ve never really run into before. I needed a way to upload an image in the admin backend. I had never seen a way to do this anywhere. I looked through the admin file, but couldn’t find anything.

Then I found a great post by Matt at Webmaster-Source. He detailed a way to upload an image in the functions.php file, absolutely perfect for what I wanted. But my problem was that I needed multiple media uploads on the page, which he nearly had but just needed a slight alteration.

Basically add a simple form with these two lines in:

<input id=”upload_image” type=”text” size=”36″ name=”upload_image” value=”" />
<input id=”upload_image_button” type=”button” value=”Upload Image” />

So here is his javascript (jquery) code that handles it:

$(document).ready(function() {
 $(‘#upload_image_button’).click(function() {
  formfield = $(‘#upload_image’).attr(‘name’);
  tb_show(”, ‘media-upload.php&type=image&TB_iframe=true’);
  return false;
 });

 window.send_to_editor = function(html) {
  imgurl = $(‘img’,html).attr(‘src’);
  $(‘#upload_image’).val(imgurl);
  tb_remove();
 }
});

So I altered it just a tiny little bit and here is the alteration. The first bit is to take his first function and slightly alter it for each instance of the form, the ‘upload_image_button‘ id and the formfield variable that selects the ‘upload_image‘ id:

 $(‘#upload_image_button’).click(function() {
  formfield = $(‘#upload_image’).attr(‘name’);
  tb_show(”, ‘media-upload.php?type=image&TB_iframe=true’);
  return false;
 });

In the second function, use the variable that he had set up earlier (formfield):

 window.send_to_editor = function(html) {
  imgurl = $(‘img’,html).attr(‘src’);
  $(‘#’ + formfield).val(imgurl);
  tb_remove();
 }

That should do it. Every time the media file is selected, then the submit/upload button event puts the media (image, in my case) url into the input box. Use your functions.php know-how to save it as an option for your theme, and use it as a background etc.,



Leave a Reply



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


The English Guy on Twitter

Raised Paper WordPress Theme

Raised Paper WordPress Theme screenshot
Theme Price

Onyx WordPress Theme

Onyx WordPress Theme screenshot
Theme Price

Victoriana WordPress Theme

Victoriana WordPress Theme screenshot
Theme Price

Expression Blue WordPress Theme

Expression Blue WordPress Theme screenshot
Theme Price

Premium WordPress Theme Release: Natural Green

Premium WordPress Theme Release: Natural Green screenshot
Theme Price

Theme Release: Ikon WordPress Theme

Theme Release: Ikon WordPress Theme screenshot
Theme Price

Shocking WordPress Theme Release

Shocking WordPress Theme Release screenshot
Theme Price

Digitalis WordPress Theme Release

Digitalis WordPress Theme Release screenshot
Theme Price

WordPress Theme: OpenAir Theme

WordPress Theme: OpenAir Theme screenshot
Theme Price

WordPress Theme: Very English

WordPress Theme: Very English screenshot
Theme Price

News Print v3.0 WordPress Theme Released

News Print v3.0 WordPress Theme Released screenshot
Theme Price

Reclamation WordPress Theme

Reclamation WordPress Theme screenshot
Theme Price