Replacing the Joomla Native Login Screen With Hello Me Module

Revision as of 11:48, 26 July 2013 by Sinisakrisan (Talk | contribs)

Overwiew

Because JomSocial is component for Joomla, and it does not have its own user object, many users can't figure out why sometimes registration and login form lead to native Joomla forms for this task.
Some Template clubs override the native Joomla login form which by default, should be accessible with this link

http://yourdomain.name/index.php?option=com_users&view=login


If you visit your site by using this link, in most cases you will be presented with the following screen

Joomlalogin.png

If you login using this form, you will most likely see something like this

Joomlaprofile.png

If you click on the registration link, you will be redirected to native Joomla registration form

Joomlaregistration.png

This is intended behavior, because Joomla as an user-based CMS, designed to work without JomSocial installed, and after all, we are currently on the com_users component, which is not JomSocial, and have nothing to do with it.

JomSocial Redirect Plugin

Since not many users do not know or do not want to bother with minor customization and hacking, we provided the Redirect Plugin which should redirect all registration requests to JomSocial's form.
This plugin however, won't do anything if user use Joomla login form to access the site. It will still be presented with native Joomla user page.
Therefore, one can simply create template override, which is more efficient as you don't have to load additional plugins.
remember - Less plugins = faster site load time

Using The Joomla Override

There is one fantastic feature of Joomla still unknown to vast majority, and very under-utilized by many web-admins. It is called simply, template override
This feature that is built into Joomla since version 1.5 and still present to the latest version is here to stay, because it is so powerful thing to have that would be shame to remove it. With it, you can practically change the layout of every component and a module which follows the MVC Joomla standard, and frankly, most of the modern extensions do.

How Do We Know What File To Override

This is good, yet illusive question. Many people still underestimate the power of non-SEF links when it comes to debugging
If you remember the link we gave you at the beginning of this guide you will notice how easy is to discover what file we should be edit.

Comuserslink.png
  • option=com_users - tells us that we should look into com_users component
  • &view=login - tells us that view should be login

Lets open the file of interest. Navigate to: ROOT/components/com_users/views/login
There will be a folder which does not really give us any clue what file to modify

Foldercontent1.png

However, since Joomla uses template files to layout the design of views, all files of interest will be in the tmpl folder. Open it

Foldercontent2.png

Obviously, modifying any of this files will work, and will give the desired effect, however, we want to create the override in the main site template so we do not hack the core files and ensure that our customization will remain available even if we update Joomla core

Creating The Override Files and Folders

Although creating the oerride folder is universally applied to every template, we are going to make this example on protostar template of Joomla 3
Navigate to: ROOT/templates/protostar and observe the structure of the folders

Protostarstructure.png

There is a highlighted html folder, which is actually Joomla override folder and every modern template should have it. If your template does not have this folder, you are free to create one.

TIP Make sure you put an empty index.html file in every new folder that you manually create on your site

Following th non-SEF link of the page we want to create override for will tell us that we want to override com_users component and login view so we will create the new folders within html override for the component and the view that is to be overridden. ROOT/templates/protostar/com_users/login

Notice that the structure slightly changed comparing to the core paths. It is all explained in the Joomla article about template overrides

We can now take all the files from ROOT/components/com_users/views/login/tmpl' and copy them to ROOT/templates/protostar/com_users/login override folder