Site Offline option

Default offline page for Joomla with login form

To take your site offline using the Administrative Interface of Joomla, you go into the Site tab of the Global Configuration Menu.

There may be times when you wish to bring your site down for maintenance, troubleshooting or other reasons.

Click on Yes next to Site Offline. Then hit the green Save & Close button at the top of the page.

When you take this step, the default occurrence is that Joomla will put up a small login form with your chosen message. This is what visitors will see if they go to visit any page on your site.

In order to see your actual site for review during maintenance, you must have a login and password. You must be a registered user of the site through the Joomla User interface.

Create a Custom Site Offline Page 

This plain little login page may not be what you wish for your visitors to see when they come to your site. You can create your own custom page. You can also edit this default page using Template Overrides.

Edit the default Joomla Offline Page using Template Overrides

 You need to copy the offline files from the templates/system directory and copy them to your own template. In this example, we will use the Protostar template.

/templates/system/offline.php
/templates/system/css/offline.css
/templates/system/css/offline_rtl.css

/templates/protostar/offline.php
/templates/protostar/css/offline.css
/templates/protostar/css/offline_rtl.css

You can then edit the offline.php and corresponding CSS file as you wish. the _rtl.css file is for languages that are read from right to left. You can edit them in a text editor or now with Joomla 3.2, there is an improved text editor in the Administrative Interface under Extensions -> Template Manager. Click on the name of your default template in the Template Column and you will come the the Editor tab of the Template Manager: Customise Template screen. 

Create your own Offline Page

If you want to create an Offline page that has the look and feel of your Joomla site, and you know enough about HTML and CSS to create your own offline.php page, you can do that as well. Simply place the offline.php page in the root of your default template. Joomla will go to this page by default when the site is taken offline.

Note: Do not include any sort of links or navigation to your site pages in this offline.php page as they will not work.

If you do choose to create your own page, likely you won't be able to log into the front end of the site for troubleshooting. The normal login page will not be accessible. You can add these lines, then style it as you wish, to your custom offline.php file to create a login for the site:

<form action="<?php echo JRoute::_('index.php', true); ?>" method="post" id="form-login">
<fieldset class="input">
<p id="form-login-username">
<label for="username"><?php echo JText::_('JGLOBAL_USERNAME') ?></label>
<input name="username" id="username" type="text" class="inputbox" alt="<?php echo JText::_('JGLOBAL_USERNAME') ?>" size="18" />
</p>
<p id="form-login-password">
<label for="passwd"><?php echo JText::_('JGLOBAL_PASSWORD') ?></label>
<input type="password" name="password" class="inputbox" size="18" alt="<?php echo JText::_('JGLOBAL_PASSWORD') ?>" id="passwd" />
</p>
<?php if (count($twofactormethods) > 1) : ?>
<p id="form-login-secretkey">
<label for="secretkey"><?php echo JText::_('JGLOBAL_SECRETKEY') ?></label>
<input type="text" name="secretkey" class="inputbox" size="18" alt="<?php echo JText::_('JGLOBAL_SECRETKEY') ?>" id="secretkey" />
</p>
<?php endif; ?>
<?php if (JPluginHelper::isEnabled('system', 'remember')) : ?>
<p id="form-login-remember">
<label for="remember"><?php echo JText::_('JGLOBAL_REMEMBER_ME') ?></label>
<input type="checkbox" name="remember" class="inputbox" value="yes" alt="<?php echo JText::_('JGLOBAL_REMEMBER_ME') ?>" id="remember" />
</p>
<?php endif; ?>
<p id="submit-buton">
<label>&nbsp;</label>
<input type="submit" name="Submit" class="button login" value="<?php echo JText::_('JLOGIN') ?>" />
</p>
<input type="hidden" name="option" value="com_users" />
<input type="hidden" name="task" value="user.login" />
<input type="hidden" name="return" value="<?php echo base64_encode(JUri::base()) ?>" />
<?php echo JHtml::_('form.token'); ?>
</fieldset>
</form>

Logging into the Front End when the Site is Offline

Once you have logged into the Front End from the offline page, you should see your site as it would appear normally, and be able to navigate through it. This is only possible if the site is not so broken that the website is not functioning.