Difference between revisions of "Replacing the Joomla Native Login Screen With Hello Me Module"

(Creating The Override Files and Folders)
(How to Remove These Pages)
 
(30 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
==Overwiew==
 
==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.<br/>
+
Being a Joomla component, JomSocial does not have its own user object and many users can't figure out why sometimes registration and login form lead to native Joomla forms.<br/>
Some Template clubs override the native Joomla login form which by default, should be accessible with this link
+
This can cause users to be out of the sync which usually reflects with missing custom profile fields, or avatars.<br/>
 +
You can easily access these pages via these links:
 +
* For login page
 
<syntaxhighlight lang="php">
 
<syntaxhighlight lang="php">
 
http://yourdomain.name/index.php?option=com_users&view=login
 
http://yourdomain.name/index.php?option=com_users&view=login
</syntaxhighlight>
+
</syntaxhighlight><br/>
<br />
+
If you visit your site using this link, you will be presented with the following screen
If you visit your site by using this link, in most cases you will be presented with the following screen
+
 
:::[[File:Joomlalogin.png]]
 
:::[[File:Joomlalogin.png]]
If you login using this form, you will most likely see something like this
+
* For registration page
::: [[File:Joomlaprofile.png]]
+
<syntaxhighlight lang="php">
If you click on the registration link, you will be redirected to native Joomla registration form
+
http://yourdomain.name/index.php?option=com_users&view=registration
 +
</syntaxhighlight><br/>
 +
Using this link will allow all users to register with Joomla and completely avoid the JomSocial registration flow.
 
:::[[File:Joomlaregistration.png]]
 
:::[[File: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.
+
{{alert|<center>'''This is expected behavior, because Joomla is an user-based CMS, designed to work without JomSocial installed'''</center>|alert-info}}
 
+
==JomSocial Redirect Plugin==
+
Since not many users do not know or do not want to bother with minor customization and hacking, we provided the [[JomSocialRedirect|Redirect Plugin]] which should redirect all registration requests to JomSocial's form.<br/>
+
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.<br/>
+
Therefore, one can simply create template override, which is more efficient as you don't have to load additional plugins.<br/>
+
remember - Less plugins = faster site load time
+
  
==Using The Joomla Override==
+
==How to Remove These Pages==
There is one fantastic feature of Joomla still unknown to vast majority, and very under-utilized by many web-admins. It is called simply, [http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core template override]<br/>
+
You can't. <br/>
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.
+
As mentioned earlier, these pages are standard part of Joomla and they are always available on every single Joomla-based website but, you can utilize the [https://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core template overrides] which is also a built in feature of Joomla. <br/>
 +
We have prepared the override for Joomla users component which will show a '''HelloMe''' module replacing native Joomla login and register forms. <br/>
 +
All you have to do is to follow this simple three-steps guide:
 +
* '''Step 1:''' Download [http://documentation.jomsocial.com/downloads/hellomeoverride.zip this zip file] and unzip it to your desktop
 +
* '''Step 2:''' Upload extracted files to JOOMLAROOT/templates/YOUR_TEMPLATE/html folder. If '''html''' folder is not there, feel free to manually create it.
 +
* '''Step 3:''' Create a new Hello Me Module and publish it in the position '''hellome_override''' on all pages. You must enter that position name manually
 +
:::<img src="http://documentation.jomsocial.com/downloads/manually_type_position.gif" />
  
===How Do We Know What File To Override===
+
==Finalizing==
This is good, yet illusive question. Many people still underestimate the power of non-SEF links when it comes to debugging<br/>
+
If everything went well, you will now see the HelloMe module instead native Joomla, but if using the template with [https://docs.joomla.org/Component wide component area] the design might be a little '''off'''
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.
+
:::[[File:Hellome joomla.png]]
:::[[File:Comuserslink.png]]
+
In such cases, you will most likely want to edit these two files and add your custom styling to these pages.
* <font color=red>'''option=com_users'''</font> - tells us that we should look into com_users component
+
# JOOMLAROOT/templates/YOUR_TEMPLATE/html/com_users/login/default.php
* <font color=green>'''&view=login'''</font> - tells us that view should be ''login''
+
# JOOMLAROOT/templates/YOUR_TEMPLATE/html/com_users/registration/default.php
Lets open the file of interest. Navigate to:
+
'''ROOT/components/<font color=red>com_users</font>/views/<font color=green>login</font>'''<br/>
+
There will be a folder which does not really give us any clue what file to modify
+
:::[[File: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<br/>
+
:::[[File: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===
+
==See Also==
Although creating the oerride folder is universally applied to every template, we are going to make this example on '''protostar''' template of Joomla 3<br/>
+
* [[Customizing Template|Customizing JomSocial Template Using Joomla Overrides]]
Navigate to: '''ROOT/templates/protostar''' and observe the structure of the folders
+
:::[[File: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 it, you are free to create it.
+

Latest revision as of 04:10, 26 May 2016

Overwiew

Being a Joomla component, JomSocial does not have its own user object and many users can't figure out why sometimes registration and login form lead to native Joomla forms.
This can cause users to be out of the sync which usually reflects with missing custom profile fields, or avatars.
You can easily access these pages via these links:

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

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

Joomlalogin.png
  • For registration page
http://yourdomain.name/index.php?option=com_users&view=registration

Using this link will allow all users to register with Joomla and completely avoid the JomSocial registration flow.

Joomlaregistration.png
This is expected behavior, because Joomla is an user-based CMS, designed to work without JomSocial installed

How to Remove These Pages

You can't.
As mentioned earlier, these pages are standard part of Joomla and they are always available on every single Joomla-based website but, you can utilize the template overrides which is also a built in feature of Joomla.
We have prepared the override for Joomla users component which will show a HelloMe module replacing native Joomla login and register forms.
All you have to do is to follow this simple three-steps guide:

  • Step 1: Download this zip file and unzip it to your desktop
  • Step 2: Upload extracted files to JOOMLAROOT/templates/YOUR_TEMPLATE/html folder. If html folder is not there, feel free to manually create it.
  • Step 3: Create a new Hello Me Module and publish it in the position hellome_override on all pages. You must enter that position name manually

Finalizing

If everything went well, you will now see the HelloMe module instead native Joomla, but if using the template with wide component area the design might be a little off

Hellome joomla.png

In such cases, you will most likely want to edit these two files and add your custom styling to these pages.

  1. JOOMLAROOT/templates/YOUR_TEMPLATE/html/com_users/login/default.php
  2. JOOMLAROOT/templates/YOUR_TEMPLATE/html/com_users/registration/default.php

See Also