créatif (ver 1) – a theme for Moodle 2

6 07 2010

PLEASE NOTE: I’ve just updated the download files again, Nov 30th. It should work with Moodle 2’s official stable release, which was downloadable from the 24th Nov from Moodle.org. There may be some further glitches that I haven’t seen, so please feel free to leave a comment if so.

I’ve just designed a theme for Moodle 2, and I’m entering it in to a theme comp ran by New School Learning. Pretty exciting really, the process of making the theme was really fun, except the bugs in IE of course, haha!

My theme, called créatif, is a mood theme I reckon. The randomised back drops will feature faded photographs (mostly beautiful landscapes), and I’m trying to get a really nice pleasant visual experience happening.

Technically the first draft is fairly okay – I would have liked to have made use of renderers to completely overhaul a lot of the un-needed html and css classes that moodle is bogged down by, but time permitted me from doing it for this version of the theme.

I think the big thing to improve next version (ver 2) of this theme, along with renderers and more effective css will be:

  1. to allow teachers to add their own imagery for the backgrounds for ‘their courses’ – pictures that are course specific for them for example. It would use these instead of the pre-packaged ones I’ve got in the pix directory;
  2. I’d also like to make it work 100% drag-and-drop with jQuery’s theme roller.. So in other words, you simply design your jQuery theme roller and drop it in to the moodle theme directory – and the moodle ui takes on the jQuery css and pix. Why? Well let’s be honest, YUI looks like horrible in comparison and jQuery’s theme roller idea leaves YUI skinning for dead;
  3. have a rather nice handy settings page which allows the admin to change the logo and/or background images, and theme roller css via the GUI rather than putting the files in manually etc;
  4. I might also make it a stand-alone theme rather than use other themes as parents, I only did this to satisfy the requirements of the comp.

Without further adieu, je vouz present – créatif; screenies and a theme download. IF YOU DO DOWNLOAD and install this theme, please read the comments in the config.php – I’ve described a few things that will help you update the institution logo and background images.

This slideshow requires JavaScript.

The download: visit the Moodle Themes page on this blog ; )

Advertisements

Actions

Information

135 responses

9 07 2010
JuanJo

Hi!!

I’ve been trying to use this theme, but it doesn’t work to me. I’ve seen in the config.php that you use the base and the canvas themes. Could you include them in the files?
If this can help you I’m working with moodle 1.9

Thanks for your effort!!

10 07 2010
Rolley

GDay Juan, thanks for that, guess what though! The moodle 2 themes, unfortunately, are NOT compatible with any previous version of moodle, so you’ll have to go from 1.x to 2.0 to use the theme I’ve made, sorry : )

Version 2 isn’t final yet either, I had one of the preview versions installed, and there is still a few issues to iron out before its finalised in a stable release ; )

Let me know if you have any probs once you get Moodle 2 on, if you go that way ; )

22 07 2010
Vicke

I like the theme, but is there a way to put the menus on the left as opposed to the right?

22 07 2010
Rolley

Thanks Vicke, do you mean the boxes and the dock?? The ‘menu’ feature does display to the top left already – the dock and blocks though I’ve styled up to be fixed to the right – it’s easy enough to undo but it either has to be one way or the other. Thanks for the point though, when I do the next version and implement a ‘settings’ page, I should include the option to choose left or right anchorage for those elements!
Ta
r

24 07 2010
Vicke

Yes, that was what I had in mind. I am creating a portfolio for a job search. Having the boxes/dock on the left gives a more BlackWeb or D2L look, which makes it look better for the schools using those. Some are uncomfortable with open source.
How would I go about that?
Thanks
vic

30 07 2010
Rolley

Hey Vicke,
Sorry bout the delay. the css for the Dock and Blocks can be changed, but there’d also need to be changes in a stack of other places too, and without doing it myself I’m not sure what unforeseen problems it might cause. Currently I won’t have time to implement a left-hand dock and block version, but I will next revision on the theme, later on this year. I suspect it might break a few things, as a lot of the inner-body content in Moodle uses css Floats and Clears, a lot of which I forced to clear on the left rather than on the right… so, yeah, there could be probs. Sorry bout that ; )
r

31 07 2010
Vicke

No worries, if it’s in CSS, I might play with it a little, I can make a copy, and it’s a local copy anyway. I’ll look forward to the next version
ta
Vicke

6 05 2011
Venzen

Rolley, First of all thanks for the great theme. It really stands out amongst the rest out there in terms of being calm and professional looking.

I would like to second Vicke’s request for the block regions to be optionally moved to the left. I poked around in the CSS and changed the div settings for region-pre & region-post to ‘float:left’ and inserted a ‘float:right’ for region-main, but, mon dieu, I just made a messy screen!

Any pointer would be appreciated and I would then go about remedying any knock-on effects you mention above.

13 05 2011
Rolley

GDay Venzen,
Thanks so much hey : ) I appreciate the comments.
I’m so flat out at the moment all I have time for is to fix a few little bugs, to move all the blocks to the left though you could change the float properties from ‘right’ to ‘left’ in the page layouts part of creatif.css. region-pre and region-post are the areas that float to the right. You may also need to fiddle with padding/margin if it knocks anything out. Sorry that I can’t set it up as an option, I don’t have time for a settings page or to make a different version of the theme : ) Hope you can get it going 🙂
Ta
R

30 07 2010
Craig Jefferies

Hey, I really like your design:
I notice you have use the MOZ rounded borders, that do not appear in IE. Have you consider better cross browser support.

30 07 2010
Rolley

GDay Craig, thanks for that ; )
Yep, a sad fact about the curved edges isn’t it. Unfortunately Microsoft’s browsers are non-standards compliant and the company keeps refusing to implement native curved borders. I’m not sure about IE9, but I know IE7 and IE8 still haven’t implemented the standards recommendations by W3C nor their own implementation (like mozilla and webkit borders).
So, for the moment, there won’t be any curved edges in my theme until IE picks up the CSS for it ; )
Sorry ; )
I know there’s most likely a fair few other IE issues, IE is the hardest browser to design anything for by a long shot, there were padding and margin problems that I couldn’t figure out how to fix at all, hopefully with my next revision of the theme I’ll have more time for it ; )
Cheers
r

18 08 2010
greg

Hi,

I’m pretty new to Moodle, and I’ve been looking for mobile-friendly Moodle themes. Creatif appears that way, at least in the images.

Is it mobile friendly?
Do you know of other Moodle themes which are as well?

Thanks for your patience & attention!

Best,
gz

19 08 2010
Rolley

Funnily-enough I did next to nothing to make the theme mobile-friendly, I was surprised to find that Moodle in general was quite mobile friendly already. The best thing to do will be to go through all the themes with your devices to double check which ones have any major issues/work the best.

I saw some test pilot ‘somewhere’ online (probably linked from the moodle.org site) that showed a really interesting project for making a mobile-specific interface/theme for moodle. It looked really decent, wish I could remember the link but if you have a look around the net you’re sure to find something ; )

24 08 2010
Glenn

Hi Rolley,

I really like your theme. Congrats.

What I would like to be able to do is make it a two column theme. I move all the boxes into one column but the main region didn’t expand to fill the empty space. Is this an easy fix and will it be an option in the next version?

Due you have a loose date for the release of the next version?

Thanks

26 08 2010
Rolley

Thanks Glenn ; )

I’m thinking I’ll want to wait a little while after the proper release of Moodle 2 before I even look at editing the theme again; maybe towards the end of the year I’ll have another crack at it I reckon!

But, in the meantime, you can do some simple edits to force the theme to be 2 column. It’s strange that the content region didn’t snap over to consume the column that you moved boxes from. Did you have the ajax settings enabled with the drag and drop stuff, because I think that’s the ‘only’ thing I never tested – otherwise it should have worked (it works if you dock every box from a column anyway!). Oh, and what browser are you using, just for interest’s sake?

Have you been in to a course, rather than just the front page, did the course page display in two column? I set the defaults in the config file so that the course pages should be two column, and the front page and dashboard are the only 3 column areas. If you open up config.php, you’ll see the ‘regions’ setting for each of the moodle pages in the layouts array (starting line 91). Most regions are set to just ‘side-post’ (which is one column for boxes); but you’ll see some that are set to both side-post and side-pre – just remove the ,’side-pre’ from those if you’d just like it to be a two column layout.

Hopefully you can tweak it to work, feel free to ask questions though!

R

31 10 2010
Glomeor

Hi R,

I’m building a new moodle for the school where I work and I like your theme. I would like to make it the default and are really looking forward for your next version. The actual seems to be a little buggy but is so beautiful and clear.

Glomeor

31 10 2010
Rolley

Thanks Glomeor,
Sorry about the bugs, you’re right of course – I did the theme in the pre-release moodle2… so there’s got to be a small pile of nasty display issues in the latest version no doubt. I haven’t had a chance to reinstall and update yet, will get back on the job soon ; )
Thanks though!
R

31 10 2010
Glomeor

That sounds nice. If it is of any help I could list the “nasty display issues” for you.

Greetings
Glomeor

1 11 2010
Rolley

That’d be great! List away and I’ll definitely get them fixed!
; )
Thanks for that

16 11 2010
Mu He

Hi Rolley,

I develped a Moodle 2 Demonstration site with your creatif theme, and I love it so much! However, yesterday I upgraded to RC2, and everything was ruined. I hope you would help me to get things back to the track, because I need to show that site to my professor in one week. Thanks in advance!

16 11 2010
Rolley

Hey Jason,
i just tried and the theme still works on the latest version on my end, with the exception of a few tiny margin/padding things.
go in to your admin theme selector, change themes, and then change back, did that help?
or, go to theme settings and just check if theme developer mode is turned on or not, try changing that setting and see if it clears the cache in case theres some problem there… um.. yeah not sure what else you can do.
chuck me a screenshot if you like once you’ve fiddled with the above.
r

23 11 2010
Reuben

Great work Rolley, I’ve been enjoying your theme a lot!
Here is a couple of little things I’ve notice in Moodle 2.0 RC2 –
The Quiz results page has no background.
The forums need some kind of color in the heading to distinguish posts.
Just thought I’d mention for when you create the next version. Great work though, it is a very nice theme 🙂
Thanks
Reuben

23 11 2010
Rolley

Thanks Reuben!
and thanks for letting me know about those problems in RC2. I’ll have a look at my install and try to fix those issues this week, and I’ll comment here when the fix is ready for downloading again : )
ta!
R

24 11 2010
Reuben

Cool thanks, also, I actually realized it is not just the quiz but the grades page, and I guess anything related. So if you just click grades in the menu you will see what I mean. Best of luck 🙂

30 11 2010
Rolley

GDay Reuben,

I think it’s all fixed now. The reports area seems to have been completely overlooked by the moodle 2 team. It uses a totally different html and css structure, and ignores the theme layout file. So, I’ve patched it up with some CSS.

Let me know how it goes. Replace your existing ‘creatif’ directory with a fresh downloaded copy; clear your moodle theme cache and see how you go. If it won’t refresh try enabling theme designer mode then disabling it.. sometimes that clears the cache out nicely.

30 11 2010
Angel

I have the stable version of Moodle 2.0 but i do not see the theme like the picture. Before the update i do, but after update to the stable version the theme has losen blocks, anybody else has the same problem?

30 11 2010
Rolley

Hey Angel, Ah I just noticed that the stable build has been released, there must be more changes that effect the theme in a bad way!
So, keep checking back and I’ll post a reply when I’ve updated the theme source files ; )
R

30 11 2010
Rolley

GDay Angel,

I’ve just updated the theme download. So, try again and see how you go.

Delete your ‘creatif’ directory in the themes area, replace with a fresh download. You might need to do a couple of extra things if it won’t refresh:

  • maybe clear theme cache (in the theme selector admin area)
  • maybe enable then disable the theme designer mode (theme settings admin area)
  • and make sure you click “use for modern browsers” and not “old browsers” when you select the theme.

Since today’s updates, on the latest Moodle build, I haven’t seen any problems with the columns, so, it should be right I reckon.

Ta
r

30 11 2010
Angel

ohh man you are the best… look my english is vary bad due is not my native language so i can´t expose how i feel now…. i downloaded the updated theme… and i did all what you said… the solution was enable then disable the theme designer mode… Thanks you so much… and im sure your theme is the best believe me… i follow you on the web man… keep you in that way. Bye. Xiao.

1 12 2010
Glomeor

Hi R,

very nice. Thank you for the constant updates.

Greetings T

3 12 2010
Rolley

Just incase you’re interested, anyone who’s subscribing to comment-updates on this moodle theme post; i just uploaded a NEW theme, Université .. have a gawk at the latest post ay : )
have a nice weekend!

12 12 2010
Jim

A very unique theme in appearance. Stimulating a unique feel of what could be inside this website (I better find out).

However, I have problem installing this theme on MOODLE 2.0+. I presume that is becos CREATIF does not follow basic Moodle Theme installation (Maybe that is conventional to <2.0).

Can U provide step by step guide of how to install this unique theme

I will appreciate any help.

21 12 2010
Richard

Fix for IE – cut off top of side block in Internet Explorer

If the first block on the side is missing the first 11 pixels in IE, here a fix:

In the file themes/creatif/styles/creatif.css, look for “div#region-post” and the line:
[OLD] margin:-11px 22px 0px 0px !important;

I’ve rarely had consistent cross-browser results with negative values. You can change this to:
[NEW] margin:0px 22px 0px 0px !important;

The result will be IE will display the top side box without slicing off the top 11 pixels.

However, all the other browsers will now display the box 11 pixels below the content region. To make all the browsers display the blocks the same alignment, edit the file themes/creatif/styles/blocksAndDock.css:

[OLD] .block {margin:11px 0px 0px 0px;width:200px;}

[NEW] .block {margin:0px 0px 11px 0px;width:200px;}

Instead of placing an 11px margin at the top of each block, the margin is placed at the bottom of each block. This is a little cleaner than the -11px adjustment to remove the margin of the first block.

Note: This fix could impact the new docking features, so be sure to test early and often.

Thank you Rolley for your beautiful and well crafted theme. The famfam icon integration is wonderful.

6 01 2011
Rolley

Thanks Richard, I thought I fixed that little sneaky one earlier, but I think I’m thinking of the latest theme I did instead, so thanks for reminding me! I’ll do that!
r

6 01 2011
Rolley

Actually, I remember now, I did fix it (so I thought) but I added different css with the file iefixes.css. The css gives new settings for any page with the class “ie” in the body.
I might have got it wrong though, is “ie” the right class to use? My VMWare testing leaves much to be desired clearly haha. : )
I’ll go over it again anyway, so thanks for that.

23 12 2010
Lyka

hi?could you instruct me how to change the background image?im have try replacing the 10 bgimage that you have put in here but still it doesnt work,

hoping for your response,

Thank you,

6 01 2011
Rolley

Hey Lyka,
Did you see the stuff I wrote in the config.php file, I typed up a bit on updating various parts of the moodle theme.
You’ll find a photoshop file in the pix directory, and it’s basically the source file for creating your own background images.
There’s layers and layer masks and so on so you’ll need to be familiar with photoshop to do it well : )
Hope that helps,
R

24 12 2010
U Asar

Hi,
Lovely theme, better than many I have seen around. Thanks for providing customization options, can you as well tell me how would I edit the login_info, as on mine its showing My Hosting Provider links and script installer links on top and bottom.

Bundle of thanks!

6 01 2011
Rolley

Hrmm hey Asar, I just emailed you back but I was just wondering if there’s any settings in the administration area that can turn that stuff off?

22 01 2011
lourdes

Hi!!
sorry for my writing, my English is terrible 😦
I love your theme, in fact .. I am trying in my local moodle (new version 2.0), but… i have one problem… do not show the files that I upload to the resource “folder”

Can you help me please!!

Thanks!

25 01 2011
Rolley

Thanks so much lourdes ; )

Let me think for a sec. hhhmmm….

so, are you adding files through the administrative interface, like the administration block or admin files area in moodle? if so there might just be a little prob with your setup, perhaps the file permissions on some of the directories or files is wrong; but i’m not sure. I’ve had problems with Files in moodle 2 as well, and being pretty hopeless at system administration i don’t really know how to solve the issues.

Sorry : )

Hope you can figure it out soon though!

26 01 2011
Beat Ziörjen

Hi first, this theme is relly cool! I lieked it from the
start. I would like to change the size and distanse from the
headding of the “course categorie” and the “course” on the front
page. How do I do this? Thanks for the feedback

30 01 2011
Rolley

Thanks Beat!
Glad you like it. Sounds like you might need to edit the CSS that comes with the theme to do what you want, assuming there’s no glitch anyway, … Did you want to send me a screen shot? rolley dot tickner at gmail dot com
; )

8 02 2011
LMS

Nice Moodle theme. Thanks for sharing.

21 02 2011
vinuthan

hai,
I have installed the theme, but it worked for two days fine…
but now I am unable to… open the menus
please do the neeful

1 03 2011
Rolley

Which menu’s you having probs with Vinuthan? Do you mean the Menu feature, or do you mean you can’t click on some of the menu items in the blocks or?
I can’t think of any reason for an error like this; although, when I was testing I did totally screw the Menu feature up somehow, and found it a little temperamental. Try and get rid of your Menu stuff, then redo it. That’s what I did when I had trouble with that Moodle feature.
R

5 03 2011
Juraj@Slovakia

I tried fresh actual Moodle installation + fresh download of this theme, but it does not show up in Theme Selector. I already tried clearing cache, turn on & off theme designer mode, but it still does not show up. How to fix this please?

24 03 2011
Rolley

Sorry Juraj, I wish I could help but I can’t think why it isn’t working for you. I hope you manage to get it up and running soon, hopefully it is something simple?

18 04 2011
Juraj Mazák

Solved, new Moodle build helped.

Different problem:
If I try to edit test and I want to add questions from question bank, the SHOW button (clickable blue text) for previously hidden question bank (at the top of page) is not clickable – it is possible to get there e. g. with TAB key on keyboard, but it is not acceptable :). It seems like something from later elements goes ‘over’ that, because during slow page loading it IS clickable (and it is always possible to get there with keyboard). Same text with function to HIDE is always clickable (when question bank is visible). Is my explanation understoodable?

Browsers tried: Opera, Firefox4, Chrome.

13 05 2011
Rolley

Hey Juraj!
Sorry for the delay in my reply;
I’ll look in to that problem, it’ll be easily fixed hopefully with z-index in the css. I’ll have to recreate the problem at my end first though. Once I’ve fixed it I’ll repost here with an updated ZIP.
Cheers!
R

13 05 2011
Rolley

GDay Juraj,

I’ve removed all my css for the quiz page, it was pretty useless css anyway, so now the problem you’ve described is fixed.
I really wanted to improve the look of that page at the time I made the theme, and I had a half hearted go I suppose. I see now that the code of the quiz engine is so messy and the look is so old that its probably best not to bother skinning it with new css until the source code gets revamped in that part.

So, download the zip file again as it should be refreshed with a new copy,
replace your files with the new ZIp and you should be good az gold ay
tarah
r

8 03 2011
AndrewE

Hi,

First of all thank you for making this resource available in the public domain. It’s an excellent piece of work.

I am particularly interested in the update you mention regarding specific background images for specific course pages.

Do you have any idea when that feature might become available?

I hope to hear from you soon.

Many thanks indeed,

Andrew.

24 03 2011
Rolley

GDay Andrew,
Thanks ay, glad you like it!
I never ended up implementing it, I did get something similar working on a different version of my ‘université’ theme, but the way course files works in Moodle 2 has been changed to be much more secure and complicated. I can’t figure it out anymore as it works wayyyyyyy differently. Sorry! : )
R

14 03 2011
Rick

I like the theme but there are some padding issues. It cuts off the top of the word, “Navigation” on the block where it bumps up against the header. Is there a way to adjust the top padding?

r

24 03 2011
Rolley

Hey Rick
Bugga, I remember something in the css about the padding of the top-most block; I wonder if there needs to be some adjustments; what version of Moodle 2 do you have? I haven’t even tested any of the themes I’ve made in the latest version yet (eek).
Ta
R

7 04 2011
Jose

Hello, yours it’s an awesome theme, in fact one of the best I’ve seen for moodle; however I can’t figure how to get the language menu. Could you help me with this? Best regards,

Jose Cardenas

18 04 2011
Rolley

Hey Jose thanks so much, I’m glad you like it. Did you find the lang menu stuff? I thought it was there by default!? ha, mustn’t be! There might be a setting in the config.php file? Did you do a quick search on the moodle docs site or google? I don’t think the lang settings are a theme related thing, I think they’re more a setting of the moodle administration, but I could be wrong, I’m not sure sorry : ) Let me know if you never got it working and I’ll take a look.

18 04 2011
Juraj Mazák

Really thanks for that theme! Great is also included PSD file to add my own pictures. I used it to add aerial photos of school and town, seems great and users are proud to see that!

13 05 2011
Rolley

Glad you like it, thanks a ton!

19 04 2011
Richard Kassissieh

Thank you for posting this terrific theme. It is so clean, readable, and contemporary.

One question: a huge empty space is appearing between the first and second lines of main column text. I see it in both Firefox 3.6 and Chrome 10.0, though it’s larger in Firefox. I have been unable to debug the CSS that might be causing this. Can you assist?

Here’s a screen capture: http://inside.catlin.edu/creatif-moodle.png

Richard

13 05 2011
Rolley

Hey Richard!
Sorry for the delay in my reply;
I’ve seen this prob before, I’m positive I fixed it though..? Mind you, I haven’t updated the theme for some time and its possible you and I are running totally different moodle builds. Every time they update the build there seems to be something that gets weird in the theme : o
Ill double check it all at my end, and I’ve got a couple of other things to fix too, so I’ll repost with an updated ZIP and we’ll see how you go after that ; )
R

13 05 2011
Rolley

Woho, thanks for that, there was one sneaky css class i missed and now its fixed, I’m uploading the theme ZIP file again (the link will stay the same), so grab a new copy and replace your files with the new stuff ; )
Cheers
R

30 04 2011
Thomas

First of all – I like your work very much indeed, I think it’s one of the best themes/designs I have ever come across in moodle.

I’ve got one question/problem though: I’d like to change the background-color. the color is #333333 by default and I want to change that; but when I try to change some code in the creatif.css in the folder /styles it simply won’t do it.
When I look at the properties with the web developer toolbar in Firefox it tells me the following:

I marked the part which I don’t understand/can’t make sense of like this:
*************************************************
this is the part I don’t know where it comes from
*************************************************

body, html (line 250)
{
height: 100%;
background-color: #1b408d;
}

body (line 254)
{
background-image: url(“image.php?theme=creatif&image=landscapebg1&component=theme”);
font-family: Tahoma,Geneva,sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 12px;
line-height: normal;
font-size-adjust: none;
font-stretch: normal;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
background-color: #1b408d;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: left top;
background-clip: border-box;
background-origin: padding-box;
background-size: auto auto;
}
*************************************************
this is the part I don’t know where it comes from,
especially “null” – I haven’t got a clue where this comes from, since it’s nowhere stated in creatif.css in the folder /styles
??????
*************************************************
null
html, body (linie 93)
{
background-color: #333333;
background-image: url(“moodle2/theme/age.php?theme=creatif&image=landscapebg7&component=theme”);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: left top;
background-clip: border-box;
background-origin: padding-box;
background-size: auto auto;
}

I’d really appreciate your help.

Thank you very much indeed.

Best wishes,
Thomas

13 05 2011
Rolley

Hey Thomas!
Sorry for the delay in my reply;
Sorry for that tricky one too, as it turns out, THAT part of the css is actually in the php, which handles the randomisation for the background changes. I shoulda put it in the css in hindsight 🙂
Edit line 38 of standard.php : )
R

2 05 2011
Thomas

First of all, thank you very much for you excellent piece of work.
I’ve got one question though.
I’d like to change the background color from #333333 to some different colour, but I can’t really figure out where to do this.
I’ve tried the creatif.css and changed it there but somehow it sticks to #333333.

Any help would be very much appreciated.

Thomas

13 05 2011
Rolley

Thanks Thomas, glad you like it, I just got back to your last post, sorry for the delay.. i’ve beeen sooooooooooo busy!

5 06 2011
Ebelio Martinez Conde

Regards,
I am new to moodle 2. I appreciate the hard work that was done in the template. I want to know how I can do to make my course are displayed in three columns. I appreciate your answer because I do not see the option.

Cordially

6 06 2011
Rolley

GDay!
You can do it, but you’ll just need to change some php, fear not, its quite easy:

at line 101 of config.php, you’ll see the creation of an array called ‘course’ which basically sets a couple of settings for the course view;

change the one that says:
‘regions’ => array(‘side-post’),
to:
‘regions’ => array(‘side-post’,’side-pre’),

and then do the same in the array starting line 111, (incourse)… cuz i can’t remember off the top of my head which one to change (so just change both) ; )
Cheers!
R

20 06 2011
Making my moodle themes a little bit smarter « rolley

[…]  Once I get it working really nicely I’ll roll it out for Université and maybe Créatif too.  Its a small amount of effort which hopefully translates in to making the UI a little better […]

22 06 2011
Tegan

Firstly thank you very much for Creatif, it is exactly what I have been looking for!
I did run into a problem though, if I go into a forum/discuss.php the users comment appears below the navigation and settings tabs rather than next to it. I was wondering if you could you please point me in the right direction to fix this.

Thanking you in advance,
Tegan

1 07 2011
Rolley

GDay Tegan!
Thanks for that!
I’ve been trying to get mine to do what you’re describing and I can’t figure it out; what do you mean by the navigation and settings tabs? You don’t mean the Navigation and the Settings blocks do you? If so that’s really odd and there might be some dodgy content/html in one of the comments/posts thats throwing things out. What version of Moodle2 are you running too? I haven’t dev’d the theme for some time now and I think there’s been a few extra little releases…
Was it just one forum, post or comment that’s doing it, or does it do it for everything?
r

1 07 2011
Tegan

Hi Rolley,

Thanks for the reply, I’m currently running Moodle 2.0.3.
Sorry, I did mean the Navigation and the Settings blocks. The problem occurs for all forum posts in all forums.

Thanks,
Tegan

1 07 2011
Rolley

Emailing you! Send me some screenies if possible.

30 06 2011
Maarten

Hee Rolley,

Great theme. Subtle things like icons and gradients make this theme a lot better than every other them I ‘ve seen.

Rick posted on 14-03-2011 something about the missing 11 px at the top of the block Navigation in in Internet Explorer (8). I have the same problem. I don’t really like IE, but a lot of people are using it.
I know that you added a iefixes.css, but apparently there is still something wrong.
I use Moodle 2.0.3+

Can you please help me?

Maarten

1 07 2011
Rolley

GDay Maarten, thanks for bringing that one to me, I’ve now fixed that bug once and for all in both of my themes, BUT before I post an update there’s another problem I’m trying to get solved with another user; so once I can nail that, or if I can’t nail it any time very soon, then I’ll post an updated zip on the net : )

Talk soon
r

1 07 2011
Rolley

Actually, Maarten, you’re running the same version of moodle as Tegan (see previous comment) – do you see the same problem she seems to be getting.. where forum posts/comments show up further down the page under the side blocks??!!!
Cheers
R

1 07 2011
Rolley

Hey Maarten, try downloading the zip again, I just refreshed the copy on the server.. the problem should be fixed. ; )
r

6 07 2011
Maarten

Thanks Rolley! It’s looking good now. Can I vote for you or your theme or something?

7 07 2011
Rolley

Hey Thanks Maarten!!! That’s a lovely offer ; ) The theme comp was at the start of the year though I think, so no voting or anything like that anymore hehe : ) If only!!! haha : D
Cheers!
R

4 07 2011
bonkhi

Hey Rolley,

Please correct me if I am wrong. I just took another look at the theme. The newly uploaded logo replaces yours, which is at the bottom of the page.

How can I make the logo appear at the top? Can you please point me to the right direction?

bonkhi

6 07 2011
Rolley

GDay Bonkhi,

That’s right, I made the logo be at the bottom on purpose.. originally I designed it with school and universities in mind, where marking isn’t really (or arguably ‘shouldn’t’ be) as prominent – the course content is more important.. so I popped it at the bottom.

However, there’s nothing stopping you from putting it at the top, do you know CSS and HTML/PHP? You can edit the theme layout files and the css, and put the logo container at the top and give it new positioning settings in the css. ; )

R

8 07 2011
bonkhi

Hey Rolley,

Thanks a bunch for everything. I looked at the layout and the creatif.css file. I could find my way around it (am okay with html and a bit of php) despite not knowing much about CSS.

I have reposition the logo, as well as made a few changed to the size of the header section.

Thanks a bunch………….

13 07 2011
Maarten

Hi Rolley,

Here Maarten again.

I have a problem with my progress bar. I hope you can help me.

I made a screenshot: http://imageshack.us/photo/my-images/197/progressbar.jpg

As you can see it is kind of hard to see the progress bar. Do you know how I can change the look of the (course) progress bar? Which files do I have to change?

Thanks in advance,

Maarten

18 07 2011
Rolley

Hey Maarten!
I’m not sure how to get the progress bar to show up on my moodle install – I wanna see it so I can have a better look at what it is, how its made and so on.. How do I get it to show up in a course?
Talk soon!
R

20 07 2011
Maarten

Hey Rolley,

We found a solution. You can edit the css in mod/lesson/styles.css.

You can enable the Progess Bar if you edit a lesson by clicking on the pencil, look under Flow control and then there Progress Bar. http://imageshack.us/photo/my-images/233/progressbar.jpg

Greetz,

Maarten en JW

21 07 2011
JW and Maarten

Hey Rolley,

We have another problem with this (lesson) progress bar. In the standard theme – if you have for example 6 questions or steps – the progress bar takes 6 equivalent steps.

In your theme, the progress bar takes a couple little steps but at the end a big one which fills the complete progress bar.

Do you know how this comes?

Greetz,

JW en Maarten

*To be clear, we mean the progress bar that shows the approximate percentage of completion.

25 07 2011
Rolley

Thanks so much for finding that sneaky problem, I’ve fixed it I think, in both of my themes, and have just uploaded the whole zip of the theme again : )

Grab a new copy and let me know if it works at your end!! : D

Cheers!
R

26 07 2011
JW & Maarten

Yes, it works just perfect now!
Thanks for the quick reply.

JW & Maarten

26 07 2011
Rolley

No worries! Glad it works well ; )

R

2 08 2011
Gary Burton

Hi,
I have found a few glitches when using IE that I was hoping that you would be able to help me with.
When the page is not maximised the content in the main area is pushed down the page do there is a large white space between the header and the content. I tried to fix this by changing the position of the page to absolute in the iefixes style sheet. It did fix this issue but it created another one in that a page in social format always appears with a large space between the header and the content…. any ideas?
My other glitch is that the pictures in pix_core appear a few pixels below the text that relates to it rather than at the side of it. I am unsure where to look to resolve this issue so any help would be great.
I dont see these glitches using any browser other that IE, ive tried it on IE 7, 8 and 9 and see it in all 3.

P.S great theme, its the best one I have seen for moodle 2 by far.

Thanks
Gary

3 08 2011
Gary Burton

I have resolved the above issues, by changing the position to relative and the co-ordinates of the icons that are used.
The only bug i have remaining is the same issue as Tegan, though it only shows up in IE.

4 08 2011
Rolley

Hey Gary, good on ya!! sorry for the late reply, I only come on to moderate comments here and there in batches : D even know I’ve had this box open for 2 hours while trying to come back and keep writing haha 😀
Glad you fixed the icons.. not sure whats happening with the big gap though, but I’ll try and replicate that on my moodle instance, to see if i can find out what CSS needs to be written to fix it. I’m sure I haven’t noticed the old big gap problem for a while though; you did download the theme file recently didn’t ya (and not ages ago?) .. I know i had some problems with that popping up earlier and thought I’d fixed them, there’s always one sneaky thing though isn’t there.. hrmm..
Comment back with some screenshot links, and in the meantime I’ll get VM going on my server and run some IE tests to see if I can find out where the problem might be ; )
Cheers
R

4 08 2011
Gary Burton

Thanks for the reply. I downloaded the package about 2 weeks ago that I have been editing, I downloaded it again yesterday just to check and its the same. I have uploaded some screen shots here:

http://imageshack.us/photo/my-images/585/20465844.png/
http://imageshack.us/photo/my-images/820/69136936.png/
http://imageshack.us/photo/my-images/35/79107841.png/

I have been looking at line 66 in the courseviews.css to try and fix it. I tried putting position:absolute; top:0; in which did move the content to the top of the page, but then all of the replies to the discussions were also at top 0 so everything was on top of itself… so that didnt work. Hope you can help!

Gary

22 08 2011
Rolley

Hey Gary!
I’m still having problems duplicating the problem in your screenshots.. its simply just not doing it. I have one last idea. When did you download and install moodle? You might have a newer version than what I’m running on my server; often each version release the code is different and it usually screws something up in my themes… so, that’s my last thought I suppose. If you’re running a newer version than the original 2.0 stable release then I might have to upgrade my install, then try and sort all the probs out 😮

16 08 2011
Gary Burton

Hi Rolley. Did you have any luck with my issue?

Thanks
Gary

17 08 2011
Richard Kassissieh

Sorry, actually the latest file I see in the directory is 24 July 2011. Is that the latest?

22 08 2011
Gary Burton

Hi Rolley, thanks for looking at the bug! I think that might be the case, as I am using moodle 2.1. the latest stable package. I have been trying to keep up the most recent version on my server so that I am up to date for when the school year starts. Which area of code is it that you think that the discuss layout bug could be present?

9 09 2011
Gary Burton

Hi Rolley, did you have any luck recreating the discussing forum topics bug I am seeing? I am not sure where to look in the code for where the issue is occuring, where was it that you made changes for when Teegan was seeing it?
I am currently live in school with moodle 2 using your theme if you want to check it out. https://moodle.lodeheath.org.uk

12 10 2011
Rolley

Hey Gary

I just installed Moodle 2.1+ stable release.. and I’m testing the Créatif theme now using IE8 in a VM on my mac. I can’t find any problems at all, anywhere! No big gap problems like you’ve described in the discussion forum.. what version of IE in particular are you using? I don’t have a VM with IE9 set up yet, but I do have one with IE7 so I’ll look at that too.

I’m not sure what to do, or why you’d get the problem and I wouldn’t.. Let me know what IE version, and any other specific details which might help pin point the problem.

Ta

R

12 10 2011
Gary Burton

Hi Rolley

Agh! The gap on my site appears when you are replying to threads in the forum. I was hoping you would see it straight away after your upgrade. Im using windows server 2008 and IIS instead of apache… maybe that is the cause. I have IE9 on my machine but the rest of the school is on IE8. I can send you log on details to our learning platform if that would help?

Thanks
Gary

13 10 2011
Rolley

Hrmm ill report back when I get IE9 set up as a new VM (tomorra!)

R

12 10 2011
Gary Burton

I am only seeing the issue when I am using IE. It appears fine in chrome and safari. Shame the school are using IE.

14 10 2011
Rolley

Hey Gary I got bad news, I can’t duplicate that issue even when I’ve tested the site in Moodle 2.1 with my Windows 7 VM using IE9… My other IEs were also fine .. soooooo I’m totally not sure what the go is : /

You should grab the files again anyway, perhaps try the other theme I did too as I fixed a lot of M2.1 issues with it, Université – you can customise it to the colours of your school using JQuery’s theme roller and some find-replace trickery.

; ) I suppose it’ll all go crap again when Moodle 2.2 comes out haha.. crikey!

14 10 2011
Gary Burton

I will do, its half term here soon so I can spend some time editing moodle then without affecting anyone. Can you see the bug when you log on to my moodle with the log on details i sent you?

Thanks for looking. Hopefully Il find a way of sorting it during half term

17 10 2011
Rolley

Hey Gary!
I’ve tried to log in, I’d like to see it actually, but it reckons invalid username/password, even though I copied and pasted directly from your email! Not sure what the go is at all : s its weird.
R

17 10 2011
Gary Burton

Sorry its case sensitive and microsoft automatically put a capital letter at the begining of my typing. Its all lower case 🙂

28 10 2011
Wayne Sykes

I’m trying to download the theme, but I keep getting an error that the account is inactive. Where can I get the files? Thanks.

Wayne Sykes

31 10 2011
Rolley

Hey mate,
you’ll be able to download the theme in the next couple of days from Moodle.org, I have no where to store the files anymore, and I’ve just put it in moodle.org for review then official release : )

http://moodle.org/plugins/browse.php?list=category&id=3

R

30 10 2011
German Valero

Hi,
I tried to download your theme from the Moodle themes page, but it gave me a “account inactive” error.

3 11 2011
Rolley

Hmm weird, i just downloaded it fine. is this the page you went to?
http://moodle.org/plugins/view.php?plugin=theme_creatif

4 11 2011
German Valero

I just visited that page and now I got another error: “You do not have permission to view this plugin”

4 11 2011
Rolley

yeah, the buggers, they haven’t approved it yet, so it’s sitting there with the status “waiting approval”, after the moodle team look at it (i assume), they’ll approve it (I assume, again), and THEN FINALLY it’ll be up for download : )

sorry bout that hehe. hope you get it soon though!! 😀

16 11 2011
Michael K. Berg

Hello,

Awesome theme! I was wondering if you know of where one can change the “lightbulb” highlighting code for the theme? In the other standard themes I have tried the course highlighting section works fine, however with this theme the highlighting darkens the border of the topic and doesn’t actually highlight it nor does the icon change. I am running the latest build of Moodle 2.1 on a LAMP setup. Any help or insight would be greatly appreciated. I have worked with CSS some but I can’t seem to find what is overriding the normal highlighting effect.

23 11 2011
Rolley

GDay Michael!
Thanks!
I reckon you totally could go ahead and make a change of some kind to make it better for you; I’m not sure what you can do about the icon apart from finding a better replacement, and tracking down the right spot to put it – but, to change the CSS just open courseviews.css, and on line 15 you’ll see the classes that customise the highlighting that you’re talking about.
The system calls it “current”, so when you highlight a particular week or whatever (or I think doesn’t it highlight the active week by default?), it adds the .current class to that week/topic, and takes on the css from here. So if you’d like for example the background colour to change, just put in what you need there and it should be good as gold I think.
Or, actually, am I getting confused – have I neglected to skin the highlight week feature completely and getting it confused with the current week highlight code?
: D
haha.. let me know! I’ll look on my end as well but my server is down at the moment.
R

7 02 2012
Tegan Smith

Hi Rolley,

Not sure if anyone else has had this problem but I included a custom menu in my moodle (2.0.4) when I went to check the grades for a unit (moodle/grade/report/grader/index.php) I noticed the theme was not displaying correctly, it had white area at the bottom of the page and menu was being hidden a bit under page content. I added the following code to config.php line 157
// The pagelayout used for reports
‘report’ => array(
‘file’ => ‘standard.php’,
‘regions’ => array(‘side-post’),
‘defaultregion’ => ‘side-post’,
)
Seems to fix it.

Tegan

16 03 2012
Rolley

Thanks Tegan, I better chuck that in my copy then hey! thanks a ton!
R

16 03 2012
Gary Burton

I saw that in my copy too, thanks Tegan

19 03 2012
Belinda Caulfield

Hi Rolley, I have not received the photoshop file yet I think our security system may be blocking the external email with attachments. Please could you post a link here for us to download.

Thanks,

Belinda

20 03 2012
Rolley

Hey Belinda,
Sorry, I don’t have anywhere to host the file anymore, so I need to send it to you somewhere/somehow.
My email did get bounced back by a spam/security filter it seems.. i did just send another test one.. without the attachment to see if it can reach you at all..
Let me know if it does or doesn’t get to you again – and maybe tell me another email address of yours (like gmail or something) in a comment and i won’t approve the comment so that it’s not published to the world. Up to you ; )
R

12 04 2012
gburton85

Hi Rolley
I was hoping you would be able to point me in the right direction, I would like to edit the rollover pop up that comes up when you look at the calendar to change the font size. But I cant find where it is to edit it! I am not sure whether this attribute is in the theme or in the calendar block but I can find any code relating to that pop up. Do you have any idea where it is?
Thanks for your help.

Have you looked at dropbox for hosting your files? Its prety good, you can create public folders in there and put all your files in there and then just give out url for where the file is stored.

29 05 2012
Rolley

GDay Gary!
I think I know what you mean, its the ummmm tooltip like thing that appears when you roll over an event on the calendar right?
It’s probably going to be in the calendar block and/or somewhere else because moodle uses the YUI stuff for that functionality. Some YUI stuff is easy to override with CSS though in the theme, so you could add some css to the theme if you know the right class names to target. Sometimes overriding YUI css in moodle is a real pain in the arse though, as the YUI stuff gets loaded after the theme stuff (i think?) and can be impossible to override. sigh! I tried it with something, can’t remember what though, man it was annoying. The main menus I think.
So, in your browser do you have a code inspector? if you’re using safari enable the developer toolbar, or if you’re in firefox get firebug, then right click on that popup that you wanna find out the css for, and click inspect element. That’ll then show you basically the code and the css for that area, which you can explore and stuff, then all you need to do is copy the css styles in to the theme css and change the font size.
Send me stuff if you want some help, i don’t have much time cuz work is crazy but yeah send me stuff and ill see if i can help.
I was thinking of drop box… hmmm.. but i ended up hosting the themes on the actual moodle.org site : ) which i suppose makes more sense anyway, maybe : )haha
ta
r

29 05 2012
Gary Burton

Thanks
Im trying it now using firebug, I have found the attribute that I want to change

I want to change the style=”left” bit to a different position on the screen so it doesnt hide the calendar when the popup appears. At the moment I have only figured out how to change it for individual dates rather than every time the pop up appears… im working on it though!

31 05 2012
Gary Burton

Got it! If you put a position fixed in the eventmanager.css of the calendar yui it stops the popup from overlapping the calendar 🙂

13 04 2012
Heather

Hi Rolley, Please could you send me the photoshop file so that i can add my own images to the theme?

Also on IE7 when i click something within the dock it doesn’t display fully, is there any way this can be fixed?

Thanks
Heather

18 05 2012
nally

hello rolley, I like your theme, could you mail me the photoshop file ? I wish to insert some of local images of town here on background. thank you, kind regards nally

28 05 2012
Gary Burton

Hi
Has anyone tried creatif on moodle 2.2.3 yet? Im thinking of upgrading mine from 2.1
Gary

29 05 2012
Rolley

Hey Gary!
I had to make changes to the themes because moodle 2.2 did have some differences that broke a few things. but, i haven’t tested version 2.2.3 which only came out this month or so right? The version I’m running is probably 2.2.2 or plain old 2.2, I can’t remember what I downloaded but it’s definitely 2.2 at the very least.
So download the theme files to get an update, and try it on a separate install maybe on your local machine before you roll it out on the server : )
Let me know how you go.
I haven’t had and probably won’t have time to make updates for some time, my workload is just way too crazy unfortunately : (
But yeah, talk soon
Thanks!
R

29 05 2012
Marko Always-Online

I have it installed on 2.2.3 and works like a charm.

29 05 2012
Gary Burton

Nice! Il backup and then upgrade my version during the schools half term next week 🙂

18 07 2012
Lael

Hi Rolley – the latest version on Moodle.org (http://moodle.org/plugins/pluginversions.php?plugin=theme_creatif ) is stating October 2011 – is there a more recent version of Creatif than that?

Thanks!
Lael

29 08 2012
Rolley

GDay Lael : )
Nooooo I haven’t updated the theme since late last year, so that would be correct. I just noticed that the moodle themes stuff down again, I wonder how often that happens :s
🙂
r

25 07 2012
Nachous3

Hi Rolley, thanks for this charming theme… excuse me, but i’m so newbie in moodle themes, as i can see from “edition mode”, i can’t be able to move one block, for example, the calender, from the right side to the left one, in order to left the main content column in the center, the calendar to the left, and other stuff in the right side… con you tell how can i do that?

Thanks in advance 😉

29 08 2012
Rolley

GDay Nachous 😉 Sorry mate, I’m not sure what you’re trying to do, and, it’s probably too late now since it’s taken me sooooo lonnnnng to get back to comments (sorry about that). You won’t be able to move the blocks from left to right though, the theme files are written with the code in a location that either renders the blocks on the left, or right, or wherever the author has the code really – the css also controls a lot of the display.. so basically if you want to shift it, you’ll have to get stuck in to rewritting the code ; )
cheers!
R!

8 08 2013
Gary Burton

Im now using this theme on moodle 2.5, I had to make a few changes in the ie fixes files and adjust the position of the log on box to make it in the center of the page but apart from that the theme still seems to work well

15 08 2013
Rolley

Thanks Gary, just emailed ya 😉 good stuff!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




%d bloggers like this: