My main job here at rPath, Inc. is to document our technologies via the rPath Documentation Wiki. For this wiki, we use a Mediawiki Appliance. For those that don’t know, the “appliance” I refer to here is a software appliance…something rPath technologies make easy to maintain and create. For more information see the definition of a software appliance here.
Moving on, I was ANNOYED by the fact that you have a small arrow “
” that appears beside any image that references an external URL or any link that does the same. This is fine to let people know that links will take them to a different page…but what I was trying to do was to make a PDF Icon have the same link as the URL it was sitting beside:
So in the above image, if one clicked on the PDF icon or the “Application to Appliance: A Hands-on Guide (PDF)” the PDF would download.
Mediawiki doesn’t provide a fantastic way for you to do this. However, after some snooping around via google, I found a fairly easy way to make things happen.
How to Do This
First things first. Open up LocalSettings.php and make sure to set $wgAllowExternalImages = true; if it’s not done already.
Next get the full URL link to the thing you want downloaded…in my case, a PDF. Then, get the URL for the image you want to display/link. What I did was upload the icon to the wiki and then right click on the icon and ‘view image’. Now let’s put them together:
[http://example.com/wiki/uploads/yourdownload.pdf http://example.com/wiki/images/Pdficon_small.gif]
Just after this will go the actual internal link…because the above is only for the icon. So you’d place your double bracket link just after this single bracket one.
[[Media:yourdownload.pdf|Title of Your Download]]
Now that you have both of these completed, you must encapsulate them in a span class to remove the arrow formatting. Add the following before the single bracket above:
<span class=”plainlinks”>
Then close out the span at the end of the double bracket wiki markup above:
</span>
Putting It All Together
So, to summarize, you’d have the following:
<span class=”plainlinks”>[http://example.com/wiki/uploads/yourdownload.pdf http://example.com/wiki/images/Pdficon_small.gif][[Media:yourdownload.pdf|Title of Your Download]]</span>
Seems like a lot of stuff to get a simple image link right? Yes it is. But it works and I don’t have to install an extension to do it (I’m not fond of extensions). Remember also that you can call that span class plainlinks for other simple external links as well to remove the arrow 🙂 Hope this helps someone in need…I know it helped me.
I would like to give special thanks to Distributedresearch.net which contains the meat and potatoes of this entry. What I’ve done in the example above is make it generic and give a practical example of how I used Andy’s original post.
