Normally, Joomla relies on components to load every single page. Components are so central to Joomla that even the URLs are based around the particular component that is being used.

However, sometimes more advanced site designs need to avoid showing the component.

Some templates already allow this via built-in features, but there other ways to this.

In this tutorial we will show you how to hide the component area from your home page by using Component Creator. Component Creator allows you to create your own installable components without typing a single line of code.

Create a dummy component

Take a look to our original tutorial on Component Creator. Follow only steps 1 and 2.

In our example, the component is named "com_empty".

Create an empty view

We need a view on front-end, which will allow us to use as menu item type later.

• Go to "Empty views".
• Click the "Add an empty view" button.

• Set a name. In this example we use "Empty" to emphasise its purpose
• Uncheck the "Admin views" boxes.
• Check the "Add a list view in the frontend" box.

The end result should look like this screenshot:

• Click the "Create view" button when you're done.

Download and install your component

In the right side of your screen look for the "Build" button for your component. This will download a zip file.

Like any other extension, install within your site from Extensions > Extension manager > Upload and Install.

Edit your template

Open the file templates/your-template/index.php with your favourite code editor. In this example we use Protostar

Look for the component area for the component statement:

<jdoc:include type="component" />

Edit, so the end result will look like follows:

<?php if( $app->input->getCmd('option') != 'com_empty' ): ?>
    <jdoc:include type="component" />
<?php endif; ?>

In the above code we hide the component area when the page loads com_empty. If you didn't declared $app previously, you need to add this line of code before:

<?php $app = JFactory::getApplications(); ?>

Test the new menu item type

Let's give our new com_empty to rest run. Imagine that we want to hide the component main component area in our homepage.

• Go to Menus > Main menu > Home
• Menu item type: Empty > Emptys
• Click "Save & Close"

Go to your homepage to confirm that component area is gone, but that the rest of the site is loading as it usually does: