Custom Page Themes

Custom Page Themes

by Warren White -
Number of replies: 10

I need to know how to create custom "Page Themes" in code, but am unable to find decent documentation.

There is reference to page-only themes here http://docs.moodle.org/20/en/Theme_settings#Page_theme

Can anyone please give me direction?

My goal is to be able to have custom couse themes, with different look and feel for content pages, that will be developed in DreamWeaver.

 

Thanks,

wew

Average of ratings: -
In reply to Warren White

Re: Custom Page Themes

by Mary Evans -

A thought just occured to me...

Do you actually know how Moodle works?

From your question I would say you are pretty clueless about Moodle, because if you did know you would not be asking this question, you would be asking me...

What is the best way to create a theme that would only be used as a course theme?

My answer would then have been...

Start of by reading this short tutorial...

Development: Themes 2.0 how to clone a Moodle 2.0 theme

And that basically is all you would need to learn. How you turn this into a fancy theme in Dreamweaver is up to you.

HTH

Mary

In reply to Mary Evans

Re: Custom Page Themes

by Warren White -

Clueless eh? Maybe you should take your sunglasses off, and re-read the OP!

I cannot believe you Mary the Moderator of the Theme Forum here at Moodle.org, is calling someone CLUELESS for asking a question.

Did you click the link to Special Themes?

You are correct in that I do not know, that is why I ask the question.

Specifically, there are Special Themes that include Session Themes and Page Themes.

The documentation states:

Page theme

A page theme is for special page-only themes set by code.

Page Theme overrides all other themes, diplays depend on code, and setting location is in code.

So, Mary, can you show me an example of setting a Page Theme in code that is a different theme than site, course, and category?

In reply to Warren White

Re: Custom Page Themes

by Mary Cooch (personal account) -
Picture of Documentation writers Picture of Testers

Hi Warren (I'm a different Mary without sunglassessmile) I'm not a themer but I think what Mary meant was that the coding for page themes is the same as the coding for course themes or site themes - so in order to learn how to make a page theme you would first have to learn the basics of Moodle 2.0 themes in general -from the link she gave you.

In reply to Mary Cooch (personal account)

Re: Custom Page Themes

by Warren White -

Thank you, I have now created a site theme, a course theme, and a category theme.

All work as anticipated, and can configure from GUI.

No problem creating site, course, category themes.

In reply to Warren White

Re: Custom Page Themes

by Dan Trouten -

Warren...I started using DreamWeaver long before Adobe bought it out and started using Adobe products back with Illustrator 3.1. I now use CS5 Master Collection (DW 11). So...although I understand your question I'm not sure if you understand that you're going around your elbow to get to your thumb by doing the work in DreamWeaver. I think this is where Mary E was comin' from.

Now, if you want to develop actual themes from scratch that's a different story. To be honest, 99.9% of the people who use moodle simply modify existing themes. If you want to make your own from scratch you will need to read all that structure stuff at the link section she posted. Also, don't think that DreamWeaver is going to give you a ready to use theme. Just sayin.... wink

Good luck!

In reply to Dan Trouten

Re: Custom Page Themes

by Warren White -

I wish I never mentioned DreamWeaver, this is a question about Special Themes, not how to create themes from scratch.

I have a site that has a theme. Then I have a category, that has a different theme. I also have a course that uses yet another theme. For simplicity, lets call theme sitetheme1, categorytheme2, and coursetheme3.

Now, I can set the priority of themes from highest to lowestorder for how they are displayed:

$CFG->themeorder = array('course', 'category', 'session', 'user', 'site');

Now, what I want, is to be able to set individual 'Page' (resources) themes inside of a course, that use say custompagethemeX that is different than the course theme.

So, my priority would then be:

$CFG->themeorder = array('page', 'course', 'category', 'session', 'user', 'site').

My original question re-worded, "How can I enable custompagethemeX, for resources like Pages  inside a course, where custompagethemeX is different than coursetheme3?"

In reply to Warren White

Re: Custom Page Themes

by Mary Evans -

ROFL...this is hilarious.

Custom pages...ah...now that IS different.

First of all, putting my bad start to this behind us, in relation to the site you have in mind to experiment with this type of theme page, where exactly are you intending the page or pages to be?

In the config.php within BASE theme there are a good number of likely settings for Theme page layouts...

For example:

$THEME->layouts = array(
    // Most backwards compatible layout without the blocks - this is the layout used by default
    'base' => array(
        'file' => 'general.php',
        'regions' => array(),
    ),
    // Standard layout with blocks, this is recommended for most pages with general information
    'standard' => array(
        'file' => 'general.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),
    // Main course page
    'course' => array(
        'file' => 'coursepage.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
        'options' => array('langmenu'=>true),
    ),
    'coursecategory' => array(
        'file' => 'coursepage.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),
    // part of course, typical for modules - default page layout if $cm specified in require_login()
    'incourse' => array(
        'file' => 'coursepage.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),
    // The site home page.
    'frontpage' => array(
        'file' => 'frontpage.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),
    // Server administration scripts.
    'admin' => array(
        'file' => 'general.php',
        'regions' => array('side-post'),
        'defaultregion' => 'side-post',
    ),
    // My dashboard page
    'mydashboard' => array(
        'file' => 'general.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
        'options' => array('langmenu'=>true),
    ),
    // My public page
    'mypublic' => array(
        'file' => 'general.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),
    'login' => array(
        'file' => 'loginout.php',
        'regions' => array(),
        'options' => array('langmenu'=>true),
    ),

    // Pages that appear in pop-up windows - no navigation, no blocks, no header.
    'popup' => array(
        'file' => 'general.php',
        'regions' => array(),
        'options' => array('nofooter'=>true, 'nonavbar'=>true, 'nocustommenu'=>true, 'nologininfo'=>true),
    ),
    // No blocks and minimal footer - used for legacy frame layouts only!
    'frametop' => array(
        'file' => 'general.php',
        'regions' => array(),
        'options' => array('nofooter'=>true),
    ),
    // Embeded pages, like iframe/object embeded in moodleform - it needs as much space as possible
    'embedded' => array(
        'file' => 'embedded.php',
        'regions' => array(),
        'options' => array('nofooter'=>true, 'nonavbar'=>true, 'nocustommenu'=>true),
    ),
    // Used during upgrade and install, and for the 'This site is undergoing maintenance' message.
    // This must not have any blocks, and it is good idea if it does not have links to
    // other places - for example there should not be a home link in the footer...
    'maintenance' => array(
        'file' => 'general.php',
        'regions' => array(),
        'options' => array('noblocks'=>true, 'nofooter'=>true, 'nonavbar'=>true, 'nocustommenu'=>true),
    ),
    // Should display the content and basic headers only.
    'print' => array(
        'file' => 'general.php',
        'regions' => array(),
        'options' => array('noblocks'=>true, 'nofooter'=>true, 'nonavbar'=>false, 'nocustommenu'=>true),
    ),
    // The pagelayout used when a redirection is occuring.
    'redirect' => array(
        'file' => 'embedded.php',
        'regions' => array(),
        'options' => array('nofooter'=>true, 'nonavbar'=>true, 'nocustommenu'=>true),
    ),
    // The pagelayout used for reports
    'report' => array(
        'file' => 'report.php',
        'regions' => array('side-pre','side-post'),
        'defaultregion' => 'side-pre',
    ),
);

This is as far as I know the only place you can begin to customise those areas.

You would do this by creating a special layout page for each given layout in this list.

Take My Public page as an example: This is the page you can customise yourself here in Moodle.org. You can add blocks, move stuff about add images make it your own basically.

    // My public page
    'mypublic' => array(
        'file' => 'general.php',
        'regions' => array('side-pre', 'side-post'),
        'defaultregion' => 'side-post',
    ),

In the above you will see it uses general.php as the page layout. If you wanted to "customize"  this page you could make a page based on general.php where you could totally redesign it.

This is what I am doing at present using a Free CSS Template which I found on the web.

The Theme uses Base as a parent but the theme CSS is the original CSS from the template, modified to meet Moodle standards re images etc.

Most of the pages I have in this theme are based on the same index.html I got with the Free template, this includes the Lorum ipsum dummy text and the images and pseudo blog news bulletins...which make it look totally different than the ordinary Moodle site. You can see for yourself HERE.

If this is what you mean...then that is easy enough to so, as you obviously know a lot more tan I first gave you credit for, for which I openly apologies.

HTH

Mary

In reply to Mary Evans

Re: Custom Page Themes

by Warren White -

Thank you Mary, this is much better and getting closer to the answer I am looking for.

In Moodle1.9, we have uploaded custom html, css, and js files into the file system, linked lessons directly to the uploaded files in the file system. Each lesson html page may have different css and js.

Now, in Moodle 2.1, there is no concept of 'file system' as it was in Moodle 1.9.

So, my challenge is, to customize lesson pages that are uploaded via moodle interface, but have a theme attached, without having to re-upload all js, css, and images.

 

Thanks.

In reply to Warren White

Re: Custom Page Themes

by Mary Evans -

I'm sorry but this is bordering on development work and not pure themes as such. What you are proposing is beyond a straight forward theme folder added to the theme directory within Moodle and set within the course or category.

The idea of creating pagelayouts means you could in effect have one theme which has different styles for each of the pages by manipulating the css id and class selectors.

But given that this is something new and not well documented, and perhaps an idea that is yet to be realised, the avenues open to you, as I see them, are:

1. Additional HTML (Site Administration > Appearance > Additional HTML)

2. Accessing the YUI JavaScript Library which Moodle has already (moodle/lib/yui...)

3. Enabling Legacy Files ( Somewhere in the Admin settings try Site Administration > Security > Site Policy) similar to Moodle 1.9 Server Files

HTH

Mary