How to Add an IFRAME in a Joomla 3.x Article

Do you have the following question?

How can I add an IFRAME to a Joomla Article?

If you have the above question and wish to know the answer, you are in the right place. Here in this tutorial I am giving you the step by step instructions so you can easily able to add any IFRAME content in the body section of your Joomla article. Here I am used Joomla 3.1 as reference. But this tutorial is also valid for Joomla 2.5 and all upcoming release of Joomla 3.x.

By default Joomla uses one editor called “TinyMCE“. In default configuration setting of Joomla 2.5 & Joomla 3.x the IFRAME content is not allowed in the article body. If you put some IFRAME code in the editor (i.e. “TinyMCE editor”), the editor automatically strips those codes form the content. So by default you can not able to save your IFRAME code in the article body.

Now, if you make some small changes in some configuration in Joomla Admin panel then you can overcome this restriction. Basically there are 2 sections in admin panel where you need to change some settings.

The First section is “The settings page of your Joomla Editor” where you need to restrict the editor so it will not strip or remove the IFRAME code . The editor settings page is varies from editor to editor. As the default editor of Joomla is “TinyMCE editor“, here I am listing the steps for that editor only. If you are using some other editor then check the configuration by your own. If you need any help just comment in this article and I will surely help you.

The Second section is “The ‘Text Filters’ section of Global Configuration” where you need to allow one or more user group so they can able to add some blocked HTML codes like IFRAME. I personally recommend you to allow this option to only the ‘Super Users‘ group.

Quick Note: Although the below steps are shown for Joomla 3.1, you can use the same steps in any Joomla 2.5 and Joomla 3.x website or may be in the higher version.

Steps to “Allow IFRAME in the TinyMCE Editor”:

Step 1: Login to your Joomla Admin Panel.

Step 2: Go to “Extensions” => “Plug-in Manager” from the top menu.  (As shown in below picture).

j3 Iframe in article pic 2
Step 2: Click to Enlarge

Step 3: On the Plug-in Manager page you can find one drop-down “Filter” option called  “Select Type“. From the drop-down list choose “editors“. (As shown in below picture).

j3 Iframe in article pic 1
Step 3: Click to Enlarge

Step 4: Now the Plug-in Manager page will list all available editors. From the list click on the “Editor – TinyMCE“. (As shown in below picture.)

j3 Iframe in article pic 3
Step 4: Click to Enlarge

Step 5: Now on the edit page go to “Basic Options” tab. Under the “Basic Options“, almost at the bottom, you can find one option called “Prohibited Elements“. You can see “iframe” is listed here. Remove “iframe” from that field. Then click on the “Save & Close” button at the top to save your changes and close the edit section. (Check the below picture for better reference.)

j3 Iframe in article pic 5
Step 5: Click to Enlarge

That’s all for the “TinyMCE Editor” settings. Now your editor is configured so it will not remove the IFRAME code.

Steps to “Allow IFRAME in the Global Configuration”:

Step 1: If you logged off from admin panel of Joomla then please login again.

Step 2: Go to “System” => “Global Configuration” from the top menu. (As shown in below picture.)

j3 Iframe in article pic 6
Step 2: Click to Enlarge

Step 3: Now on the Global Configuration page, click on the “Text Filters” tab. Under the “Text Filter Settings“, set “Filter Type” to “No Filtering” for the “Super Users” user group. Then click on “Save & Close” button at the top to save the changed settings. (Check the below picture for better reference.)

j3 Iframe in article pic 7
Step 3: Click to Enlarge

That’s all for the “Global Configuration Settings“. Now the Global Text Filters also ready to allow the IFRAME code for “Super Users“. I personally recommend you to allow this option to only for “Super Users” user group. But if you need it for some other groups then you are fine to do the same for those groups also.

If you face any kind of problem to set the above options, feel free to ask your question using the below comment form. I will surely try to help you as soon as possible.

Disclosure: Some of our articles may contain affiliate links; this means each time you make a purchase, we get a small commission. However, the input we produce is reliable; we always handpick and review all information before publishing it on our website. We can ensure you will always get genuine as well as valuable knowledge and resources.

Article Published By

Souvik Banerjee

Web developer and SEO specialist with 20+ years of experience in open-source web development, digital marketing, and search engine optimization. He is also the moderator of this blog "RS Web Solutions (RSWEBSOLS)".

Share the Love

Related Articles