Which programming/scripting languages to learn to design the user interface of a Moodle website?

Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Zarah Khan -
Number of replies: 7

So I have a task of designing the user interface for a Moodle website. 

I have a cursory understanding of HTML5 and CSS3. But I am at zero skill-level in PHP. 

I have been reading through the general "how-things-work-at Moodle" in the Developer docs for a few hours now, but I am yet at a loss at this:

What programming languages shall I need to design just the user interface of the website? Is PHP essential? Where do I start?

I did learn that the modules/plugins and API are written in PHP (reference), and that HTML and CSS ARE used (reference), and I hope that I won't have to use PHP.

What if the existing API does not provide methods/functions for some types of questions, blocks etc. , which means I will have to code for them. So shall I have to use PHP for that?

I am done with downloading and installing Apache2 server and MySQL, going to install PHP and then confirgure Eclipse for Moodle development. What shall I do next?

Average of ratings: -
In reply to Zarah Khan

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Your question is very vague an so it is hard to give a meaningful answer.

Average of ratings: -
In reply to Zarah Khan

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers

Not really sure what you mean unless you are being asked to design what in Moodle terms is known as a Theme - in other words to style the user interface.

In which case there are several options:

If you select an existing theme  close to the look you want, then you may only need CSS, or even the settings in the theme

If you need to do more significant development of the UI (Theme) you will need to use primarily PHP, CSS and javascript.

Take a look at http://docs.moodle.org/dev/Themes 

And yes, if you want to do anything much beyond the basic styling using CSS, you are almost certainly going to have to use PHP as that is the language Moodle is written in.

Average of ratings: -
In reply to Richard Oelmann

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Zarah Khan -

Hi,

Thank you for the reply. I need to extend a theme such that it can display certain type of content in a certain way. 

I have been learning PHP and it seems good; I come from a Java background and so far I have found that PHP construct is much similar to Java in some way.

About the theme, so far I have found that fiddling with CSS and HTML is what it calls for.

Average of ratings: -
In reply to Zarah Khan

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by John Gifford -

Hi Zarah

It entirely depends on what you mean by designing a user interface...

If you are talking total overhaul of the interface and all functions then yes PHP is a must. PHP is the heart of Moodle.

However, if you're talking about just a front end or changing the way it looks, so that Moodle looks better than that, frankly annoying as hell, list of categories and subjects then HTML and CSS will do you.
It's the difference between constructing a whole new interface and applying a new theme.
The CSS is primarily affected by the theme you apply to your site, so the CSS files you need to change/edit are in that theme not in central Moodle.

I personally exchanged our front end for a more graphical version. I got the school graphic designer to create me some logos and then used them as buttons with hover effects, have a look at https://moodle.towers.kent.sch.uk if you want to see what I mean. If you hide everything else, I even defaulted the admin blocks to be docked, then you get a nice graphical front end. It has actually improved the way the students access Moodle immensely. It's only for the time being though because the school, in their wisdom(?) are scrapping Moodle. But that said I shifted the icons into sprites so less graphic loading was involved (otherwise it was 104 images to load each time). Our Moodle also runs as an internal/external split site so I redesigned the internal interface with a version 2, something a bit more complex. The internal version also used HTML5 animation effects, CSS, AJAX and JQuery mobile to develop a more tablet friendly interface.

Either version used the same approach though you add a topic section to the front page through the front page settings and then add an HTML label into that topics section then it's just like a normal web page.

John Gifford

Average of ratings: -
In reply to John Gifford

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Rosario Carcò -

John, I had a look at your GUI, congratulations. I like it. I had the problem, that our 11 Universities sharing the same Moodle-Site, would have ended up in a long long page like yours. That's why I developed a sitenavigation block already in Moodle 1.9 As Admin you can set it up to show categories and/or courses only to logged in users or to everybody. As our courses must be protected for privacy reasons, we allow everybody to browse the whole hierarchy of categories and courses. I reengineered the block for Moodle 2.3 - you can find it in the modules&plugins database if you are interested in. You can even choose to show the navigation in an own popup window which has not to be reloaded with every course-page. Or you can choose to have the nested folders display inline in the block.

I even combined my two blocks into one, so that you have the global and the individual navigation of the students/teachers all-in-one. And the last feature I added was the possibility for the students to show only active/actual courses, as teachers often forget to unenroll the students from old courses.

@Zarah: as I wrote in other posts, the programming learning courve of Moodle and any other so highly-sofisticated-software is very very steep. You really need time and patience and very good reasons to start programming your own blocks/modules/activities/themes and so on. I did it at least 3 times and it was worth the work I did. What I like most, is that I can share my work with so a big community, and when I am stuck, I can get help at any time from much more skilled programmers than I am myself. Last block I am working on is block_download_all_published_files, so that teachers and students can download all course files with one click. Have a look here, if you are interested in: 

https://moodle.org/mod/forum/discuss.php?d=257198

Rosario

Average of ratings: -
In reply to Rosario Carcò

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by John Gifford -

Thanks Rosario I'd certainly consider it but as I said in my previous post the school are scrapping Moodle and making me redundant in the process. The driving force behind Moodle has always been the sixth form, I was told some sixth formers were asking their teachers "is it on Moodle?" for any of the work. Well they are phasing out the A level courses and thus the 6th form. So the senior leadership see no sixth form = no Moodle, none of them use Moodle and none of them want to learn it...so it's gotta go!
Funny because our BTEC construction group have just setup all their courses on Moodle to serve as e-portfolios and all that work is now flushed down the toilet! They are not happy people...
I'd also just got Art to start considering Moodle as a showcase for student work as well as a way of delivering their curriculum with Moodle's multimedia capacity.

As to the list of subjects in that long grid that's only on the external facing site. The internal site as I said has version 2 which has a sliding list of icons, tablet swipe style, and tapping an icon causes a dropdown pane with a 2 level list of subcategories (so any subject can have 3 levels to put stuff on) in one pane and the courses in the other. If you tap a sub category the course list then updates to reflect that subcategory's course list.  I hacked and butchered the category.php page in the courses folder to get the panes to work. It uses Ajax calls to get the category/subcategory/course details and Jquery to give the tap abilities. No course is more than 3 clicks/taps away. I would have rolled it out to the external site if I'd had time but I got the info that Moodle was being trashed so I thought "what the hell..." and left it alone. I was even thinking about a 2.7 upgrade this summer but that's now pointless too.

What are they going to replace Moodle with?
...NOTHING! official line from the principal.

John Gifford

Average of ratings: -
In reply to John Gifford

Re: Which programming/scripting languages to learn to design the user interface of a Moodle website?

by Rosario Carcò -

Ooohh - Ooohhh, I am very concerned, as 2 years ago I was flushed down... too when the board decided to let Moodle be hosted by an official Moodle-Partner. Since then my sporadic contributions are mere spare-time contributions, as I have no Moodle in production any more.

Average of ratings: -