Free onboard Image Hosting - "photobucket" for your board

[Admin]

Should be same install on any vBulletin board, versions 3.0 and up to 3.8.7. I have not tried this yet on vBulletin 4 and up.

This uses NO:

• Plugins
• Auto template
• Files to upload (except one icon image)
• DB changes

Take a test drive here:

http://usmessageboards.com
USERNAME vBTester
PASSWORD testmetestme

Simply go to any thread and have a look at quick reply and click the icon.




I've had this "hack" on my board for a few years and recently installed it on a couple other fellas boards and decided it was time to share the secret. Have your own image hosting tool that is independent of 3rd party ones that like to block hotlinking and take images down after awhile.

The software used is by another author and is not my code. The template edits to integrate it to your vBulletin installation however, is.

First of all go to: http://codefuture.co.uk/projects/imagehost/ and download the free image hosting software.

Upload this package to root level of your server using a clever name for the folder, like "imagemagic" or something related to your board's topic. For a baseball board recently, I styled this "picturecatcher."

You should now be able to use and administer this by going to the URL, yourboard.com/yournameforthis

Once it is installed and working and you have done the setup and configuration to your liking, it is time to integrate this to your board. The best place to do this is in the WYSIWYG editors and the quick editors throughout.

Use "Search In Templates" to find all templates that have the word "separator" or "separator.gif" in them. This will populate the list of all the editor templates in your style. The list looks like this:

And you want to edit the templates you see in red, above.

In these templates find:

<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_quote"><img src="$stylevar[imgdir_editor]/quote.gif" width="21" height="20" alt="$vbphrase[wrap_quote_tags]" /></div></td>

And add after that:

<td><div class="imagebutton">
<a href="javascript:void(0);" onclick="window.open('http://yoursite.com/yourimagehostfoldername/index.php?mode=vbull&tpl=.&forumurl=' + escape(document.location.href), '_imagehost', 'resizable=yes,width=860,height=625');return false;"><img src="$stylevar[imgdir_editor]/uploadimage.png" width="21" height="20" alt="Upload Image for Posting" /></a></div></td>

You'll want to experiment with this, as not all styles have the same templates for the editors. But most do.

Upload this image to your server at location / and style it "uploadimage.png."

Do this edit for each template indicated on the populated list above that are in red.

The result is, every member who is logged in will see the icon in the posting editors and on click, will give them a popup with the uploader loaded and ready for their images. You and your members will see this in your editors:

And that's it! The uploader itself is very user friendly and intuitive, not much different at all from photobucket, ImageShack, or any other image hosting feature including vBulletin's own attachment uploader. So your membership should have no problems with it.

I posted all images in this post, using this very same image uploader, on my board! So as you can see it can be used anywhere to post images. There are also links provided after upload, for direct sharing, email sharing, and so on.

Enjoy!