Themes

 
 
Picture of Nicole Ralph
Customising Moodle 2.1.2 log in page
 

Dear all,

Wondering if steps on how to customise Moodle 2.1.2 log in page (login/index.php) might exist?  Log in page mocj upThe image at right is the look we wish to achieve but we do not know where to start.

I suspect, to achieve our goal, we need to create a web page and include the "official" Moodle login widget to authenticate user log ins.  Am I a little bit right?

Thank you for any assistance.

Nicole

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Hi,

This is easy enough to do and you don't need a login block, you need to create a login.php file and make it your custom login page.

  1. Copy theme/yourthemename/layout/general.php and rename it to login.php
  2. Next in theme/yourthemename/config.php just replace general.php with login.php like so...
        'login' => array(
            'file' => 'general.php',
            'file' => 'login.php',
            'regions' => array(),
            'options' => array('langmenu'=>true),
        ),
  3. Next you will need to remove all the side block regions from this new login.php. I have attached an example here.
  4. Next test the page and you will see just the login and your normal site graphics. Now all you need to do is style this page to make it look like your mock-up image. 

If you need help with the CSS just ask.

PS: Much of this will be also be dependent on your theme. If it is a customised theme that's OK if it is a CORE theme like Afterburner, the file name is default.php but the method copying and changin the name would be the same, just the layout is different in Afterburner as it is with some other themes too.

As this is realy a theme question Mary Cooch may want to move this to the themes forum?

http://moodle.org/mod/forum/view.php?id=46

HTH

Cheers

Mary



 
Average of ratings: -
Picture of Nicole Ralph
Re: Customising Moodle 2.1.2 log in page
 

Thank you for your response Mary.

See how we go...

Much appreciated.  Nicole

 
Average of ratings: -
Not me
Re: Customising Moodle 2.1.2 log in page
 

Hi

I tried doing this by themes and have ended up failing with style!

I took Chris's idea and Mary's idea and tried to merge the two....

I played with the Rocket theme and kept on getting 

Coding error detected, it must be fixed by a programmer: page layout file C:\inetpub\wwwroot\moodle\moodle/theme/rocket/layout/login.php does not contain the main content placeholder, please include "<?php echo $OUTPUT->main_content() ?>" in theme layout file.

So I took Mary's idea which has the bit required in the theme layout file and <?php echo $OUTPUT->main_content() ?> creates the login box and the rest of the page.

Now nothing works as I've planned.  I don't want to use the Alternative Login URL as Chris mentions as it does not display well on mobile devices and is a lot to download IMHO.

Any ideas?  Help!

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Here is an example of a Moodle version of a customised login.php added to a theme's layout directory. it contains all of the code you would find in base/layout/general.php but with no header or footer other than the outputs of the top of body and footer HTML which are required. You need to change the theme's config to use your custom login.php instead of the one listed in $THEME->layouts.  The CSS was the hardest.  I have added the login.php for you here...the css you can get from my site if you use Firebug...and this is the result.

HTH

Mary

 
Average of ratings:Useful (1)
Not me
Re: Customising Moodle 2.1.2 log in page
 

Hi Mary

Busy marking coursework this weekend - but will try and play with this a bit more during the coming weeks.

I think it is so much better keeping it in the theme.

James

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Well there are no end of possibilities once you strip the page of the clutter!

I've attached the CSS for you to save you time...it contains all the ID & CLASS selectors for the page. If you add border: 1px solid red; for the whole group of them, you see the network of divs. Which makes me think the forms need revising.

Enjoy the coursework! smile

 
Average of ratings: -
Not me
Re: Customising Moodle 2.1.2 log in page
 

Thank you.  You're a star! smile

 
Average of ratings: -
Harley bear
Re: Customising Moodle 2.1.2 log in page
 

Hi Mary

I have the login.php and the login.css, but I don't how to connect them. I'm afraid the link to your example site (http://moodlestudio.co.uk/moodle/login/) is broken. Are you able to re-link the page or advise on how to make the login.php and the login.css communicate, please?

Many thanks for any help.

 
Average of ratings: -
Picture of Leonard Houx
Re: Customising Moodle 2.1.2 log in page
 

Further to James' question, how do you manipulate the content in <?php echo $OUTPUT->main_content() ?>, for example if you want the login box to appear above the text?

 
Average of ratings: -
Picture of Sarah Jane
Re: Customising Moodle 2.1.2 log in page
 

Hello Mary, moodlers

I too am trying to create a simple login page with an image background. I have followed Mary's recommendations and have got to the point of

  1. adding a login.php file,
  2. removing the general.php
  3. I have used your code and cleaned the side bars

Now Im stuck sad I am unsure now what to do now. I am using magazine theme and moodle 2.4.4

Can you help me here please. Thanks Sarah

 

 

 
Average of ratings: -
Picture of Sean Marx
Re: Customising Moodle 2.1.2 log in page
 

Hi Sarah

Have a look at this link: http://einstitute.afdb.org/index.php?

If this is something similar, I can explain to you what I did.

Thanks
Sean

 

 
Average of ratings: -
Picture of Sarah Jane
Re: Customising Moodle 2.1.2 log in page
 

Hi Sean

I was looking for the attached image

Your link is a really nice looking site yes, please I would be very grateful if you would explain how you did this.

Regards Sarah x


 
Average of ratings: -
Picture of Chris Kenniburg
Re: Customising Moodle 2.1.2 log in page
Group Particularly helpful Moodlers

Hello Nicole,

We have done something similar to what you want here:  http://moodle.dearbornschools.org

You can download the page and look at the code:

http://blog.dearbornschools.org/webmaster/files/2012/05/DearbornSchoolsMoodleLogin.zip

I just upload the files to a folder on any server and then let Moodle know where the alternate login URL is. In this case I just use the /login/ folder with my own login /login/dps/ directory. 

This login page uses css to create a full screen image that resizes with the browser.  Works well on Chrome, FF, and IE 8+.

 
Average of ratings:Useful (1)
Mary Cooch
Re: Customising Moodle 2.1.2 log in page
Group Documentation writersGroup Moodle Course Creator Certificate holdersGroup Moodle HQGroup Particularly helpful MoodlersGroup TestersGroup Translators

Just responding - bit late in the day - to say I am moving this to the Themes forum as requestedsmile

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Thanks Mary...

 
Average of ratings: -
Picture of Nicole Ralph
Re: Customising Moodle 2.1.2 log in page
 

Hi Chris,

We really appreciate your assistance here.  Next time you are in town (Melbourne, Australia) we would like to be you a coffee.

Awesome design on your log in page too!

Will be sure to send you our link once its all done.

All the best - Nicole

 
Average of ratings: -
Not me
Re: Customising Moodle 2.1.2 log in page
 

Wow - what happens if say a student is logging in using a mobile/tablet device.  Will Moodle automatically use the right theme?

Coffee available in Norfolk, England too - but I prefer something stronger....

 
Average of ratings: -
Picture of Chris Kenniburg
Re: Customising Moodle 2.1.2 log in page
Group Particularly helpful Moodlers

If using safari on iPhone my login page looks great.  although you will have to zoom to enter passwords.  Moodle should detect what theme it is suppossed to use I think?

Glad you guys liked it.  Send me a link with how you use it or if you make any improvements.  

 
Average of ratings: -
Not me
Re: Customising Moodle 2.1.2 log in page
 

Hi Chris

One of the things I would like to see added is where to go if a password needs resetting or some sort of contact details/acceptable use reminder.

Have a look at http://vle.ashs.norfolk.sch.uk/ - my PHP is rubbish so I'd need to add in some sort of brief...

"Login using your school ID username and password"  - Please contact vle@ if you have any issues - Remember by logging on you are blah....

 
Average of ratings: -
Picture of Nicole Ralph
Re: Customising Moodle 2.1.2 log in page
 

Hi Chris,

Might we call upon you again? We now have a "local copy" of our Moodle site where we are practicing our custom log in page php skills for fear of breaking our live site.

Chris, might you know where we 'place' our custom page in our local moodle 2.1.2 site so we can test/view it before going live?

Thanks again - Nicole

 
Average of ratings: -
Picture of Chris Kenniburg
Re: Customising Moodle 2.1.2 log in page
Group Particularly helpful Moodlers

Nicole, 

Here is how you set it up.  Copy all the files for the login page and put them into a folder such as 'newlogin'.  Then what I did is placed that folder into the Moodle Root folder under 'login' so that the file structure looks like:  

~moodle Root/login/newlogin

Then you go into the moodle settings and find where you can select an alternative login page and it will ask for a URL to the new login page.  The Alternate Login Details are found on SITE ADMIN > PLUGINS > Authentication > Manage Authentication.   You have to scroll down and you will see where Alternate Login URL details can be entered.

Following my example above you would enter for alternate login:

http://domainname/login/newlogin/login.php

Also, it doesn't matter where you place your login files.  I could host the files for you here on one of my servers and you could use it to login to your site.  So just pick a folder/place to put them and then add the URL into the moodle settings.  

I forgot to mention that you will want to change one line on login.php 

<form id="form" name="form" method="post" action="http://moodle.dearbornschools.org/login/index.php">

You obviously want to change this to your moodle login domian.

Let me know if you have any other questions.

 
Average of ratings: -
Picture of Juan Pablo Miranda Aguayo
Re: Customising Moodle 2.1.2 log in page
 

Hi all,
Can anyone tell me how to add a guest access form?
That is, user and password for registered users but with a guest login too.
Thank you

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

No...I dont have a clue sad

However if you set the site to register by email that gives you the 2 column page which you may be talking about.

Look at Site Administration> Plugins > Authentication > Manage authentication

HTH

Mary

 
Average of ratings: -
Picture of M m
Re: Customising Moodle 2.1.2 log in page
 

Thanks Mary for all the guidelines..

Nicole,

this is indeed easy..need any help contact us 

 

Thanks!

http://www.moodleofindia.com/moodleblog

 
Average of ratings: -
Picture of christian iraola
Re: Customising Moodle 2.1.2 log in page
 

There's no login.php in Aardvark theme. Do ihave to use other theme? tnx

 
Average of ratings: -
It's only an avatar...
Re: Customising Moodle 2.1.2 log in page
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

No just make a copy if general.php and remae it login.php and put it into  aardvark/layout/

Then change the THEME->layouts for Login in the config.php for Aardvark as I explained earlier in this discussion thread.

HTH

Mary

 
Average of ratings: -