Moodle in English: Fordson V1.6.0 Discussion and Support Thread

Skip to main content

Themes

Fordson V1.6.0 Discussion and Support Thread

Fordson 1.6.0 introduces three new style presets: Corporate Learner, University Learner, and Dearborn Public Schools. I also wrote up some documentation for the theme and "recommended settings" for each individual preset so that you can get the best style results.

New Style Presets

Corporate Learner: Very simple, no background image preset. Most colors are tied to 2 settings: Brand Primary and Body Background Colour. Changing these two colors will drastically alter the look of the page. Designed to be distraction free with minimal color. This preset gives you all the features of Fordson with the simplicity of the Boost theme.

University Learner: This new preset is a beautiful full-screen design with a university in mind. You can get interesting results by adjusting the Header Image Height to minimize or make larger the header image. Minimal use of color makes customization a breeze. Pick the Brand Primary and away you go. Course activities are listed in a styled box that helps the student focus on tasks.

Dearborn Public Schools: This is our namesake preset that was going to be kept internal. We shared it anyways because I really like it. Custom Header Images are used only on the main course page. Once in an course activity the image is hidden and content is up at the very top of the page. This maximizes learning screen space without compromising style and personalized courses for teachers. It is recommended that you use the slideshow option for the homepage to add a visual element. This is also a full-width preset which also has unique styling for course topic headings, course activity lists, quizzes, and other elements. Smooth and stylish with minimal color.

Get the most out of Fordson. Check out the theme Documentation: View the documentation

If you have questions or issues with Fordson 1.6.0 or newer please post here. This is the discussion thread linked to the plugin page.

The screenshot is an example of the Dearborn Public Schools preset.

Average of ratings: Useful (3)

Permalink | Reply

In the Fordson 1.6.1 release we will be introducing a new feature that is just amazing and was first seen in the Moove theme. We absolutely love the way the Moove theme displays a progress bar for each topic when a course is set to show one topic per page.

We do a lot of training and this is a feature that allows a learner to quickly see what topics require their attention in a course. The Moove theme puts these topic sections into 2 columns where we do not with Fordson. With Fordson we keep it true to Boost core with a single column and only add in the progress display. We also show the number of activities in each topic as well as the count of completed activities.

I created a short video to showcase some of the new features coming in future 1.6.0 releases as well as the new presets. Our namesake Dearborn Public Schools preset will most likely become the default in a future release.

Watch the video:

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris, I cannot seem to display this completion indicator into the courses of my portal. I am using Moodle v3.4, I have enabled course completion and set criteria for my activity completion. Unfortunately, this excellent feature does not seem to appear in my Fordson theme with the default preset.

Average of ratings: -

Permalink | Show parent | Reply

Click the 3 gears in the upper left. A pop window will appear with the course completion.

Average of ratings: -

Permalink | Show parent | Reply

I mean the percentage bar that appears below each topic (with the 50% thing or so). That same thing you adopted from the Moove theme. I can't seem to show that.

Average of ratings: -

Permalink | Show parent | Reply

Do you have the course settings to only show one topic per page?

Average of ratings: -

Permalink | Show parent | Reply

I think I have that option. Which options should I activate Chris?

Average of ratings: -

Permalink | Show parent | Reply

Also, it only works with topic format. Weekly will not work.

Average of ratings: -

Permalink | Show parent | Reply

Thanks Chris, it's working with me now. However, is there any chance that this feature can be extended to weekly format? Our university is in this format.

Average of ratings: -

Permalink | Show parent | Reply

Edmund,

Possibly. I'll take a look today.

Average of ratings: -

Permalink | Show parent | Reply

Edmund,

Great news! I think I have it working for weekly topic format. I am going to do some testing and make sure it all works but seems to be just fine and it only took all of 15 minutes to figure out.

We just updated our main Moodle site to our Fordson theme and Moodle 3.5. Over the summer and into the fall we will be refining and fixing styling to make sure things look better in a variety of scenarios and setups.

Here's a quick screenshot of the weekly format with one topic per page.

Average of ratings: -

Permalink | Show parent | Reply

Wow that's awesome Chris. Please do it also with Moodle 3.4, I don't seem

to have any intention yet to move to Moodle 3.5 as it was only released

last May.

Regards,

Edmund

On Thu, Jun 21, 2018, 4:06 PM Chris Kenniburg (via Moodle.org) <

Average of ratings: -

Permalink | Show parent | Reply

Edmund,

You should be able to create drop this file into fordson/classes folder and it should work with weeks. Clear cache after dropping this file in the folder on your server.

https://github.com/dbnschools/moodle-theme_fordson/blob/master/classes/format_weeks_renderer.php

No guarantees. Once we upgrade our own Moodle sites we only look forward for new development. It's too much work back porting everything. Especially some of the more complex stuff and all the growing pains Moodle has gone through since M3.2+ .

Any new features and development will be on Moodle 3.5.

Chris

Average of ratings: -

Permalink | Show parent | Reply

Thanks Chris, that was quick. Cheers.

Average of ratings: -

Permalink | Show parent | Reply

Version 1.6.1 has been released. In this version we made the Dearborn Public Schools preset the default.

VERSION 1.6.1 PRESETS - In this release we changed our default preset to be Dearborn Public Schools. We renamed the previously named default presets to:

default.scss = K-12.scss
default_x = K-12 Vertical Block TItle
default fullscreen header image = K-12 Fullscreen Header Image

Basically the previous presets named default were changed to "K-12".

A new default background image was also included in this release.

Topic summary page now includes a Progress bar if using course completion for students. Show one topic per page is the setting to see this.

Average of ratings: -

Permalink | Show parent | Reply

Version 1.6.3 now includes Favicon support. From the Fordson Admin settings you can upload a favicon for the site.

Average of ratings: -

Permalink | Show parent | Reply

It does not seem to be a problem with the fordson theme.

It also happens in 'fordson' theme based on the boost theme.

It is a symptom after DB repair a while ago.

Does anyone know a solution?

Below are screenshots and debug messages.

-----------------------------------------------------------------------------------------------------------------

The course title box overlaps on mobile.

The course title box overlaps on mobile.

Landscape grows strangely on desktop login.

line 364 of /lib/navigationlib.php: call to navigation_node->add_node()
line 353 of /theme/fordson/lib/fordson_lib.php: call to navigation_node->add()
line 297 of /theme/fordson/lib/fordson_lib.php: call to fordson_navigation_custom_menu_item()
line 57 of /theme/fordson/layout/columns2.php: call to fordson_local_navigation_extend_navigation()
line 1261 of /lib/outputrenderers.php: call to include()
line 1191 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
line 116 of /admin/settings.php: call to core_renderer->header()

Navigation node intersect: Adding a node that already exists 9

line 889 of /lib/navigationlib.php: call to debugging()
line 388 of /lib/navigationlib.php: call to navigation_node_collection->add()
line 364 of /lib/navigationlib.php: call to navigation_node->add_node()
line 353 of /theme/fordson/lib/fordson_lib.php: call to navigation_node->add()
line 297 of /theme/fordson/lib/fordson_lib.php: call to fordson_navigation_custom_menu_item()
line 57 of /theme/fordson/layout/columns2.php: call to fordson_local_navigation_extend_navigation()
line 1261 of /lib/outputrenderers.php: call to include()
line 1191 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
line 116 of /admin/settings.php: call to core_renderer->header()

Navigation node intersect: Adding a node that already exists 8

line 889 of /lib/navigationlib.php: call to debugging()
line 442 of /lib/navigationlib.php: call to navigation_node_collection->add()
line 445 of /lib/navigationlib.php: call to navigation_node->build_flat_navigation_list()
line 3884 of /lib/navigationlib.php: call to navigation_node->build_flat_navigation_list()
line 771 of /lib/pagelib.php: call to flat_navigation->initialise()
line 820 of /lib/pagelib.php: call to moodle_page->magic_get_flatnav()
line 65 of /theme/fordson/layout/columns2.php: call to moodle_page->__get()
line 1261 of /lib/outputrenderers.php: call to include()
line 1191 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
line 116 of /admin/settings.php: call to core_renderer->header()

Navigation node intersect: Adding a node that already exists 9

line 889 of /lib/navigationlib.php: call to debugging()
line 442 of /lib/navigationlib.php: call to navigation_node_collection->add()
line 445 of /lib/navigationlib.php: call to navigation_node->build_flat_navigation_list()
line 3884 of /lib/navigationlib.php: call to navigation_node->build_flat_navigation_list()
line 771 of /lib/pagelib.php: call to flat_navigation->initialise()
line 820 of /lib/pagelib.php: call to moodle_page->magic_get_flatnav()
line 65 of /theme/fordson/layout/columns2.php: call to moodle_page->__get()
line 1261 of /lib/outputrenderers.php: call to include()
line 1191 of /lib/outputrenderers.php: call to core_renderer->render_page_layout()
line 116 of /admin/settings.php: call to core_renderer->header()

Average of ratings: -

Permalink | Show parent | Reply

Hopefully someone else might know how to fix this. I cannot get my site to do this.

Average of ratings: -

Permalink | Show parent | Reply

Can you post the error messages that occur when you are not using Fordson - switch to Boost for example...what version of Moodle?

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris

Thank you for your wonderful work.

I have a doubt, I believe that simple for you. Using the E-learner scss preset, how to leave only the course header image, only in the course area, and not in the other moodle site sessions?

Sérgio

Average of ratings: -

Permalink | Show parent | Reply

Sergio,

The elearner preset uses images in course summary files that are used as full-screen backgrounds. If you do not want to allow teachers to customize their course using course summary files then you can turn this feature off for the entire site. Once you turn this off you can use a single image for every course on your site.

Go to Appearance > Fordson > Custom Image Settings and uncheck "Show Course Images". Then you can upload a Default Header Image and it will be used across the entire site.

Chris

Average of ratings: -

Permalink | Show parent | Reply

Sorry Chris, I made a mistake on the preset. What I'm using is Corporate Learner.

I want to keep the summary image only for the courses. And remove the banner and margin-top in every session of the site.

Something like:

div # learningcontent2 {

position: relative;

/ * margin-top: $ headerimagepadding; * /

But if I apply it, I lose the images of the courses.

Average of ratings: -

Permalink | Show parent | Reply

I am not so sure this is corporate learner. It looks like you've made some changes.

Corporate learner doesn't use header images.

Is it possible you are using this preset with another theme?

Average of ratings: -

Permalink | Show parent | Reply

Yes, excuses ... again. I cleared the cache.

I'm working from preset University learner :/

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris

Thank you for awesome theme.

We use Fordson theme with Corporate Learner preset on Moodle 3.4+. In Content Areas Frontpage Authenticated User and Frontpage Visitor textboxes we have some text with small site logo image at the end. At fresh instalation text and image were shown ok, but after changing logo image there is only broken link for that image shown. In editor images are shown correctly. Can we use pictures in this textboxes or are we limited to text only?

Average of ratings: -

Permalink | Show parent | Reply

You can use images but they must be hosted outside of moodle in this particular textbox. You can always add the images in a folder on your server and use them with the text editor where it asks for an image url.

This particular textbox will not allow you to use uploaded image files in the atto editor.

Average of ratings: -

Permalink | Show parent | Reply

Chris, thanks. It works fine now.

Average of ratings: -

Permalink | Show parent | Reply

HI Chris

Thank you so much for your work on the Fordson Theme - awesome.

I have one small issue with the questions not displaying correctly in the quizzes. Some of the questions I have created are not displayed within the quiz area - see the attachment.

My moodle version is 3.2.1+, we updated to version 3.3.4 ... but had to roll this back as we lost a lot of functionality. So any ideas how to fix this on 3.2.1+.

I have altered the styles.css as you mentioned in another thread ...

@media screen and (min-width: 992px) {

#page.container-fluid {

padding: 0 2rem !important;

}

Regards

Sue

Question beyond quiz area

Average of ratings: -

Permalink | Show parent | Reply

Hello Sue,

From the image it seems your question uses tables. Tables are not responsive and eventually they cannot adapt any smaller because of the cell contents. This seems to be what you are experiencing. The table spills out of the question container.

Moodle 3.2 was the very early development of our Fordson theme. Moodle 3.3 is now locked and all development is on 3.4 with an eye on 3.5 very soon.

If you upgrade Moodle be sure to upgrade the theme as well. I recommend the latest version for 3.2, 3.3, or 3.4.

Our latest version 1.7 for Moodle 3.4 has some amazing features to streamline navigation and the edit button is now always visible and when pressed will return you to the same location on the page. Teachers will love this!

Average of ratings: -

Permalink | Show parent | Reply

HI Chris

Thanks for getting back to me ... and yes that makes perfect sense. Just wish it was not the case of course.

Once again thanks for your theme it is awesome!

Cheers

Sue

Average of ratings: -

Permalink | Show parent | Reply

Hi Sue,

This may seem like a silly question, but the code you posted above is missing the end brace...

@media screen and (min-width: 992px) {
    #page.container-fluid {
         padding: 0 2rem !important;
    }
} <-- THIS ONE

Which if you missed it off then it would not work. Which in itself could be aggravating the problem!!!

That said I do not think that particular @media style would fix the problem you have there.

Is the question you posted a view of an Invoice as in an image jpg file or similar? Or part of a spreadsheet?

Just curious really because I have not come across anything of that type before. Possible because I am not a teacher. Can you explain how such a Quiz can be created to look like that?

If I know how it is created then I may be able to fathom a way round the problem you have on that page.

Cheers

Mary

Average of ratings: -

Permalink | Show parent | Reply

HI Mary

Thank you yes it does have the closing bracket in the code in the css file - just missed it when copying ...

I created the question with a table in it - and Chris has replied that the table is non-responsive to the quiz container - which explains why it is going over the quiz area.

Is this enough information for you to have a look at it?

Thank you so much.

Regards

Sue

Average of ratings: -

Permalink | Show parent | Reply

Hi Sue,

In a way it explains the reason that the table is too big for the question area, however you can restrict the width of the table if you use percentages in the styling, so that columns and overall table width and height only take up the space allotted to them.

Web pages were originally built using table structures. Its pretty easy to do when you know how, but it is a time consuming thing to do.

Hope this helps?

Mary

Average of ratings: -

Permalink | Show parent | Reply

Hi,

How to solve this?

Using Moodle 3.4.1 / Fordon 1.7

Image is 1280px x 800px.

Ricardo

Average of ratings: -

Permalink | Show parent | Reply

That looks like you are using the custom login page. Please fill out the forms on the page for the custom login page. There are 4 icon marketing spots and up to 3 text and image boxes. You should complete those forms in order to fill the space between the top of the page and the footer. Otherwise do not use the Custom Login Page.

Average of ratings: -

Permalink | Show parent | Reply

Chris,

I'm experiencing the same issue with the custom login page as referred to above. I included icon marketing spots, which certainly helped, but I can still see the original image for a moment while my custom login page is loading. Is there any way to get rid of this?

Average of ratings: -

Permalink | Show parent | Reply

I'm looking into it. I believe it might be as simple as just removing this:

moodle/theme/fordson/scss/styles.scss at line 145

/* login on frontpage */

body#page-login-index, body#page-login-signup{

background-image: url([[pix:theme|headerbg]]);

background-size: cover;

background-position: center;

}

If you can remove this snippet and try it out let me know. I don't think you will have this issue with Moodle 3.5. I don't think I carried this over.

Average of ratings: -

Permalink | Show parent | Reply

I am using Moodle 3.3.3 and Fordson v1.6.6

My issue at the moment is that my quiz questions aren't displaying correctly in the Fordson theme. For some reason the paragraph containing the answer boxes is wrapping itself down the page. This is not the case in other themes. (Except boost that I just tried out of interest).

How can this be easily rectified, it is very puzzling and frustrating for students.

Please see images below.

Thanks in Advance.

Craig.

html code of the question:

(generated by the atto editor in a calculated question)

<p>Calculate the surface area of the cone below, given</p>

<p>q = {col1} cm, &<br>k = {cor1} cm.</p>

<p><img src="http://web3.albionpk-h.schools.nsw.edu.au/moodle/draftfile.php/16/user/draft/746113367/Cone1.PNG" alt="jhv" width="88" height="140"></p>

<p>Surface area = __________ cm<sup>2</sup> (1 d.p.)</p>

Question as shown in Fordson (and Boost)

Question shown correctly in clean and most other themes:

Average of ratings: -

Permalink | Show parent | Reply

Boost has styling that puts this on the separate line. It's css in the core of Boost I believe. Fordson and any other Boost-based theme would most likely inherit this setting.

Average of ratings: -

Permalink | Show parent | Reply

I thought that this had been fixed in later versions...maybe I just saw someone wishing it had been fixed..!

What version of Moodle?

Average of ratings: -

Permalink | Show parent | Reply

Moodle 3.3.3 3.3.3+ (Build: 20171208)

Fordson 1.6.6 2017121900

Craig

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

do you know if there are plans to fix this in Boost so that it filters down through the various child themes?

Thanks,

Craig

Average of ratings: -

Permalink | Show parent | Reply

Craig,

Send me an export of the question as moodle xml and I will take a look and see if I can get you code to fix it.

Average of ratings: -

Permalink | Show parent | Reply

Here you are Chris. Any help is appreciated.

I have hundreds of questions that this impacts, essentially anything in the calculated questions with text followed by the answer box (which is generated by the underscores) then text after it.

If the issue originates in Boost, will fixing it there rectify the problem in Fordson?

Thanks,

Craig.

application/xml

questions-10MAT1-2018-test category-20180301-1132.xml

Average of ratings: -

Permalink | Show parent | Reply

Craig,

Try adding this to the custom SCSS box at the bottom of the Colours page of Fordson.

.formulation input[type="text"], .formulation select {

display: inline-block;

}

As with any of this there might be unintended consequences where it might make something else look funny. Try it and we will see. This fixes the question in my test site.

Average of ratings: -

Permalink | Show parent | Reply

Thanks Chris,

that's much better. If this is fixed in a future release of the theme, will i need to delete that code from the settings to avoid a conflict?

Craig.

Average of ratings: -

Permalink | Show parent | Reply

Craig,

I don't think you will need to delete it unless it causes a problem.

Basically this is part of how Boost displays that input box and Fordson will inherit any changes in Boost.

Average of ratings: -

Permalink | Show parent | Reply

Chris,

First and foremost, thank you to you and your team for the awesome theme!

Quick question for you that might be of help to others, as well. Is there a reason that the icon navigation requires a user to not be a guest and logged in (https://github.com/dbnschools/moodle-theme_fordson/blob/moodle33/classes/output/core_renderer.php#L466)? I am considering removing that requirement for a site I work on so visitors can see the navigation before logging in, but I wanted to make sure there were no security (or other) issues that I was not thinking of.

Thanks, in advance, for your response!

-Jesse

Average of ratings: -

Permalink | Show parent | Reply

I can't remember why we did it this way but it shouldn't be a problem to remove that check.

Our philosophy is the homepage is where a user logs in because we want to know who you are. Generally we force all people to login first before getting access to anything. We view Moodle as an extension of the classroom and we don't let strangers in the classroom, so same applies to Moodle.

Average of ratings: Useful (1)

Permalink | Show parent | Reply

Chris,

Thanks for the prompt reply! I think its a great philosophy that fits most education institutions and I think that is why I am seeing this for the first time. In this case, the client I am working with is a non-profit that is going to use the Moodle homepage to replace their current site that is built in a wiki with the hopes of drawing them into the site and getting them to take classes. Having a consistent nav will hopefully help them out! It might be worth considering a check box to the settings to show to all or only to logged in users? Just a thought.

For anyone who stumbles across this wondering how to make this work, change the following lines in classes/output/core_renderer.php

        $hasnav1icon = (empty($PAGE->theme->settings->nav1icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav1icon;
        $hasnav2icon = (empty($PAGE->theme->settings->nav2icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav2icon;
        $hasnav3icon = (empty($PAGE->theme->settings->nav3icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav3icon;
        $hasnav4icon = (empty($PAGE->theme->settings->nav4icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav4icon;
        $hasnav5icon = (empty($PAGE->theme->settings->nav5icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav5icon;
        $hasnav6icon = (empty($PAGE->theme->settings->nav6icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav6icon;
        $hasnav7icon = (empty($PAGE->theme->settings->nav7icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav7icon;
        $hasnav8icon = (empty($PAGE->theme->settings->nav8icon && isloggedin() && !isguestuser())) ? false : $PAGE->theme->settings->nav8icon;

to the following:

        $hasnav1icon = $PAGE->theme->settings->nav1icon;
        $hasnav2icon = $PAGE->theme->settings->nav2icon;
        $hasnav3icon = $PAGE->theme->settings->nav3icon;
        $hasnav4icon = $PAGE->theme->settings->nav4icon;
        $hasnav5icon = $PAGE->theme->settings->nav5icon;
        $hasnav6icon = $PAGE->theme->settings->nav6icon;
        $hasnav7icon = $PAGE->theme->settings->nav7icon;
        $hasnav8icon = $PAGE->theme->settings->nav8icon;

And it should work great. Thanks, again, for the awesome theme!

Average of ratings: -

Permalink | Show parent | Reply

The other thing to consider is that you might want those buttons to only appear when logged in so that the user knows they are actually logged in. Sometimes a change in scenery allows the user to realize they are logged in.

Also, depending on what you put as links in the buttons it may require the user to be logged in. That is what we do, so I didn't quite consider options outside of that.

There are custom textboxes for logged in users and logged out users too.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

Amazing theme! so many features whuich I hope to introduce to our users...

Im trying to recreate the look of one of the course screenshots in your documentation with no joy, guessing the version has surpassed that default 'preset'?

here's what im going for... but would also like to add labels to the cog and maybe add a button which links straight to the course summary file drop zone for course image change?

would really like to contribute and perhaps develop a 'preset' based on our UI research.

but as a starting point - how do I get back to this look? Love how the title etc float over the image, increasing view of the course content.

Fordson floating course header - less space taken up.

Please see my other thread - new to the Boost scene after theming with Aardvark for 7 years, little bit rusty! https://moodle.org/mod/forum/discuss.php?d=368857#p1487674

Cheers.

Average of ratings: -

Permalink | Show parent | Reply

Hello Chris,

I believe this was during the Moodle 3.2 versions of Fordson. Do not install that on anything other than Moodle 3.2. Unfortunately feedback from our teachers and other considerations took us in a different direction. We felt the screen area taken up by the photo was too much with little to no real benefit for the student.

As for editing what appears in the cog you'd need to dive into overwriting core Moodle functions. We decided against that and went with building the Modal window for course management. This you can manipulate and add your own links if you can write code. We didn't care for how the current course edit cog is organized so we laid things out in a logical order and built this into our theme.

Our thinking and goal is to have all the links for the users in the top navigation bar. Starting from the left the site title takes you to the homepage. To the right of that is the nav drawer toggle followed by course management and the edit button. All user centric items are to the right of the top nav bar.

This means you have all the tools for manipulating and managing your course and profile in the top bar and can focus completely on learning below. This trains the user to look to the top nav bar which is much easier than all the various places moodle currently hides links and navigational elements. No more scrolling to the top just to turn editing on and no more scrolling to the top just to access course management links.

The Moodle 3.4 & 3.5 Fordson theme does have several key enhancements for usability.

The teacher dashboard now appears as a modal window and you can access it from anywhere in the course.
Turn editing on is always in view and will return the user to where ever they clicked the button.
9 uniquely styled presets that meet a variety of needs and looks
Control over Activity Chooser to select "top activities" and control the ordering. You can even hide activities.

I am monitoring and looking for cues from Moodle on where they plan on taking Boost core and watching discussions on new navigation schemes they are developing. We want to stay as close to core as possible but offer some unique features as well. They are currently prototyping and gathering ideas on how to better display and organize navigation.

Average of ratings: Useful (1)

Permalink | Show parent | Reply

Thanks Chris,

always good to know the context and thinking behind something, and totally get it, just think its a massive jump at the minute for our users, although that's no bad thing as long as its intuitive!

I'm in the process of getting some more feedback on what users (staff and students) think of Boost with a few changes compared to our old BS2 Aardvark Child in 3.0.

are there any threads/ tracker items/ groups we can be part of to push UI improvements in Moodle and Moodle Core?

Average of ratings: -

Permalink | Show parent | Reply

We have an issue where Fordson does not display menus with 2 child links (**). Example:

Parent Item
-child
-child**
-child
-child**

Is there a solution for this?

Average of ratings: -

Permalink | Show parent | Reply

To clarify, the issue lies with the 'child of a child'. For some reason the child of a child does not show.

Average of ratings: -

Permalink | Show parent | Reply

Does this work in Boost?

From memory I think there was something about BS4 not supporting multiple levels of drop downs - but I could be wrong in that and I'm on a mobile and travelling for a meeting at the moment, so can't check, sorry.

Average of ratings: -

Permalink | Show parent | Reply

Wow - how did I miss that!?

Yes! You are correct - BOOST does not handle 2nd children. However, premium themes like Lamda do!

Ugh! What can be done?

Average of ratings: -

Permalink | Show parent | Reply

I believe that Lamda is an old port of the Essential theme, so not really a case of 'premium themes' being the solution but rather the underlying framework as the menu system here is a part of that. So difference between Bootstrap 2.3.2 and 4 alpha 4.

Average of ratings: Useful (1)

Permalink | Show parent | Reply

As Gareth says, this isn't 'premium' v 'free' its Bootstrap2 (Lambda/Clean/More/Essential/Adaptable/Flexibase/etc) v Bootstrap4 (Boost/Fordson/Waxed/etc) - I was going to say 'old v new' but Gareth has only just released another version of Essential, so there's no way I could class that as 'old' :D

Average of ratings: -

Permalink | Show parent | Reply

We had the same problem with Fordson. We like the theme, so are living with linear dropdown custom menu's, rather than the flyouts that are much more compact and efficient.

Craig.

Average of ratings: -

Permalink | Show parent | Reply

Is there a quick way to move 'Hidden From Students'? My teachers are loving the theme but complaining about the Moodle Scroll of Death because 'Hidden From Students' keeps is forcing each activity to double its original height... I know this isn't directly a Fordson issue, but thought people here might have a CSS solution or perhaps even a better idea. See attached for specifics.

Average of ratings: -

Permalink | Show parent | Reply

Try adding this to additional css:

.section .activity .availabilityinfo, .section .activity .contentafterlink {

margin-left: 0px;

float: right;

}

It only works on screens that are wide enough - smaller screens it will drop below again.

Average of ratings: -

Permalink | Show parent | Reply

Hi @Emma,

Thanks, this was my solition as well, though I changed it slightly:

.section .activity .availabilityinfo { float:right; margin-top: .3em !important; }

Average of ratings: -

Permalink | Show parent | Reply

Hello!

Since our district updated to Moodle 3.4, I need to redo my modified Fordson theme (which 3.4 broke). Because of the gamification features I have included in my course, I need to remove the ability to move to the previous/next activity from within the activities themselves. (I had students see that and they were able to access the "abandoned" gamification features by clicking those links as opposed to discovering the Easter eggs within their assignments.

In Chrome's developer's panel, I was able to find that the area is related to <div class="m-t-2 m-b-1">, but when I search throughout Fordson (with Netbeans), I can't find that class to edit/remove from the theme. Since Evolve-D doesn't have those links, I figured it was something that could be edited in the theme itself, and not Moodle core specific. (I am temporarily back to Evolve-D, to prevent students from accessing those links.)

Any suggestions as to where to look or how to remove those from the theme?

Thanks!

Brian

Average of ratings: -

Permalink | Show parent | Reply

CORRECTION: "Orphaned" gamification features

Average of ratings: -

Permalink | Show parent | Reply

Hey Brian,

I have a solution. The activity navigation is added to the page with this line of code:

{{{ output.activity_navigation }}}

You can see it and remove it here:

https://github.com/dbnschools/moodle-theme_fordson/blob/master/templates/columns2.mustache#L105

which is in the Fordson > templates > columns2.mustache file.

Hope that helps. This activity navigation was a new feature in core Moodle 3.4.

Chris

Average of ratings: -

Permalink | Show parent | Reply

Thanks, Chris! When I found out that students were "gaming" the system, I had to revert to Evolve-D until I made a new clone version of Fordson. I now have time to recreate my close with specific settings for our Global Studies course.

Average of ratings: -

Permalink | Show parent | Reply

So I am more curious about why it was pulling those activities to start with - did you have them set to the new Stealth mode?

Average of ratings: -

Permalink | Show parent | Reply

Hi Emma,

First of all, I'm sorry. I didn't see your reply until now. When I created the gamification of my courses, there was no stealth mode (and I haven't explored it). I had to create orphaned clues (linked via Easter eggs in my activities) that were placed in a unit that was not visible to students. They clicked on the Easter egg, which sent them to a lesson that had the clue for finding Carmen Sandiego. Finishing that lesson triggered the visibility of the clue on the unit page. After collecting 5 clues, a link is revealed on the unit page, which takes them to another abandoned lesson, where they can enter where they believe Carmen is hiding, with feedback (a story) when they enter Carmen's correct location.

Average of ratings: -

Permalink | Show parent | Reply

Stealth mode replaces orphaned activities, I suggest trying it and see if maybe that just resolves the issue..

Average of ratings: -

Permalink | Show parent | Reply

Ran into another issue, which I am sure will be easy to fix.

The last time, I was able to increase the font size of the activity/lesson titles and the icons in the section pages by adding

body { font-size: 120%; }

.fa { font-size: 120%;}

While it is changing some text, such as those in other blocks, the actual names of the lessons/activities are remaining the same. I even tried exaggerating it to 300% to make sure it wasn't just my perception; they remained the same. Since our students primarily use Chromebooks, they liked when I had slightly larger fonts for listing their activities.

I miss the nav drawer customization, because I was able to have course specific links available to Global Studies students (since it was a Global Studies theme). I contacted the author of the Boost navigation fumbling plugin that you recommended, seeing if it allowed teacher addition of links for specific courses. If not, I might have to try to add the links somewhere in the theme.

Thanks again for the help.

Average of ratings: -

Permalink | Show parent | Reply

I forgot that I also tried adjusting the value here with the result appearing to be the size the word "edit" in edit mode:

.section li.activity {

padding: $spacer;

border-radius: 5px;

border-bottom: 1px dashed $gray-lighter;

font-size: 14px;

Average of ratings: -

Permalink | Show parent | Reply

I see now that this thread is for the older version of Fordson (1.7 being the 2018 release), but I don't want to double post. If someone could point me in the direction of where to change the font size for the text listing the activities, that would be great.

Average of ratings: -

Permalink | Show parent | Reply

What course format are you using?

Average of ratings: -

Permalink | Show parent | Reply

I am using Grid format with each unit (section) displayed on a separate page. As stated, in previous versions, I could simply add the body fontsize percentage and it all increased. WIth Fordson 1.7, everything scales except the activity titles.

Average of ratings: -

Permalink | Show parent | Reply

Hi Fordsonions, Chris,

I've been a learning tech for a little while but always in orgs with very compartmentalised structures, so I've never had to deal with skins or 'under the hood' type matters before. However I'm the sole Moodle wizard here so a lot more falls onto my desk.

I'm currently trying to figure out how to remove the button (now text since I added a logo) that appears in the top bar of the site (photo attached). I'm fairly certain I managed to do this in another theme in the past but I've been running around in circles for about the past 3 hours and finally decided to ask for some help...

HELP!

Thanks,

Alex.

Average of ratings: -

Permalink | Show parent | Reply

Go to the theme directory themes/fordson/templates and open up header.mustache

There you will see this:

        <a href="{{{ config.wwwroot }}}" class="navbar-brand {{# output.should_display_navbar_logo }}has-logo{{/ output.should_display_navbar_logo }}
            {{^ output.should_display_navbar_logo }}
                hidden-sm-down
            {{/ output.should_display_navbar_logo }}
                ">
            {{# output.should_display_navbar_logo }}
                <span class="logo hidden-xs-down">
                    <img src="{{output.get_compact_logo_url}}" alt="{{sitename}}">
                </span>
            {{/ output.should_display_navbar_logo }}
            <span class="site-name hidden-sm-down">{{{ sitename }}}</span>
        </a>

Remove this line:

<span class="site-name hidden-sm-down">{{{ sitename }}}</span>

That will remove the sitename from appearing with the logo.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris, thanks so much for the speedy reply (we had a long weekend here in the UK so only just seen it.)

Hopefully our hosting company won't make implementing this an issue.

Kind regards,

Alex.

Average of ratings: -

Permalink | Show parent | Reply

Hi again Chris,

So I forwarded the code you very helpfully sent me to our very well paid Moodle hosting provider, asking them to make the changes to the theme as they don't allow us any access to any core code.

I received this helpful email back this morning.

"Hi Alex,

Unfortunately, we are not allowed to make changes to code neither core nor plugin (theme). One reason is that when we update the theme on your site, any changes would be overwritten with the original code.

You could obtain the files yourself, make the changes you require, then send us the changed theme plugin package.
You could ask the theme's provider, if they could provide you with some custom CSS to attain the same end.

The latter would be the better option as this would remain constant over theme updates."

1. Is it possible to remove the 'home' link with custom CSS?

2. Do you have the time and or inclination to write it?

Massive thanks,

Alex.

Average of ratings: -

Permalink | Show parent | Reply

So I found a workaround all by myself

In the Front page settings I just changed the 'short name for site' to an invisible character I found in the character map. Now it doesn't display anything! Problem solved!

Average of ratings: -

Permalink | Show parent | Reply

Hello!

My question is about the links in the customized Nav Drawer. Is it possible to use the multi-language filter (https://docs.moodle.org/28/en/Multi-language_content_filter) for the links text filled in Theme setting > Custom menu items?

For example:

Ajudes:

<span lang="ca" class="multilang">Ajudes</span>
<span lang="es" class="multilang">Ayudas</span>
<span lang="en" class="multilang">Help</span>

I've tried and it is show like this: AjudesAyudasHelp

This is working fine in other HTML areas.

Any idea?

Thank you,
Marga

Average of ratings: -

Permalink | Show parent | Reply

Hey folks,

Moodle 3.4.

Looking for some idea why we're missing some font awesome icons in various places, most commonly the delete icons, although many atto icons too. (screen reader, clear formatting, accessibility checker)

This only happens on Fordson 1.7. We have 1.6 and 1.7 installed on the same server and 1.6 is working correctly (The 1.6 branches are renamed and so they don't get updated and so different departments can change the branding colours.)

Any thoughts?

Cheers!

Bob

Average of ratings: -

Permalink | Show parent | Reply

Not quite sure but it is not present in a standard install of Moodle 3.4 and Fordson.

I suspect another plugin possibly causing the issue or maybe something with having the same theme but a lower version 1.6 on the same server might be causing an issue.

Average of ratings: -

Permalink | Show parent | Reply

Hi again Chris (or anyone who may know).

I cannot get the footer to show while a user is logged in. It seems to only display the extra info (web addresses, contact details etc) when logged out. All that shows when a user is logged in is "You are logged in as..." and a link saying "Home".

How can I get the extra info to show on every page?

Much appreciation!

Alex.

Average of ratings: -

Permalink | Show parent | Reply

That footer only appears on the Site Home. If your default homepage once logged in is the Dashboard then it might not appear.

In the newest version for Moodle 3.5 we made it so that the footer appears on all pages.

Average of ratings: -

Permalink | Show parent | Reply

Ahhh... well that explains it. Thanks for the speedy reply.

Average of ratings: -

Permalink | Show parent | Reply

Hello!

I'm using Moodle 3.4 and Fordson V1.7 and I've configured the footer with social icons and a footnote, but it seems only display at home page. This is right or I'm doing somethig wrong? It is possible to show the footer in every page?

Thank you,

Marga

Average of ratings: -

Permalink | Show parent | Reply

Maria,

In Moodle 3.4 and previous versions we intentionally made the footer icons only show on the homepage with the thought that once a student went into a course they should focus on what the classroom content.

However, in Moodle 3.5 we made the footer display on all pages.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

I have been using your theme for about 6 months - you have done such great work! Thank you for making Fordson available.

I confess that I really should have logged in here to say thanks before now, rather than saying thanks on the one hand and asking for help on the other. Hopefully this will be quick and easy.

Since it's coming up to the end of our first semester using Fordson, I have had a teacher asking about backing up their course. I know this can be done through the admin panel, but I thought teachers of courses should be able to do this as individuals.

I realise now that when a teacher is viewing a course, they only have the "Turn Edit On" button visible, and not the gear menu with backup. Is there a setting I can enable for teachers so that they get the gear menu?

Thanks for your time and help!

Regards,
David.

Average of ratings: -

Permalink | Show parent | Reply

David,

The teacher course administration is in the Course Dashboard. The teacher dashboard is triggered by the role permission:

$hasteacherdash = has_capability('moodle/course:viewhiddenactivities', $context);

Basically, you must allow whatever role you call teacher to view hidden activities. Without this capability they will not be able to see the course administration links.

There is one other permission check and this one involves being able to configure course enrollment seen here:

$haspermission = has_capability('enrol/category:config', $context) && $PAGE->theme->settings->coursemanagementtoggle && isset($COURSE->id) && $COURSE->id > 1;

Again, we based these off of standard moodle installs, so if you tweaked or change your role permissions then you might get different results.

Activate or double check that both of these permissions are set to allow and you should be good to go with seeing the Course Admin links for teachers.

-Chris

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

Thank you - that's helpful and clear.

I'm teaching myself this morning, so will only get to investigate further this afternoon (hopefully).

Regards,
David.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

I have now been able to doublecheck things.

"Teacher" role had both permissions correctly set. Each teacher also is mostly assigned an additional role of "faculty" (which has some permissions in addition to "teacher"). This role did not have the two permissions configured. I set them - but there wasn't an effect.

I reset them back to "not set".

I started playing more with various Fordson settings. I happened to unckeck 'theme_fordson | coursemanagementtoggle' (Show Student and Teacher Dashboard Panels). And guess what - I got the edit gear now showing above the "Turn Edit On" button. This is exactly what I was after because it has the backup and restore links in it.

However, by the label "Show Student and Teacher Dashboard Panels", this isn't what I was expecting to toggle on and off. I could be wrong, but I would appreciate your thoughts on this.

Thanks again for your time and help.

Regards,
David.

Average of ratings: -

Permalink | Show parent | Reply

David,

Good point on this. The default is ON. I assumed you had the feature turned on but were not seeing it.

I changed up some of the wording to include "Course Administration" which should be more familiar terminology as it relates to Moodle so that others might better understand what is being turned on and off. If you did turn it off I think it reverts back to normal Edit Cog.

It will be in the next release of Fordson for 3.5.

Average of ratings: Useful (1)

Permalink | Show parent | Reply

Hi Chris,

Ok, sounds good to me.

With the selection turned off, I get the Edit Cog as well as the "Turn Edit On" button. It looks like this:

I find it helpful to have the Cog and the button. So this is now working well for me.

Thanks again for your work on Fordson!

Average of ratings: -

Permalink | Show parent | Reply

Just keep in mind this all changes in Moodle 3.4 &3.5 as the Turn editing on button is moved to the top nav bar. It allows teachers to turn on editing anytime in the course and it's location aware, so it keeps the teacher in the same location on the page that they clicked the button.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

Having it up in the nav bar would be better - so looking forward to that.

We're still on 3.4+ Build 20171123 until we are between semesters and can do some updates.

Regards,
David.

Average of ratings: -

Permalink | Show parent | Reply

Moodle 3.4 and Fordson v1.70

Maybe I am being daft - but I cannot seem to add a link to the icons on the custom login page. Unlike the ones on the site home there is no space to input the url. Can you shed some light?

Also - on the same topic of Icons - is it possible to allow urls to be opened in a new tab or browser? I tried the method used on the Navigation bar settings (adding "target="_blank to the end of the URL) and this gives an invalid URL error.

Thanks

Rhys

Average of ratings: -

Permalink | Show parent | Reply

Rhys,

The custom login icons are just for style and not navigation. You can add links in the description area for each icon and those links you should be able to open in a new window.

However, the actual icon nav bar on the homepage was designed to link to internal pages within your moodle site. I don't know of any easy ways to force a new window.

Chris

Average of ratings: -

Permalink | Show parent | Reply

Thanks for the reply. A bit disappointing as the theme is great but that makes it a bit inflexible when linking to interdependent systems. Would you consider adding this functionality?

Not sure of the point of icons on the login page if they are not supped to be links? Would you consider adding this functionality?

I am also having issues with the block positioning on mobile devices. The three additional regions on the front page become so squashed on an iPad screen that it makes them pretty useless. Ideally would like to overflow them so that they stack. Could you point me in the right direction as to the location of the media query that works for phone screens - I just need to make that process happen for the iPad screen resolution.

Many thanks

Rhys

Average of ratings: -

Permalink | Show parent | Reply

Rhys,

A bit disappointing as the theme is great but that makes it a bit inflexible when linking to interdependent systems. Would you consider adding this functionality?

We will consider it. It works for us and as far as linking to interdependent systems it works just fine, but doesn't open in a new window which is a personal preference.

Not sure of the point of icons on the login page if they are not supped to be links? Would you consider adding this functionality?

The purpose of the icons is to draw attention to a few key things regarding your Moodle site. While the icon cannot be linked there is the possibility to add links in the icon text which appears below. You can even add bootstrap buttons to the icon description but that is entirely up to you to use your own creativity in order to achieve a desired outcome. Try adding class="btn btn-primary" to a link in the html code and see how it creates a button out of the text. I would suggest there is more functionality than you realize.

example: <a href="http://moodle.org" class="btn btn-primary">Built with Moodle</a>

I am also having issues with the block positioning on mobile devices. The three additional regions on the front page become so squashed on an iPad screen that it makes them pretty useless. Ideally would like to overflow them so that they stack. Could you point me in the right direction as to the location of the media query that works for phone screens - I just need to make that process happen for the iPad screen resolution.

You might want to take a look at the fordson/templates/frontpage.mustache file and look for this:

{{#hasfpblockregion}}
                                <div class="fp-blocks">
                                    <div class="container-fluid">
                                        <div class="row">
                                            <div class="col-md-4">
                                                    <section data-region="blocks-fpa" class="hidden-print">
                                                        {{{ fpablocks }}}
                                                    </section>
                                            </div>
                                            <div class="col-md-4">
                                                    <section data-region="blocks-fpb" class="hidden-print">
                                                        {{{ fpbblocks }}}
                                                    </section>
                                            </div>
                                            <div class="col-md-4">
                                                    <section data-region="blocks-fpc" class="hidden-print">
                                                        {{{ fpcblocks }}}
                                                    </section>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            {{/hasfpblockregion}}

You can change the col-md-4 to something like col-lg-4 or even col-xl-4 the md,lg,and xl represent screen size break points in which the column will collapse within the row.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

We are running on moodle 3.4, and I am using Fordson v1.7 to setup the learning site. I am a noob at both css and scss. I have tried to copy over our previous theme settings from essential but it really does not work. Neither are the formats the same at all.

Below are some of the things I need to seek your expertise from:

1) Header:

header

a) I want to replace the text on the grey box with the company logo

b) This navigation button should be same color as the background red. However when i added custom css using .btn-secondary, it turned a few other buttons on the page red, which looked really weird and I dont want that.

c) I would like to increase the height of the header to 100px, which will be just nice to fit the logo on the left.

d) How do I change the color for these icons and texts?

2) Footer:

footer

a) I would like the footer background color to be full on the browser page, how to do it? Height to be 80px.

b) For some reason, when I changed the footer background color on the theme the footer words went red too, so unless I highlight them, I can't read anything.

3) Landing page (not logged in)

landing

On this landing page, I want to remove the sign in option. We have customised another login page for when user clicks on the 'Log In' on the far top right. Please advice how to do this?

I know my questions are aplenty but I am really hoping that you can guide me into my first css/scss experience. Thanks in advance!

Average of ratings: -

Permalink | Show parent | Reply

I highly recommend you leave the old CSS behind and start new with the Fordson theme. That would eliminate half your issues. Reason being is that different themes have different layouts and CSS selectors that you are targeting with your styling.

Have you looked at the setup and instruction links? We recommend you force logins per the instructions and that you turn on the Custom Login Page for Fordson.

All the other tweaks and CSS changes should be done by someone experienced in doing so. Right click and use Google Chromes "Inspect Element" in order to see how you might be able to change the styling. Then you can copy/paste this new code into the Fordson Colors Tab in the custom SCSS box at the bottom of the colors tab.

Average of ratings: -

Permalink | Show parent | Reply

Hi Chris,

Thanks for your reply. Yes I have followed the instructions.

I have worked on the inspect element portion the whole of last night, and while some worked, some others did not work as per expected (I crashed my site one time LOL), hence I seeked css help here.

If you dont mind, can you help?

Average of ratings: -

Permalink | Show parent | Reply

Turn on Force Users to login in Moodle site admin. This isn't a theme setting but it will force the user to go to the login page and not the landing page.

The other recommendation is when styling the button look for the containing selector such as navbar or another div that the btn secondary is located within. Then it will target just that btn. Ie. .navbar .btn-secondary { }

Average of ratings: -

Permalink | Show parent | Reply

THanks Chris!

So I missed the force login page earlier, sorted it now!

And the .navbar -btn-secondary works!

I think I kinda know to set the header to be 100%, but how do I remove the company name replace with a small image?

Average of ratings: -

Permalink | Show parent | Reply

That's more complicated. It's more than just css.

Average of ratings: -

Permalink | Show parent | Reply

is it possible to show me how?

Average of ratings: -

Permalink | Show parent | Reply

Typically for this amount of work you'd pay someone. If it is a tweak or an idea I like I will put it into my theme or try to help out. If it feels like this is just someone needing customization beyond something simple then I do not possibly have the time to entertain all the requests. Sorry, but we are at the start of school and my time is very limited right now.

Average of ratings: Useful (1)

Permalink | Show parent | Reply

Thanks for your assistance!

Average of ratings: -

Permalink | Show parent | Reply

We have just started using Fordson theme 1.7 with Moodle 3.4, and have had a few staff using Assignments with Advanced grading having difficulty accessing the "Define Rubric" option to change the marking rubric.

Previously they would have accessed through the shared Administration block, but this does not seem to show using Fordson. So far the only solution we have found is for the teacher to manually add this block to each assignment using the advanced grading option.

Is there anyway to access the Define Rubric option with just the Fordson options?

Average of ratings: -

Permalink | Show parent | Reply

Once you create the assignment you can access the rubric via the Edit Cog button.

Average of ratings: -

Permalink | Show parent | Reply

Thanks Chris, that has solved it. I'll pass that on to teachers who were having trouble accessing it.

Thank you.

Average of ratings: -

Permalink | Show parent | Reply