InMotion Hosting Support Center

This tutorial series, Joomla 3 component development, is currently in progress...

In our last tutorial, we created a very basic Joomla 3 component called helloworld. As we continue our tutorial series on creating components, we will now learn how to add views to a component.

What is a view?

A "view" in Joomla is the set of code that creates the actual HTML for the component that is returned to the user. Views are a part of the MVC, and you can read much more thorough documentation about the MVC here.

For Example:

Included with Joomla is a component called Content, aka com_content. This component is what allows you to write articles and create categories.

When you're on your Joomla website and you're viewing an article or you're viewing the landing page of a category, you're looking at the "view" for an article and the "view" of a category.

Before the View: Setting up your Controller

Like we said, views are apart of the MVC. Before we setup the view we must first setup the controller.

Below, you will find a list of the files you will need to create / modify in order to setup the controller.


We previously created this file and placed basic code in it. Remove that code and add the following code:

// No direct access to this file
defined('_JEXEC') or die('Restricted access');
// import joomla controller library
// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');
// Perform the Request task
$input = JFactory::getApplication()->input;
// Redirect if set by the controller


// No direct access to this file
defined('_JEXEC') or die('Restricted access');
// import Joomla controller library
 * Hello World Component Controller
class HelloWorldController extends JControllerLegacy

How to setup a view

Now that we've setup our controller, we are going to setup our default view. The default view is a view named after the component. So, in our case, we are going to show you how to create a view called helloworld.

Below is a list of files you need to create in order to create the helloworld view.

Folder setup

First, create the following folders:

view name:/components/com_helloworld/views/helloworld


// No direct access to this file
defined('_JEXEC') or die('Restricted access');
// import Joomla view library
 * HTML View class for the HelloWorld Component
class HelloWorldViewHelloWorld extends JViewLegacy
        // Overwriting JView display method
        function display($tpl = null) 
                // Assign data to the view
                $this->msg = 'Hello World';
                // Display the view


// No direct access to this file
defined('_JEXEC') or die('Restricted access');
<h1><?php echo $this->msg; ?></h1>

How does all this work?

Using the sample above, the component will display "Hello World" to the screen. But how did it do that?!

Joomla needs to determine which component, view, and task to execute. It does so by reading the values from the url. As you can see below, we've highlighed where exactly the component, view, and task can be set:

Note however, the task and the view do not need to be included in the url. If they are not, their values will default to the following:

Task display

If the URL does not specify a task, Joomla looks for a default tasked named display. The display task is setup within our view.html.php file.

View component's name

If a view is not specified, the default view is loaded. The default view is the component name. Because our component was named helloworld, the default view helloworld would be run.

The best way to explain how all of these peices work together is by looking at the following image:

Was this article helpful?
Continued Education in Course How to create a Joomla 3 Component
You are viewing Section 3: How to add a Default View to your Joomla 3 Component
Section 2: Creating a Hello World Joomla 3 Component
Section 4: How to add a New View to your Joomla 3 Component

Joomla Community Google+ Hangout #3

June 3rd, 2014

Thank you @RustyJoomla for letting me speak on the Joomla Community Google+ Hangout!

Click here to watch!

Related Questions

Here are a few questions related to this article that our customers have asked:
Ooops! It looks like there are no questions about this page.
Would you like to ask a question about this page? If so, click the button below!
Ask a Question

Support Center Login

Our Login page has moved, Click the button below to be taken to the login page.

n/a Points
2017-05-12 7:15 am

Thank you. You explanation made things so simple.

n/a Points
2016-09-27 9:47 am

You've built the view using JViewLegacy, which is the old style of Joomla Development. Please update this to show the core Joomla 3.x class JViewHtml.  This is illustrated on Joomla's core com_config component.

n/a Points
2016-02-23 10:24 am

Thank you so much for your wonderful tutorail. It has helped me a lot.

n/a Points
2016-02-09 5:58 pm

I got the sme error as Rakeshwdc (also working in WAMP enviroment).

Answer to Rakeshwdc is to check the if the view.html file in the folder /components/com_helloworld/views/helloworld/ indeed has the file extention .php In my case notepad++ faild to save it with the propper extention. After fixing it displayd as expected!


n/a Points
2015-10-09 8:03 am

Joomla! 3.4.4  —  © 2015

n/a Points
2015-10-09 8:02 am

I follow the same steps but as shown on slide number 25 when I go to admin end it does not shown the hellword under menu item type ? Also when access this on frontend using this url "http://localhost/joomla/index.php/?option=com_helloworld&amp;view=helloworld" it show error "500 Layout default not found. " . Please help

41,482 Points
2015-10-09 10:16 am
Hello Rakeshwdc,

Sorry for the problems that you're having with the Joomla tutorial. We're not sure what you mean by "slide number 25" - if you could provide a link to that, then we can look to see what you're talking about. Also, our development and support is for our hosted environment. If you're running this under WAMP or XAMP, then our assistance will be limited as we do not typically provide support for programs running in those environments. You may need to go back and review your steps carefully - check for differences in Joomla version as these articles were written with an older version of Joomla 3.

If you have any further questions or comments, please let us know.

Arnel C.
n/a Points
2016-03-03 10:24 am

you certainly might want to ensure you dont have any typos in your url. correct me if im wrong, but the url your case should be more like:http://localhost/joomla/index.php?option=com_helloworld&view=helloworldhope this helps!! though aware of the date its been posted, i just wanted to leave the likely solution, so anyone having similar issue might get around this. cheers

n/a Points
2015-06-26 6:23 am

Good Article

n/a Points
2014-11-05 5:42 am

Thanks Man..Your diagram made it easy..Great expaination!!

n/a Points
2014-10-01 8:17 am

Hi I do same as below process but i got error 404: compont not found s help me for that

43,761 Points
2014-10-01 9:10 am
Hello Himanshu,

A 404 means that Joomla is looking in the place you told it to, but not finding the file. You will want to carefully go over the information you entered when following the instructions to ensure everything is created and named correctly so that Joomla can find it.

Kindest Regards,
Scott M
n/a Points
2014-09-09 5:21 am

You certainly don't want to say that a View ist not a part of MVC, do you? I got confused by "are apart of" which means "are seperated from". It has to be "are part of". Just to clarify ;)

43,761 Points
2014-09-09 8:28 am
Hello Blend,

Good find! It was meant to be written as 'a part of' as opposed to ' apart of'. One missing space certainly changed the meaning!

Kindest Regards,
Scott M

Post a Comment

Email Address:
Phone Number:

Please note: Your name and comment will be displayed, but we will not show your email address.

14 Questions & Comments

Post a comment

Back to first comment | top

Need more Help?


Ask the Community!

Get help with your questions from our community of like-minded hosting users and InMotion Hosting Staff.

Current Customers

Chat: Click to Chat Now E-mail:
Call: 888-321-HOST (4678) Ticket: Submit a Support Ticket

Not a Customer?

Get web hosting from a company that is here to help. Sign up today!