Features:
- Stylish custom Frontpage and Login with on/off toggle
- Google Fonts
- Marketing Spots in Footer
- Frontpage Alerts
- Custom Logo
and more.
Video:
Working on a few more issues before publishing it out on github.

Features:
and more.
Video:
Working on a few more issues before publishing it out on github.
Here is the github repository. I published what I have done so far.
Simple, Crisp and Cool!
Thanks Chris, This theme should replace more and clean on moodle as good example of simplicity.
as you mentioned "done so far" are you planning to expand the possibilities in future?
Moodle has just become Awesome to work with new themes evolving
Thank you for your kind words Usman!
Yes. I do plan to have the theme grow and "evolve" with each new Moodle release. I do like keeping the roots with the More and Clean themes. However ideally I'd like to make the 2 columns appear as a single page by sharing the same background. That would further simplify the appearance.
I am not a programmer so this was my first attempt at creating a theme. The tricky parts were the lib.php and getting the css elements to render properly in the css and stuff. I also had some struggles getting the custom home page to hide everything when logged out and then switch back to a normal Moodle homepage once logged in. Luckily there are great examples all over Moodle.org from those who are much more knowledgeable than I.
Chris, I am using evolve-D theme and like it very much. You say here that you plan to keep the theme current to new releases, yet I see that it is not yet rate for 3.0 or 3.1. Are you working on those upgrades? And if so, when do you thing they will be ready?
Thanks
It works fine for me in 3.1
Thanks, that's great to know.
Hello Daniel,
Our current focus is on the Pioneer theme also found here. We put a lot of customization and new features into that layout for our teachers and have moved away from Evolve-D because the design change was so significant.
Evolve-D is based off the More theme from Moodle 2.7.
I am holding off to see what changes are made with Moodle 3.2 before investing more time in this theme. I'd like to see the new default moodle theme and maybe incorporate the changes into Evolve-D. The main benefits of the Evolve-D are the custom dashboard and login screen. Hopefully with 3.2 I can build upon the new theme and enhance evolve-D.
Great work Chris.
But i have been having a slight issue. When a user enters an invaild username/password, the login page refreshes without displaying an error notification.
Please help with this.
Download: https://github.com/kennibc/moodle-theme_evolved
I added a few screenshots to my G+ account:
Here is the current list of features for evolve-D:
Video Overview of the new Frontpage and other features:
Hi Chris!
Fantastic theme, thank you very much!!! We want to use it in our site (http://electroaula.cat/elec/).
A couple of issues ... When I get into the site neither the upper tab with the links to my home, calendar, ... or the text written on the Frontpage TextBox appear. I have downloaded the last version available on github.
Do you know what could be the problem?
Thank you again!!!
You need to go to the "Frontpage Settings" tab under the theme settings and turn on "Custom Frontpage". Be sure to upload an image too as this image will be the full-screen image used for the frontpage. The custom icons only appear when you turn on the custom frontpage. Otherwise it is a normal moodle page frontpage.
Thank you Chris!
<html><title></title><meta http-equiv="refresh" content="0; url=http://mysitedomain.com/course/view.php?id=11" />
<body><span style="display:none">
<?php
echo $OUTPUT->main_content();
?>
</span>
</body></html>
I was hoping that the redirect would be instant, or at worst would be momentary and display a blank page (hence the "display:none" tag) but instead a bunch of content still appears. If I delete the php code including echo $OUTPUT->main_content(); then I get a bug error and the site won't load. Any suggestions on how to make a clean redirect that is either immediate or displays a blank page while the redirect is processing? Thanks.
Chris,
Nice work!
Please forgive me if these are really dumb questions.
Questions:
1. When I click the "Calendar" link under "My Dashboard" it shows Upcoming events and I would rather it show in month view format. How can I change that?
2. If I had text to the "General Alert" or "Snow Alert" I do not see that text on the frontpage.
Thanks again for a great Theme.
Karl
Hello Karl,
1. I am not sure why the calendar link on your dashboard shows upcoming events. Do you have a preference set somewhere? Evolve-D's calendar icon on the custom frontpage points to a month view.
2. I fixed the alerts not showing on the custom frontpage. I will get the fixes on github later today.
Thanks Chris,
I really like it!
New question. On some of your images for the login screen it shows a padlock on the login (name and password) box but on the shipping version it shows a yellow M on an orange background. Is there a way to change that to the lock?
Also how do you change the color of the login box (on the custom frontpage) to a white background (matching the marketing spots) rather than light yellow?
Karl
To change the icon you need to upload a new image file to the pix folder of the theme. This has to be done via FTP as I did not build it out into the admin panel.
Name the file avatar.png.
I have attached the one I use on my site. All these images are open source: http://www.elegantthemes.com/blog/freebie-of-the-week/beautiful-flat-icons-for-free
Be sure to clear cache and refresh.
To change the color of the login box you would utilize the "Custom CSS" feature and change the input color of the form. Use Chrome or Firefox and right click "Inspect Element" and determine which elements of the login form you want to change.
Hi Chris,
I'm having trouble changing that login box also. On inspecting element there doesn't seem to be a working id to associate with within the custom CSS. Can you help?
All custom CSS is located in the evolved/style/evolved.css sheet. See the styles labeled /*Frontpage Login*/.
Then you can change the css or see the classes used.
Thankyou! Found it! Cheers for the help.
Hi Chris, I'd like to use the avatar on the login page, but the lock doesn't appear. Do I need to do something to make it appear? It's in the pix folder inside the theme folder but doesn't show up on the login page. My site is at http://104.197.12.139 if you'd like to see. Thanks.
If you are forcing a user to login it uses the default moodle login page. Unfortunately you cannot use the custom login of the theme if you have this feature turned on in settings.
If you go to Site Admin > Security> and turn off "Force User Login" you will see the theme's login page.
We are in the same boat as you. We force users to login for security reasons. I could not get the same styling to work with the Moodle login form that is used when you force user login.
Hi,
Now this is all making sense, it's hard for me to grasp when I have never had any permission problems.
OK...have you tried deleting your browser cache? As this sounds to be more likely the cause of you seeing to old image instead of the new one.
At least you are nearly there, good job Richard was on hand to help you fix the permissions problem.
Cheers
Mary
Yes, Richard was a great help. I cleared the cache in Safari (Develop > Empty Caches) but still see the lock icon instead of the image I uploaded as avatar.png to /opt/bitnami/apps/moodle/htdocs/theme/evolved/pix. The same thing happens in other browsers on Mac and PC and even on my iPhone. Anyone interested in trying to replicate the issue?
If your site is live then I would be willing to test it out for you?
So if you can send me a link to your site that would be great!
Cheers
Mary
Hi,
Just wondering if you have verified that the image URL is the one you are wanting to use. Yes I know you replaced the old one on the server, but is that avatar.png new one? Have you put the URL for that avatar.png in your browser? If not how can you know the image is the not the lock?
Just a thought.
Mary
Hi Mary, good point. My site is at 104.154.236.160. Could you have a look and see if you see the lock? I've attached the image I uploaded as avatar.png to /opt/bitnami/apps/moodle/htdocs/theme/evolved/pix. I tried going to 104.154.236.160/opt/bitnami/apps/moodle/htdocs/theme/evolved/pix/avatar.png but got the message "The requested URL /opt/bitnami/apps/moodle/htdocs/theme/evolved/pix/avatar.png was not found on this server." Maybe I'm typing in the wrong path?
http://104.154.236.160/theme/evolved/pix/avatar.png
Is the correct URL so looks like you have been adding the wrong one all the time!!!
Here is the image...
Great! Thanks for showing me the correct URL. Why is the eagle not showing up in place of the lock icon on the login screen though?
I'm not sure but I suspect it is still a Moodle cache problem. Have you attempted to Purge all cache again? Might be an idea to do that so you can rule that out if nothing else?
The other alternative is change the way that image is added to the page. At the moment it is placed directly on the page in the evolved/layout/includes/fpcustom.php file here...
https://github.com/kennibc/moodle-theme_evolved/blob/master/layout/includes/fpcustom.php#L31
If you were to comment that line out by pre-fixing it using // like so...
// <img src="<?php echo $OUTPUT->pix_url('avatar', 'theme'); ?>" alt="Login" />
you could then set the image as a background-image in evolved/style/evolved.css using
.avatarlogin {
width: 100%;
margin: auto;
width: 65px;
border-radius: 100px;
height: 65px;
background: #000 url([[pix:theme|avatar]]) left top no-repeat;
position: relative;
bottom: -15px;
}
Might work better...
Hope that helps?
Mary
Thanks Mary. It was a caching problem. After I turned on theme designer mode, images started appearing as soon as I loaded them to the server.
Now I have a new question for you or Chris. Is it possible to remove the arrow bar at the top of courses and the line at the top of topics? I don't give my courses of topics names (long story) so I have no need for the lines under the names. The lines just add clutter in my case. Please see attached pic. Thanks.
Hi,
Glad to hear that you are slowly getting there with this theme.
I think the course title border is to do with this CSS...
https://github.com/kennibc/moodle-theme_evolved/blob/master/style/evolved.css#L612-L646
So I think to fix this you need to add the following into the Custom CSS section of EvolveD's settings page.
.course-title,
.course-title:after.
.course-title:before {
border: 0 none;
}
I hope that's right.
Cheers
Mary
Hi Mary, thanks for the suggestion. I tried adding the lines you suggested in both the Custom CSS section of EvolveD's settings page and directly in /theme/evolved/style/custom.css but unfortunately neither worked. However, your suggestion got me thinking, so I poked around in /theme/evolved/style/evolved.css and changed
.course-title:after, .course-title:before {
top: 100%;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
to
.course-title:after, .course-title:before {
top: 100%;
left: 50%;
border: 0 none;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
That worked; it eliminated both the bar (with the downward arrow) under the course title and the bar under the section/topic title. However, strangely it also caused the fonts I had selected in the EvolveD settings to stop working, and all the text on the site reverted to the standard font (Helvitica?). Any idea why that happened? Thanks.
I have just remembered a problem from years ago that may be something to do with what you are experiencing Albert.
Here is a link to the solutions.
I figured this one out. I had to clear the theme caches at Site administration > Appearance > Themes > Theme selector. That did the trick.
Chris,
I have been searching high and low for the setting causing calendars to show upcoming events rather than the month view and have found nothing. Is there a way to add "?view=month" to the link that is triggered when the Calendar under Dashboard is clicked?
Karl
My Dashboard and the blocks are moodle core and not adjusted via the theme. You'd have to hack the core block for calendar.
I have the same problem (calendar shows cpcoming events and I would rather it show month view). Is there a fix for this? Thanks.
I'm having the same issue as Karl. When I click "Go to Calendar" in the Upcoming Events block, I get a calendar in list view rather than monthly view. Worse, the little calendar that's supposed to be on the side is now at the bottom. Please see linked
Which version of Moodle and which version of the theme are you using?
I am having difficulty reproducing the issue.
Hi Chris, I am using Moodle version Moodle 2.9.2. I just installed the theme over the weekend, so I assume it's the latest version. Thanks.
Hi Chris, are you aware of a fix for this issue? I still get the calendar in "upcoming" view instead of "month" view when clicking "Go to calendar" in the Upcoming Events block (see attached images). Is it possible to link to /calendar/view.php?view=month rather than /calendar/view.php?view=upcoming? The month view is much more intuitive, and I'd like student to see it instead. Otherwise this theme is great! Thanks a lot.
Here's what I get
Here's what I'd like to get
Hi,
As far as I know this is not a theme problem, but the normal way that Moodle works. You can test this by switching to Clean theme and you'll see the same behaviour. The only way to view a calendar month is by clicking on the current month in calendar block itself.
Mary
Further to my last comment you could try altering that link in the 'calendar_upcoming block' itself.
by changing this hyperlink...
$this->content->footer = '<div class="gotocal"><a href="'.$CFG->wwwroot.
'/calendar/view.php?view=upcoming&course='.$courseshown.'">'.
get_string('gotocalendar', 'calendar').'</a>...</div>';
to this
view.php?view=month
Or better still clone that block and turn it into one that you can substitute instead of the upcoming block.
Just a thought.
Cheers
Mary
Thank you Mary. That's a great idea.
Let me know if it works as I did not test it!
Hi Chris,
Great theme - just what I've been looking for!
Is there any way to use different combinations of the google fonts? I would prefer to use just one font for body text and headings, for example I like the droid font (sans serif) and would prefer to use just this font.
Also I would like to experiment with text sizes however I haven't had the expected results when using firebug and additional custom css in the theme settings. Which classes would I need to change to simply change text sizes for main body text and headers?
Thanks
Mike
body { font-size: 14px; line-height: 1.4;}
h1 { font-size: 30px;}
h2 { font-size: 25px;}
h3 { font-size: 20px;}
h4 { font-size: 15px;}
h5 { font-size: 10px;}
These are just the basics and are universal.
Mary
Thanks Mary,
I've had success using the additional css settings for other themes but I am getting unexpected results using the evolve-d theme. For example
This works (or at least it makes most of the text larger):
.dir-ltr, .mdl-left, .dir-rtl .mdl-right {
font-size:15px;
}
but this does not:
.body {
font-size: 15px;
}
Using other themes including clean I can get the additional css box to work fine but not in this theme for some reason. Basically I just want to make text slightly bigger to make it easier to read. One of the things I love about the shoehorn theme is the text size and I would would like to emulate that kind of accessibility.
Mike
You could edit the layouts/includes/fonts.php file to change up the fonts. You would also need to look at lib.php around line 119. Also on settings.php look around line 43 as well.
You would need to make changes in all the files to change the fonts up. Or use Mary's suggestion to change the sizes.
Brilliant! Thanks Chris - Exactly the info I needed.
I really like this theme
I just submitted the evolve-D theme to the plugin repository. Hopefully this will make it easier to download and install once it is approved.
Hi Chris,
We like your theme and the staff are interested in using it from the start of our next accademic year.
However, I have noticed that when using the theme in Firefox, during login with HTTPS you get the following error:
"Although this page is encrypted, the information you have entered is to be sent over an unencrypted connection and could easily be read by a third party.
Are you sure you want to continue sending this information?"
Changing back to the More theme or Clean you don't get this error.
I am using Firefox 31.0
Hello Andrew,
Apparently I fixed it on our live site and not the dev site. I uploaded the fix to github. There were two files that use the custom login form. It was in the form where it generated the URL to submit the login details. It would use the non-SSL URL. I fixed it and uploaded the new files. Should work fine now.
We run SSL for logins too and I missed this update for github.
https://github.com/kennibc/moodle-theme_evolved
See the layout folder and files login.php and /includes/fpcustom.php for changes to correct the issue.
And all was good in the world again =]
Many thanks for your quick response.
Hi,
I am a very basic Moodle Administrator. It took me 9 months to get permission to use it! Now that I'm here, I LOVE the Evolve-D theme (my personal site to play in uses "essential"). It's an easier, cleaner look for those who are overhwelmed by words and the internet.
I know that my question is so basic it hurts. IT's been so long since I set up a Moodle site that I've lost all my instructions.
I need to be able to put the first time user instructions on the log in page. Where are they?
Thank you,
Joan Medlen
Oregon Home Care Commission
HI,
I love this theme.
As someone who works with visual learners all day, you've got the right idea! Simple, fewer words, clear visuals.
The trouble I'm having is on the log in page.
I love the simplicity of it, but I can't get log in instructions to show. I am afraid to customize the langauge (I'm not a programmer - once this is up and running, I can design courses!).
The visual simplicity is a must for my target audience.
Can you help?!
I am sorry but I am not understanding what you mean by login instructions showing? It doesn't use the typical Moodle login page. You can put instructions inside one of the 3 adverts at the bottom but it doesn't take the normal instructions you can type in the Site admin panel.
This is something I could add in on the next update though. It would just be a simple text box that would line up to the side or below the login form.
After chatting on email I see your issue with the login.
This was an oversight on my part. All our users login via LDAP and have accounts. We never allow user creation or signup. So in my scenerio a custom login form is all that is needed since we do not allow account creation.
In the next release I will have this fixed so that the login page has the standard moodle login form which allows account creation and stuff.
Hi,
Have anyone tried this theme with moodle installed in a sub-directory, the login page does not seems to work.
Here is my setup: URL link to moodle is <url address>/moodle, when enter the username and password, it re-directed to <url address>/login/index.php, and give error, the correct url should be <url address>/moodle/login/index.php.
Has anyone have the same problem? Or how can I fix it?
Regards,
Timothy
In fpcustom.php the login form begins on line 28 with the <div class="wrap">
Find <form action="<?php echo new moodle_url('/login/index.php'); ?>" method="post" id="login" >
You can replace <?php echo new moodle_url('/login/index.php'); ?> and just put your moodle URL/login/index.php inside the two "".
In login.php find line 71 and you can do the same as above replacing: <form action="../login/index.php" method="post" id="login" >
Fill out your full URL for the form action. It just submits the login details to the standard Moodle login page.
I plan to release a much better login template for version 2 of this theme. We will use the standard Moodle login form but I will still have the full screen image and some unique styling to the form. That should help with these types of issues.
I designed the theme to meet our specific needs and server setup/environment. Learned some things with a wider audience using it that will be corrected soon.
Hi Chris,
Got it working now, thanks. One suggestion in your next version, is it possible to have the company logo in custom frontpage? If is possible, also able to text color of the footer text, because in some of the image, the footer texts are not visible.
Thanks.
I think I may be having this same problem. All worked well installing the theme, but once I selected to use the custom front page I now get the error "The requested URL /login/index.php was not found on this server" when I try to log in.
We did fix this by editing the fpcustom.php and login.php files to include MOODLE in the path (as you stated above) and it is now working. Thank you!
Just tying up loose ends with a migration from 1.9 to 2.7 at our site and chose to go all-out with the renovations and throw evolved into the mix for extra giggles:
Thanks for the awesome theme, especially for the sane coding!
Looks nice!
im a beginner, can you help me how to change the css of login box. plzzz: -)
The first step is to use Chrome and Right Click in the login box area and then select "Inspect Element" from the menu. Then you will be able to change the CSS right in your screen. The best way to learn is to jump in and begin tinkering.
I made some changes for the next release. Here are the fixes:
See attached image for new default moodle login page.
Download from GitHub. https://github.com/kennibc/moodle-theme_evolved
I may add a few more features before listing it on Moodle.org's plugin repository.
https://github.com/kennibc/moodle-theme_evolved
Hi @Chris:
I'm having a problem activating the marketing boxes. I filled in some content, but they just appear as blank (gray) boxes.
Any idea where I could check to see why?
On the marketing block page you can set the Background Color for the box.
I suspect you have the background color and font color set to the same.
Font color is set on the Theme Colors page while the background color for the marketing spots is set on the marketing block page.
hi Chris, first of all i love this themeits clean and simple but i need to replace some icons that are in englsih to spanish, i got already the translated icons so i need to know where i can change the via ftp ... i need only to overwrite them? ; i can send you the icons in spanish if you need
Look in the "pix" folder. Moodle > themes > evolved > pix.
On a future release I plan to make these customizable from the backend. Maybe in the 2.0 release.
Hi,
Very pleased for your theme, but We have some questions we need you to answer. We are using it in spanish, so we are trying to get it, but with some problems:
1) In main page, there are some icons (my home, calendar, courses, badges) and a text saying "Find and enroll in courses" and a "go" button. To change icons is easy, but, in what file is "Find and enroll in courses" , and "Go" button to change the language???
2) When you load the page, first appears a login windows (root), is it possible to hide this page, and only appearthe login page to moodle??.
Thanks in advance.
We have got to change the "Find and enroll..." and go button text.
We only need root login hide.
The file to change is in:
moodle root/theme/evolved/layout/includes/fpcustom_lgin.php
Line 50
<div style="display:inline;float:right;padding-right:10px;"><form action="<?php echo new moodle_url('/course/search.php'); ?>" method="get"><fieldset><strong>Find and Enroll in Courses:</strong><br><input type="text" size="10" name="search" value="" /><input type="submit" value="Go" /></fieldset></form></div>
It is a bit of a hack. I wasn't intending to share this theme outside of our school district. Best practice would have been to add this to the language file.
For a future update I plan to make the 4 buttons, search bar, and other elements on the homepage customizable. You would be able to turn on and off the search bar, buttons, and maybe even add your own buttons.
Possibly this summer as that is when I will have more time.
Thanks,
I had found what you say, but my question was why when you start, the first page it is shown is a login page saying user as root, and password that is remembered, you click on "log in" and then it appear the moodle login page. We need to get first page as moodle login page, and avoid the root login page.
How can we make this?
Javi, I think you have the browser set to remember your login. This is not part of the theme.
I work for a school district. I would like to have a random/changing background image (per session) to show different school views etc, any suggestions how this might be done?
Currently it only supports one image. Mary's suggestion is how I would most likely implement multiple backgrounds.
Hi Chris,
I love your theme! I had a few questions as I was trying to set up the theme (sorry if these are too basic!):
1) How do I remove the Moodle logo from the footer of the frontpage? Also, the footer on the course pages that says "Moodle Docs for this page" (I tried clicking on that link and it doesn't take me anywhere)?
2) Where can I change the rounded edges to sharp edges on the boxes on the pages?
3) How can I delete the My Badges, My Calendar on the home navigation bar? I may want to add other pieces but at a minimum would like to delete these as I am not using that functionality.
4) Where can I change the page width of the main body content?
5) Is there a way to change the course listing page that way the drop down arrows are always open vs. closed? I believe this is a moodle page vs. your theme but thought I would ask in case you knew how to do this.
Thanks very much!
Crystal
Hello Crystal,
Most of your questions are for things that can be done but require you to invest in changing the CSS styles. Using Chrome you can inspect HTML and CSS elements in the page to help you identify the styles you need to change to get the look you want. This is outside the capabilities of the backend of this theme.
1. Not quite sure how to remove the Moodle icon. However the Moodle doc links are in the admin settings and controlled from there. The moodle icon is part of the standard footer. This is not related to the theme.
2. To get square edges you would need to do some custom CSS to override the defaults. To do this is time consuming.
3. The file here: "moodle root/theme/evolved/layout/includes/fpcustom_lgin.php" is where you will find the code to add or delete the icons that show up on the custom frontpage.
4. To start changing widths you are also looking at hacking the layout files in the layout folder to change the spans or adding custom CSS. Again this is time consuming.
5. This is how Moodle displays the content.
What you want done is possible and most likely not hard to do at all. It is just time consuming. In fact, for some very similar reasons that is how this theme was born. I wanted to use the Moodle More theme but with a few added features. I added in those features and then started experimenting with other things that could be done to enhance the user experience. Hence the focus on the frontpage to get students logged in and to the content.
Thanks Chris!
For anyone's future reference:
1. To remove Moodle Logo from bottom of page: remove line /* echo $OUTPUT->home_link(); */ in the frontpage.php file
2. I created my own course listing page that shows the categories, course names, and course descriptions and linked it to the button called Courses on Chris' custom homepage.
Hello,
Is it possible to change the order of the navbar items? As in, when I add my own custom items it adds them to the start, would like the to go to the end after the predefined language menu, courses and dashboard?
yes it is possible to change the order
check amity mooc website
amity mooc website???
Sorry i can't seem to see any guidance in doing this on that website?
Thanks
hi.... certainly a very impressive theme, congrets. i have just downloaded and trying to configure it. the theme dosent loads any image i upload for logo or background in custom frontpage. i have tried jpg, png and gif without any luck also in diferent sizes but still dosnt shows up...... is there a way that i can manually upload the image to the directory rather than chosing it with builtin method and selecting from repository? i was able to use one of the image in evolved pix directory by changing the name of my image to an existing image...... maybe if you may guide me which directory stores images of logo and frontpage background and than i can manually put in the image there. please help....... ok also the front page dosnt shows the option of creating a new registration as i just noticed on a pic you have pasted here, instead the front page shows only login option, how do i have new registration option too on front page? sorry for loading you with problems here..... Best Regards and cheerz
You can certainly hack the theme to use a path to a file and not use the built in uploader. It should allow you to upload the files from the admin pages.
Also, there is a 2.8 version, but it is in beta. We haven't left 2.7 yet in my organization.
Find the 2.8 beta here: https://moodle.org/mod/forum/discuss.php?d=274859
Hi,
Just stopped to read this and see that you are having problems with uploading image files in a theme setting, like a logo or a background.
Can you please expand on this problem as it looks to me like it is not the theme, but rather your server security is set wrongly for your images.
Cheers
Mary
Thanks Mary. Yes it surely is not a theme issue now that i have changed many themes and still cant make moodle show up my img files...... interestingly i created a badge with a png file uploaded within moodle and it shows up correctly on every theme. its just that any other image for logo, or other image gets uploaded well, shows up when it is on small window for confirmin but than image disappers and just a small box remains. ill try to put in some pics to show the problem here
i uploaded the file but its shown as only a box and the same will happen when the main page loads.... the image will not show up. BTW the orignal logo image file shows up ok. its just that when i try to change it dosnt show
Please help me i just dont understand this. BTW i created another subdomain for testing, uploaded moodle 2.8 and same happens.... no img show up.
This is a folder permission issue on your server. It cannot be fixed through a web browser as you need to give moodle read/write access to the data folders. You might want to talk to the host or your web admin to fix permissions.
Does anyone know how to remove the separation bar between the main content of the page and footer? I'd like to do this throughout the site but i'm not seeing it referenced in the GUI of the theme settings or even in the html markup of the page when "inspecting element".
If it is just a single line, then it most probably a border, either of the bottom of the page-content or the top of page-footer.
If it is fix it with something like this...
For Example:
#page-footer { border-top: 0 none }
Cheers
Mary
Thanks I now see it in the css. I suppose i should have guessed that.
Thanks so much Mary!
Adam
Great suggestion Adam. Now that you mention it I don't quite like the line either. I will be sure to include this in a future update.
Now I have 2 login page after I applied the theme. Can anybody help me to delete one? Thanks in advanced!
Are you sure it is this theme, and not something else which you have added?
I am sure that I applied only this theme! it has login page from the theme and the original login page! Please show me how to close ones?
Do you have a screen shot? I haven't been able to reproduce this issue. Also, is this Moodle 2.8 or 2.7?
Hello, first of all your template is beautiful, I'm working and has done very well, but I have a question, I need to put a background to the footer of the site, I was refieron what corresponds to the credits of moodle and footer you can put custom, e been looking footer.html or function which can modify or CSS but I failed, I would greatly appreciate if you can help me with some advice on this.
thanks for your help.
#page-footer {
background-color: #d5d5d5;
border: 0px;
border-radius: 10px 10px 0px 0px;
}
Try adding the code above to the Custom CSS spot in the theme admin. This will put a solid box for the #Footer and rounded top corners so that it blends nicely with the rest of the areas on the page.
Hi Chris,
Great work & fantastic job!
Is there a way I can use the 1st design version of the login page? And/or how can I replace the grey-ish "login" with other words of with my logo?
Thanks
If you do not force users to login it will use the custom login css styling (the one seen in the photo). If you require users to login I have it default to use the Moodle login and try to style that.
The reason being is that if a user puts in the wrong password or gets an error the message is never displayed on the custom login page. It only gets displayed on the standard Moodle login. So I decided to utilize the defaults and style that with a decent looking box and be generic enough to work with any photo background.
All wording of the default moodle login page can be fixed by changing the language settings. It's as simple as modifying the words in the Site Admininistration > Language > Customize Language.
There are also items that can be changed on Site Admin > Plugins > Authentication > Manage Authentication. You can include instructions and what not.
Thanks for the reply.
I do force users to login - however I couldn't find out how to replace "login" word with pic (e.g. Logo).
You should be able to add an image and hide the text Using CSS
to add the background image you would use something like this...
background: url(url to image) left top no-repeat;
and to hide the text
visibility: hidden;
the only thing left to find out is the CSS selector id or class for the login for you to be able to target the login page and make those changes.
Chris ! Thank you very much !!!!
looks like to thank you very much favor, I present the site as this being thanks to your contribution http://redvolucion.co/zonae2/login/index.php
I can make you one last query more? as I could customize only the main toolbar you added to your template? is that I see that you have the default styles for all blocks of moodle and would like to style just the same without affecting others.
just finished this development I plan to do a blog post discussing the wonders of your template so that the community knows him thank you very much!
Luis Alberto Bravo caballero,
AMAZING WORK! I love your styling and what you did with the theme. As for the color of the top bar that is in the includes folder of the theme for the homepage. I think I used the same div style as standard blocks to make things simpler. It's hard coded in the page where you find the icons linked.
Hi Luis,
I like your customisation very much, but have you noticed if you type the wrong name or password the layout changes and the login container breaks up. This is because an extra line of text is added to warn the user that they have not entered their name or password correctly.
Mary
Hi, how do I remove the moodle credits on the footer of the page?
You could try adding this to the Custom CSS area in site admin. It will hide the page-footer:
#page-footer {display:none;}
In the "Marketing Spots" Multilingual-filter does not work. Could you suggest a solution?
Sorry, Multilang-Filter
The evolve-D theme contains special CSS styling that makes the Socialwall Course Format shine!
New Socialwall Course Format plugin set now listed:
https://moodle.org/plugins/browse.php?list=set&id=74
The Moodle Socialwall will transform your Moodle course into a social learning platform. This includes a familiar post interface, timeline of posts, filtering of the timeline, and integration with Moodle's activities and resources. A social learning format allows teachers to pick up the tool and begin using it right away.
I just updated the Evolve-D theme to version 1.0.4. This update includes some additional styling for blocks and the main content area. The changes are to enhance the visual appearance and provide a more refined look to the blocks and main content area.
Here are some screenshots:
I have a new version for Moodle 2.8 that fixes the gradebook issue where the gradebook would overlap the blocks on the right side. Please try this out on a test server and let me know if it helps. This moves the blocks to the left side for pages with reports/grades.
The new version can be downloaded here temporarily: http://iblog.dearbornschools.org/webmaster/wp-content/uploads/sites/3/2014/02/evolved_m28_2.0.1.zip
For the next version I am working on allowing custom icons for the frontpage. These are the main icons that appear at the very top of the page and help direct users to courses and content within Moodle.
You will be able to add in up to 8 custom icons with text links.
And here is what it looks like on the frontpage in the theme.
It looks very nice.
You could make the black triangle in the bottom border of the header a toggle switch that opens a hidden panel where blocks could be stashed like Aardvark Post-IT?
Are you planning on using the Sideways headers like I added in Morecandy? I think it would look good in evolve-D.
Cheers
Mary
Mary,
YES! I loved your blocks. They looked so cool. I downloaded your theme and began looking at how you implemented that. Very nice!
I like the idea of a hidden panel but I need to see a need for it and how it improves the user experience. I really like the User Dashboard and all the user data being implemented with Moodle 2.9. It might be nice to have a hidden menu like you described that when accessed in a course would display the user stats for that student from the course. Things like overall grade, assignment and quiz scores, and stuff like that right at the top of the coursepage.
Maybe we could collaborate on that for the 2.9 version?
I wouldn't have a clue on how to do this but I am a quick learner. We always run our Moodle site Current -1 so we will be updating to Moodle 2.8 come June. That is why I am only now getting some nice features into Moodle 2.8 because we are ramping up for the update.
Cool! Yes I would love to colaborate with you on a new theme for 2.9.
Cheers
Mary
We should kick around a few ideas and see what might be possible.
Will do thanks!
We have just installed Evolve -D and think it looks great! We are currently working on the icons on the front page so this new development is quite exciting. When are you hoping to release it? In the meantime is there a way to add/ remove the front page icons?
Thanks
Helena
Helena,
You can download the new version with custom icons from here:
http://iblog.dearbornschools.org/webmaster/wp-content/uploads/sites/3/2014/02/evolved_M28_8icons.zip
I am still looking over the code and making adjustments.
Hi Chris,
I am just wondering why my page looks different to the one you have in the image you have displayed in your comment here?
I dont see the black line nor the box shadow around the content.
Is this not in the lates version of evolve-D, or is it the fact you use a Mac or something I have missed off in the settings?
Confused...
Mary
I am working on the next version of EvolveD theme and there are two items of interest:
Check it out in this video.
Hi Chris,
i have install the evolce-D theme on my installtion, but i can't see the Dashboard and the settings for them.
Thanks in advance.
Kind regards
ob
Where are you looking for these settings pages?
Hi Mary,
i look at Website-Administration->Darstellung->Designs->evolve-D->Custom Menu.
BG
ob
OK...I see what you mean.
In that case you need to get the latest version of Evolve-D for Moodle 2.8
Hello Ob,
Sorry there was a mixup in code when I released the evolve-D version 2.0.0 for moodle 2.7 and it was fixed in version 2.0.1.
In Moodle 2.8 I removed the Dashboard drop down because Moodle built this into the top nav bar. I accidentally removed that code into the 2.7 version too. It was fixed in the latest version here:
https://moodle.org/plugins/pluginversions.php?plugin=theme_evolved
The 2.7 version will not see anymore feature updates unless they are to fix issues. The 2.8 and 2.9 versions are the ones I am currently focused on. Especially 2.8 as we will be updating our organization to version 2.8 in June.
Hey Chris,
We really like the way the frontpage is when you are not logged on, but we are hoping there would be a way to add a register button below the Log in button? It would be really cool, let me know.
Thanks,
Josh
Josh,
Go to Site Administration > Security > Site Policies and check the box for "Force Users to login". This will trigger the theme to use the default Moodle login page - BUT it will have some unique styling and still include the full screen background and marketing spots if you chose that option.
This will allow you have the built in Moodle login page, guest login button, and the instructions to create a new account.
If I add in the link to create an account for the custom login page and you do not have account creation turned on it will throw an error page.
If you want to add your own button to create an account you can do so. Open up Moodle Root / themes / evolved / layout / includes / fpcustom.php
This will add an orange button that will open the signup page for moodle.
<a class="btn btn-warning" href="login/signup.php?">Create an Account</a>
Find the <div class="wrap"> and it's closing tag </div> and delete all the content between the div's and add in the following:
<div class="avatarlogin">
<img src="<?php echo $OUTPUT->pix_url('avatar', 'theme'); ?>" alt="Login" />
</div>
<form action="<?php echo new moodle_url('/login/index.php'); ?>" method="post" id="login" >
<input type="text" name="username" placeholder="username" required>
<div class="bar">
<i></i>
</div>
<input type="password" name="password" placeholder="password" required>
<a href="<?php echo new moodle_url('/login/forgot_password.php'); ?>" class="forgot_link">forgot ?</a>
<button>Log In</button>
<br>
<a class="btn btn-warning" href="login/signup.php?">Create an Account</a>
</form>
Perfect, Thanks!
Hi Chris
Looking at your theme and liking it
but how can you 'customise' the custom menu at the top of the page, text colour etc?
I have looked in the evolved.css and change the css in there under navigation tabs but no joy
Gary
The custom icons use the same value as your Link Color set on the theme color page.
If you want to have a special <a> link color just for those icons you should isolate the CSS divs and set the a and a:hover colors.
Then you can just plop that special css into the very first page of theme settings called Custom CSS.
Luckily you can just copy and paste this in there as I have done this for you.
.navicon a { color: #8AD45F; }
.navicon a:hover { color: #70D6C3; }
Replace the color # with whatever setting you'd like.
Hey Gary,
I thought you meant these seen in the attachment. After more clarification I think you are referring to the very top banner that by default is inverted and a solid black. In that case you can change it by adding in your values to this CSS code and placing it in the CUSTOM CSS text entry box located on Site Administration > Appearance > Themes > evolve-D > General Settings
This should change the background color of the top bar.
.navbar-inverse .navbar-inner {
background-color: #CB1515;
background-image: -moz-linear-gradient(top, #CB1515, #7F1919);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#CB1515), to(#7F1919));
background-image: -webkit-linear-gradient(top, #CB1515, #7F1919);
background-image: -o-linear-gradient(top, #CB1515, #7F1919);
background-image: linear-gradient(to bottom, #CB1515, #7F1919);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CB1515', endColorstr='#7F1919', GradientType=0);
border-color: #252525;
}
To change the color of the text try this:
.dropdown-menu>li>a { color: #CB1515; }
.dropdown-menu>li>a:hover {background-color: #d7d7d7;}
This question would apply to any theme that uses the built in Moodle banner so there might be others that have a better answer. This isn't unique to the evolve-D theme.
Hi Chris
perfect
regards
Gary
Hi , great theme ! Thanks for sharing and technical support effort . I have a problem with it. Thema attempt to duplicate the same Moodle site and not shown . I renamed the carpteta to "emergency " and I searched the whole word " envolved " emergency and replaced all files ( php and css ) and not working. Any solution?
Sorry It´s the correct menssage:
Hi , great theme ! Thanks for sharing and technical support effort .
I have a problem with it. Attempt to duplicate the same theme in Moodle site and not shown .
I renamed the carpteta to "emergency " and I searched the whole word " envolved " emergency and replaced all files ( php and css ) and not works. Whath´s happened?
Any solution?