A1Media.ca

Is the Joomla wrapper feature a good thing? Or, is it just an evil thing used by lazy web developers? If this is a question that keeps you awake at night, pull up a chair and get ready to be dazzled! Okay, maybe dazzled is over-selling it. Get ready to be ... INFORMED! Heh! That's the ticket.

What is the Joomla Wrapper?

Never one to miss an opportunity to be pedantic, let me describe the Joomla wrapper ... in excruciating detail.

The Joomla wrapper is simply an IFRAME that gets inserted where your article content normally gets inserted. What is an IFRAME? The term "IFRAME" is short for in-line frame; it is an HTML tag that lets you insert the contents of an external web page into the web page you are currently viewing. Because the IFRAME area is where your article content normally goes, and because the rest of your Joomla website (i.e., header, footer, navigation) surrounds the IFRAME, you are, in effect, wrapping your Joomla website around another website or webpage.

What Could Possibly Go Wrong?

So FRAMES and IFRAMES sound great, huh? You can cut down on your site edits, and you can turn your site into a content amoeba that ingests single web pages and even whole websites! And think of the fun you could have: say you have a Joomla content website and now you also want a full-featured community message board like phpBB, SMF, vBulletin, or IP Board, you could painstakingly design your message board to look exactly like your Joomla website, or you could just install your board with a stripped-down template and then embed your forum into your website using the Joomla wrapper feature. By using the wrapper, your message board blends perfectly into your Joomla site. Voila! Problem solved.

There's No Free Lunch

Before you mix yourself a congratulatory martini, we have a couple of problemos:

• Direct linking
• Dynamic Resizing of the IFRAME

Direct Linking: Say one of your site users is browsing your cleverly embedded community message board and reads a post that literally snaps the elastic in her support hose. She wants to share the post, so she looks to her browser's address bar in order to copy and paste the forum post url into an email to her buddy---who, fortunately, is a trained hosiery repair man. Hold on, the url she sees is simply the url of your site with /forum after the domain. She's no web expert, but she knows that isn't enough url-ery for a typical forum post.

And she'd be right. Joomla wrappers do let you embed external pages, even entire external websites, but no matter how few or many pages are served up by your Joomla wrapper, the page url will never change. And yes, ladies, that's a deal breaker! (yeah, I watched 30 Rock the other night).

Dynamic Resizing: Okay, if the lack of direct linking wasn't enough to discourage you, get this: if the page you are embedding is larger than the IFRAME area, you will get nasty scroll bars. Yuckers!

What's that? Yes you, the pimply-faced dude with the pocket protector and smelling of stale milk ... yes, you. Oh, right, we can force the scroll bars to stay off and resize the frame dynamically to accommodate the embedded content. Right you are, my be-pimpled friend. However, that only works if the content you are embedding resides on your Joomla website's domain. So, close, bro! ... you can sit down now, but thanks for playing.

In other words, if you installed your message board on the same domain (that's important) as your Joomla site, there are settings inside the Joomla Wrapper link you created that will allow the wrapper frame to grow and contract automatically to accommodate the embedded content thereby eliminating the appearance of ugly scroll bars. But let me repeat, this dynamic resizing only works if the embedded content is on the same domain as your Joomla website. For example, if your Joomla website is on http://www.myjoomlasite.com/ and you embedded content is at http://www.myjoomlawebsite.com/other-content-or-application/index.php, then the scroll bars will never show up.

Why does this dynamic resizing thing only work for content on the same domain? Why can't it resize dynamically for content on another domain? Well, it could, and it actually used to do just that; at least it could until bad people figured out they could inject their own IFRAMES into someone else's web content (e.g., through a MySQL injection) and serve up nasty content or malware without anyone knowing what was happening. As soon as the browser developers realized this was happening, they altered their browsers so that any webpage that has an IFRAME calling content from a site other than the parent page's domain would not be able to resize dynamically. It's a security thing, and try as you might, you can't get around it ... at least, I don't think you can ... and I hope you can't!

Joomla Baby, Wrapper Bathwater: Keep or Throw?

Should you use the Joomla wrapper or not? Frankly, you can use it, but sparingly. Here are some possible scenarios:

Joomla + single external page: If there is an external web page that you are bound and determined to have on your Joomla website, and you can neither move, nor copy said page, and if the overall dimensions, both height and width, of said page never varies, then I would definitely embed it in a Joomla wrapper.Of course, you should either own the page or have permission to embed it into your website before doing so.

Joomla + message board: Whenever I build a Joomla website with a third-party message board (e.g., phpBB), I do take the time to customize the forum's template so it looks identical to the main Joomla website. This customization is very often a time-consuming pain in the arse, so to do it more than once per site is something I want to avoid at all costs. Unfortunately, during the development stages of a new site build, menu items and overall site styles change from day to day. If during this dev period I had to constantly update the mirrored header on the forum, I  would soon be wanting to strangle myself with my mouse cord (good thing I use a wireless mouse!).

Solution: install the forum with a bare bones template and link to it with a Joomla wrapper menu item link. Now, when the client visits the forum, it always has the most current look and feel as the main Joomla website. Eventually, after the design of the main site and its menus have settled into their long-term states, that's when I mirror the final design onto the forum and link the menu directly to the forum's real homepage rather than bring it up in a wrapper link. I would not, however, attempt to wrap a forum in the Joomla wrapper if said forum resided on a domain different than the main Joomla site for the reasons I explained above.

Joomla + other standalone web apps: I'm a big believer in NOT using Joomla for everything. Joomla is a fantastic content management system, but it isn't great for everything. So, if you are faced with installing a feature on your own or a client's website, and the available Joomla extensions aren't quite to your liking, but you do know of an excellent standalone web app that'll do the trick, consider using it within the Joomla wrapper.

So long as the need for direct linking to pages within the standalone application isn't a priority, and as long as the app is installed on the same domain as your Joomla website, then the integration will be completely seamless and you'll have kept your Joomla install lean and clean and still reap the benefits of an uber-powerful application with more and better features than a Joomla extension that tries to imitate it.

How to use the wrapper:

Now that I've bored you to death, here's what you probably came to this page looking for in the first place:

Login into your Joomla admin and go to ... Admin CP > Menus > Main Menu (or menu of your choice) and click green-colored "New"  button in the upper right of the page. You'll see this:

Click on the Wrapper link, which expands it to reveal yet another wrapper link, click that and you'll see the main wrapper module page. Give your wrapper menu item a title, an alias if different than the title (the alias is used to create the url of your wrapper page). The link field is pre-loaded with the wrapper component url, so leave it alone (perhaps someone will enlighten us as to why it is editable in the first place?).

Now, let's get down to bidness. Let's set your wrapper's parameters.

Basic parameters:

Put the url of your external web page in the "Wrapper URL" field. If the page you are embedding is on a different domain than your Joomla website, and you know that the page contents may vary in height or width, then select either "Yes" or "Auto" for the scroll bars. Selecting "Yes" will force the scrollbars to appear whether they are needed or not; "Auto" will only put the scroll bars in if they are needed. Seems like a no-brainer to me: select "Auto," but test it to make sure it gets it right.

Width can be a percentage or pixels and simply refers to the width of the wrapper window on your Joomla page. Common sense applies here: don't make the width wider than your Joomla content area or you'll break the design of your web page. Height is a fixed height of the wrapper widow, and it too can be set to a percentage of the parent page's content area, or to an exact pixel height. With both the width and height fields, if using pixels, simply put in the number, if percentages, put a % sign after the number.

Advanced parameters:

Auto Height is the key setting for when you wrap your Joomla site around a page or application ON YOUR DOMAIN. If the page or application is on your Joomla website's domain, then set Auto Height to "Yes" and no one will be the wiser that you are using a wrapper (unless, of course the item you are wrapping consists of more than one web page, then your embedding shenanigans will be revealed). If the page you are embedding / wrapping is on another domain, then set Auto Height to "No".

Auto Add will put the "http://" prefix on the URL you entered in the basic parameters. Why this field isn't right under the Wrapper URL field of the basic parameters shown above is a mystery to me. Personally, I think it's a silly field and should be removed, but hey, that's just me. Just make sure you put the http:// in your Wrapper URL and set this to "No".

I won't go over the system parameters because they are the standard parameters, so set them as you like.

Conclusion:

Well Joomlaphiles, that's the wrapper. Pretty obvious stuff after you have used it, but until that day, it can be a bit mysterious. If possible, avoid using it, but if you want to expedite your development efforts, or you have a standalone app you know will do a better job than an equivalent Joomla extension (and said app won't need to be directly accessed via its native urls), or you need to get a much-needed but hitherto inaccessible bit of web content into your Joomla website, consider using the Joomla Wrapper! Hang on, Joomla! Wrapper. There, fixed that.

P.S.

I just encountered a problem in a site where we implemented the wrapper and it was not displaying the full width of the page in IE8 or IE9. It worked great in Firefox v3.x and v4, and just about every other browser, too. We found the problem was the width being set to 100%. By changing it from a percentage to an actual width, in this case "900" for 900px, it solved the problem and the wrapper frame worked again in IE. Just thought I'd share that.

---