customizing joomla 1.7 backend

This article details how to customize and personalize the "Administrative" areas of Joomla! The changes discussed here primarily remove references to Joomla!. The easiest way to make this changes is through an ftp program like Filezilla. ( A free version of Filezilla is available at website Opens new window. )

Caution: Changes made to Joomla!'s core code will more than likely be overwritten when Joomla! is updated with the latest patch. While it only takes a few minutes to do, understand that you may have to do this every time you update to the latest version of Joomla! - whether a patch or a core upgrade.

Note: All extensions should be downloaded directly from the Joomla website to insure currency.

  1. Remove Joomla "Generator" Meta Tag.
    1. Upload "Set Generator" plugin. ( Set Generator plugin is available at Joomla Extensions - Set Generator Tag Opens new window )
    2. Enable plugin.
    3. Add content to "Tag Text".
  2. Styling the Header and Footer sections on the Administrative pages to remove Joomla references:
    Files Location: [core] -> administrator -> templates -> [Specific Template Used]

Code to Change:

Note: Examples are from the BlueStork Admin Template. Changes are specific to a live site. Make necessary changes relevant to the site.



Original Header Code
View source
  1. <div id="border-top" class="h_blue">
  2.      <span class="logo">
  3.          <a href="" target="_blank">
  4.             <img src="templates//images/logo.png" alt="Joomla!" /></a>
  5.      </span> (This is the Joomla Reference and Image)
  6.      <span class="title">
  7.           <a href="index.php"></a></span> (This calls the Site Name)
  8. </div>

Changed Header Code
View source
  1. <div id="border-top" class="h_blue">
  2.     <span class="logo">
  3.         <a href="" target="_blank">
  4.             <img src="templates//images/logo.png" alt="BlueWebs" /></a>
  5.     </span>
  6.     <span class="title">
  7.         <a href="index.php">
  8.             </a>
  9.     </span>
  10. </div>
  1. Be sure to change the "href" address to your own.
  2. Upload an image logo to replace the Joomla! logo in the header. I created an image in the same format (png) and the same size as the existing Joomla logo and uploaded. The file overwrites the original. It is uploaded to the images file in the templates directory.


Original Footer Code
View source
  1. <div id="footer">
  2.   <p class="copyright">
  3.     <?php $joomla= '<a href="">Joomla!&#174;</a>';
  4.         echo JText::sprintf('JGLOBAL_ISFREESOFTWARE', $joomla) ?>
  5.         <span class="version">
  7.         </span>
  8.      </p>
  9. </div>
Changed Footer Code
View source
  1. <div id="footer">
  2.     <p class="copyright">
  3.       Site designed and hosted <a href="">BlueWebs</a>
  4.       <span class="version"> </span>
  5.     </p>
  6. </div>
I keep the php version code in the footer because, unlike Joomla! 1.5, the current version in Joomla! 1.7 is in the footer of the administrative pages.

Pages that need to be changed:

  1. login.php
    1. Remove the version number from the footer code
    2. Add your logo to the header. I added my logo to the Login Page by simply creating a logo the same size and type as the Joomla! logo, named it the same and uploaded it.
      Note: If you don’t want it included, remove reference to a "logo.png" in the header section.
  2. index.php
    Note: Can be changed in the Template Manager.
  3. cpanel.php
  4. error.php
    Note: Can be changed in the Template Manager
  1. Upload company "logo.png" directly into the admin templates folder.
  2. Upload company favicon directly into the admin templates folder.
    Note: I use my company favicon, but a “client favicon” can be used instead.
  3. Change the Joomla reference and the content of the Login Page
    Location: "core" -> administrator -> language -> en-GB -> en-GB.com_login.ini
  4. Customizing the Offline Page.
    Note: All items related to the offline page are in the system templates folder.
    1. Add site logo to [core] -> templates -> images folder.
    2. Add any custom styling to the css file in [core] ->templates -> css -> offline.css
      1. Remove the p tag with the id="form-login-remember" and check box with inline styling "display: none;"
        Note: This is not necessary. My feeling is that I don't want the site to remember anyone using the backend. I want them to have to sign in every time they try to enter.
      2. Style Login input button to website standards
      3. Add background image to page using body tag, if desired.
        Note: Styling the Offline page is not required, but will lend a familiarity to previous visitors should the site need to be taken offline.
      4. Add div#frame {background: transparent;} if white default background conflicts with site background.
    3. Customize offline.php file as needed:
      1. Change the header image code and alt tag.
      2. Add div id=”offline” around page content.
  5. Upload site favicon to system folder.