Moodle
  1. Moodle
  2. MDL-31751

The location of CSS or any front end editing files for login page

    Details

    • Type: Improvement Improvement
    • Status: Closed
    • Priority: Minor Minor
    • Resolution: Incomplete
    • Affects Version/s: 2.2.1
    • Fix Version/s: None
    • Labels:
      None
    • Affected Branches:
      MOODLE_22_STABLE
    • Rank:
      38348

      Description

      As I would like to update the current theme, I am looking for the source code location I am able to modify to change the layout from the login page.
      What I have understand right now, is the config.php in my theme folder(aardvark) apply the CSS style for all the pages.
      However, from login/index.php, login/signup.php and login/signup_form.php, I found the forms were constructed by mform(moodleform), which was built in lib/formslib.php
      What I would like to achieve is to customize the label length, color and form background color in login and signup page, could anyone help me with that? Thanks

        Activity

        Nicholas created issue -
        Hide
        Nicholas added a comment -

        And I also found theme\aardvark(themename)\style\core.css might require to change, but even I deleted the whole file, there was nothing changed.
        However, if I commented the $THEME->parents = array('base','canvas'); in theme\aardvark, the login page will go back to the original theme.
        Could anyone help me explain that? Many thanks.

        Show
        Nicholas added a comment - And I also found theme\aardvark(themename)\style\core.css might require to change, but even I deleted the whole file, there was nothing changed. However, if I commented the $THEME->parents = array('base','canvas'); in theme\aardvark, the login page will go back to the original theme. Could anyone help me explain that? Many thanks.
        Michael de Raadt made changes -
        Field Original Value New Value
        Link This issue has a non-specific relationship to MDL-26400 [ MDL-26400 ]
        Hide
        Michael de Raadt added a comment -

        I've just linked this issue to another issue that, on the surface, looks irrelevant. However, the issue is dealing with the login and how it appears. I think there was an attempt to use the forms API as the basis of the login form, but this was not successful.

        Apart from that, I'm not sure what advice to give relating to customising that part of the interface. I'll ask Sam if he can quickly suggest a direction for you.

        Show
        Michael de Raadt added a comment - I've just linked this issue to another issue that, on the surface, looks irrelevant. However, the issue is dealing with the login and how it appears. I think there was an attempt to use the forms API as the basis of the login form, but this was not successful. Apart from that, I'm not sure what advice to give relating to customising that part of the interface. I'll ask Sam if he can quickly suggest a direction for you.
        Hide
        Michael de Raadt added a comment -

        Sam, can you please comment on this issue?

        Show
        Michael de Raadt added a comment - Sam, can you please comment on this issue?
        Michael de Raadt made changes -
        Component/s Authentication [ 10067 ]
        Component/s Themes [ 10088 ]
        Hide
        Nicholas added a comment -

        Thanks Michael, however, when I applied the theme, sth were changed.
        Please find my screenshot in attached files(I've migrated the registration window to the first page)

        Show
        Nicholas added a comment - Thanks Michael, however, when I applied the theme, sth were changed. Please find my screenshot in attached files(I've migrated the registration window to the first page)
        Nicholas made changes -
        Attachment after theme applied.jpg [ 27054 ]
        Nicholas made changes -
        Attachment if I use the original theme.jpg [ 27055 ]
        Michael de Raadt made changes -
        Link This issue is duplicated by MDL-31780 [ MDL-31780 ]
        Hide
        Sam Hemelryk added a comment -

        HI Nicolas,

        I'm not quite sure I understand your request entirely sorry, do forgive me if I have misinterpreted something.

        First up the location of things, the HTML for the login screen is separated into two parts.
        The standard HTML, the bits shown on every page including the header, footer, and blocks is generated by the core_renderer in lib/outputrenderers.php and can be overridden by a theme renderer. You can find information about that on this tutorial here http://docs.moodle.org/dev/Themes_2.0_overriding_a_renderer.
        Although I don't think that is the part you are interested in.
        The HTML for the actual login page forms etc is in login/index_form.html its an old file that really needs to be updated. There is an issue to convert it to a renderer so that theme's can override it but it is yet to be done.
        For the time being if you wanted to change the HTML there the only option would be to hack that file and make the changes you wanted.

        As for the CSS for the login page it really depends upon the theme you are using and which parents it inherits from.
        I would really suggest you don't make changes to core themes and instead create your own theme based upon the theme you want to use, create a CSS file for it and add what ever CSS you want to that.
        That way you could use firebug or what ever other tool you want to create the specific CSS you want to alter the login page.

        Probably the best thing to do would be to have read through the themes forum on Moodle.org and post any question you have there.
        The tracker is a good place to report bugs but its the wrong place to get help customising Moodle. There are only a handful of developers where as there are thousands of participants in the forums and they'll be able to help you out much faster.
        http://moodle.org/mod/forum/view.php?id=46

        The other place to take a look if you haven't already is the theme docs for Moodle 2. They contain a lot of useful information about getting started with themes.
        http://docs.moodle.org/dev/Themes_2.0
        Check out the see also section.

        If there is an actual bug with one of the theme's or Moodle please do let us know otherwise this issue is likely to be closed shortly.

        Cheers
        Sam

        Show
        Sam Hemelryk added a comment - HI Nicolas, I'm not quite sure I understand your request entirely sorry, do forgive me if I have misinterpreted something. First up the location of things, the HTML for the login screen is separated into two parts. The standard HTML, the bits shown on every page including the header, footer, and blocks is generated by the core_renderer in lib/outputrenderers.php and can be overridden by a theme renderer. You can find information about that on this tutorial here http://docs.moodle.org/dev/Themes_2.0_overriding_a_renderer . Although I don't think that is the part you are interested in. The HTML for the actual login page forms etc is in login/index_form.html its an old file that really needs to be updated. There is an issue to convert it to a renderer so that theme's can override it but it is yet to be done. For the time being if you wanted to change the HTML there the only option would be to hack that file and make the changes you wanted. As for the CSS for the login page it really depends upon the theme you are using and which parents it inherits from. I would really suggest you don't make changes to core themes and instead create your own theme based upon the theme you want to use, create a CSS file for it and add what ever CSS you want to that. That way you could use firebug or what ever other tool you want to create the specific CSS you want to alter the login page. Probably the best thing to do would be to have read through the themes forum on Moodle.org and post any question you have there. The tracker is a good place to report bugs but its the wrong place to get help customising Moodle. There are only a handful of developers where as there are thousands of participants in the forums and they'll be able to help you out much faster. http://moodle.org/mod/forum/view.php?id=46 The other place to take a look if you haven't already is the theme docs for Moodle 2. They contain a lot of useful information about getting started with themes. http://docs.moodle.org/dev/Themes_2.0 Check out the see also section. If there is an actual bug with one of the theme's or Moodle please do let us know otherwise this issue is likely to be closed shortly. Cheers Sam
        Hide
        Nicholas added a comment -

        Thanks Sam,

        I am using the theme of aardvark, I can find the \theme\aardvark\style\core.css defines some layout phrases. However, I could not find anything changed after I made some modification.
        Meanwhile, when I removed(commented) the line of $THEME->parents = array('base','canvas'); the login page will go back to the original looking.

        Sorry for the first time posting. I will move the topic to the forum soon, but if you could give me an answer of which file should I tack action on, I will be really appreciated of that. Thanks.

        Regards,
        Nick

        Show
        Nicholas added a comment - Thanks Sam, I am using the theme of aardvark, I can find the \theme\aardvark\style\core.css defines some layout phrases. However, I could not find anything changed after I made some modification. Meanwhile, when I removed(commented) the line of $THEME->parents = array('base','canvas'); the login page will go back to the original looking. Sorry for the first time posting. I will move the topic to the forum soon, but if you could give me an answer of which file should I tack action on, I will be really appreciated of that. Thanks. Regards, Nick
        Hide
        Sam Hemelryk added a comment -

        Hi Nicholas,

        I'm not familiar with the code behind the aardvark theme, however I'd imagine that core.css is certainly the file you should be making changes in.
        If you are making changes but are not seeing them then check that you have turned theme designer mode on, and if that still doesn't work try purging the caches.

        As for the layout you'd have to ask about that in the forums sorry, Aardvark not being a core theme I have no clue what has been done in it.

        Cheers
        Sam

        Show
        Sam Hemelryk added a comment - Hi Nicholas, I'm not familiar with the code behind the aardvark theme, however I'd imagine that core.css is certainly the file you should be making changes in. If you are making changes but are not seeing them then check that you have turned theme designer mode on, and if that still doesn't work try purging the caches. As for the layout you'd have to ask about that in the forums sorry, Aardvark not being a core theme I have no clue what has been done in it. Cheers Sam
        Hide
        Mary Evans added a comment -

        @Nicholas

        Did you ever get this resolved?

        Show
        Mary Evans added a comment - @Nicholas Did you ever get this resolved?
        Mary Evans made changes -
        Status Open [ 1 ] Closed [ 6 ]
        Resolution Incomplete [ 4 ]
        Mary Evans made changes -
        Link This issue has a non-specific relationship to MDL-26400 [ MDL-26400 ]
        Mary Evans made changes -
        Link This issue is duplicated by MDL-31780 [ MDL-31780 ]

          People

          • Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: