Skip to main content

Joomla - Creating custom Login Page

There is an easy way to create a customized Login Page in Joomla.

1. Adding A Custom Module Position in Joomla 1.5

First, in Jooma administrator page, navigate to Extensions>Plugin Manager> and make sure "Content - Load Module" is enabled/active. If there is a red "x" beside the plugin, click it to change the status to active.

The plugin you just activated will allow you to use a syntax such as "{loadposition left}" in your content item(s) in order to render modules.

So now, lets say we want to create a custom module position, lets say "c_login_page". To create a module position named "splash_page", you will need to open the file  /templates/your_current_template/templateDetails.xml. You should see an array of predefined positions such as:
<position>left</position>
<position>right</position>
<position>top</position>
/* Add this */
<position>c_login_page</position>

Save the file and upload and overwrite the file in server, you may want to consider backup you original file.

We have just created a new "c_login_page" module position. :)

2. Adding a Custom Module in Joomla 1.5

Now, go to Module Manager in Joomla administrator page and create a new custom module called "Custom Login Page" and make sure its published in the "c_login_page" position.

3. Create a static/article page for Login Page

Now you can create a content item within a category or a static content item if you prefer, and within the wysiwyg editor box just type {loadposition splash_page}.

Now you can add any text, images before and after the code in your customized login page to catch users' attention.

Remember the Article ID on the top right corner. You will need it later.

4. Add the Link to Main Menu


Finally, in Joomla Administrator, go to the Menus and select menu you wish to have the login link on, usually we will choose "Main Menu"

Then select "New", and then select the components "External Link".

Then place the link to the Custom Login Page article. Usually the link is in this format.
<your-domain-name>/index.php?option=com_content&view=article&id=<article-id>

Replace the <your-domain-name> and <article-id>.

Go to your main page and click on the Main Menu link you have just created.

Sorry, the layout is not that nice in this screenshot =p
And... DONE!


Hope this article helps some of you our there as well. :)





p/s: This is another method to add a custom module in Joomla

Add A Custom Module Position in Joomla 1.5

The positions available for your modules are defined in the templates/default/index.php file inside your Joomla directory. You can create a custom position by adding it into this file.

For example, if you want to create a position named "custom", you should add the following code into the index.php file where you want the module to be displayed:

<div>
  <jdoc:include name="custom" type="modules" />
</div>

Once you have done that, go to Extension > Module Manager, edit the module you want to display into this position and manually type "custom" into the Position field.

Then, CTRL+refresh to clear your browser cache and check your website to see the new module position.


Comments

Popular posts from this blog

225019099301.apps.googleusercontent.com

Recent activity on my Gmail just revealed that there's this app "Authorized Application (225019099301.apps.googleusercontent.com)" from IP address 54.235.159.144 assessing my Gmail.

The IP address is from a Amazon server ec2-54-235-159-144.compute-1.amazonaws.com. (IP Lookup).

And blacklist check (http://whatismyipaddress.com/blacklist-check) shows that the IP is clean too.

Clicking on the "Manage Account Access" didn't give any information on the application "225019099301.apps.googleusercontent.com".


After Googling, it appears that the app is Mailbox (source: http://productforums.google.com/forum/#!topic/gmail/9LVW_etXyTE)

To make things easy, Google should show the applications with their ID.


Backup MySQL to Azure Storage in 30 Seconds

Step 1. Disable password prompt for "mysqldump command"mysqldump: Got error: 1045: Access denied for user 'root'@'localhost' (using password: NO) when trying to connect 1. Run "vi ~/.my.cnf"
2. Add the following lines

[mysqldump]user=mysqluser password=secret
3. For Bitnami, you'll need to append the following line in "/opt/bitnami/mysql/my.cnf"

!include ~/.my.cnf
4. Try running to see if the command works.
mysqldump --all-databases > /home/bitnami/backups/db-backup.sql



Step 2(a). Install Azure-CLI Prerequisites: Installing npm.sudo apt-get update sudo apt-get install nodejs sudo apt-get install npm Note: If you facing issue while installing nodejs/npm on Ubuntu 12.04, you can refer to his article for alternative way to install https://rtcamp.com/tutorials/nodejs/node-js-npm-install-ubuntu/, or this http://stackoverflow.com/questions/16302436/install-nodejs-on-ubuntu-12-10#comment32247107_16303380

Install Azure CLI.npm install azure-cl…

Generate GoDaddy SSL Certificate (.crt) for Azure Websites (.pfx)

Step 1: Getting GoDaddy SSL cert.
Let's say you have a domain name of my_domain.com. You'll first need to generate the the .csr file for GoDaddy with the following command:

openssl req -new -newkey rsa:2048 -nodes -keyout my_domain.com.key -out my_domain.com.csr


This gives you 2 files:
my_domain.com.key - This is the private key
my_domain.com.csr - This is the Certificate Signing Request


Copy the content of my_domain.com.csr file to the SSL signing authority (GoDaddy).



Once approved, GoDaddy give you back a .zip file with the following 2 files:

18f1c77f369c0b59.crt - This is your cert
gd_bundle-g2-g1.crt - This is the GoDaddy Certificate Chain


Step 2: Convert a CERT/PEM certificate to a PFX certificate
openssl pkcs12 -export -out my_domain.com.pfx -inkey my_domain.com.key -in 18f1c77f369c0b59.crt


Step 3: Certificate to Upload to Azure.


Step 4: Assign SSL Bindings.




Step 5: Done!


References:

http://azure.microsoft.com/en-us/documentation/articles/web-sites-configure-ssl-certificate…