Hi,
I'd like to set up a course so that a course specific logo is displayed in the header. The behaviour I'd like is essentially the same as the standard logo theme but specific to individual courses.
Can anyone give me any pointers?
Hi Ray,
The first thing to springs to mind is to include the logo through CSS as a background image in which case you will be able to very easily swap the logo based on the CSS classes that get added to the body tag.
When viewing a course a CSS class such as course-{courseid} e.g. course-1, course-2, course-3 gets added to the body tag. This happens in both Moodle 1.X and Moodle 2.0.
If you would rather include a standard image tag then perhaps you could let us know which version of Moodle you using?
Cheers
Sam
The first thing to springs to mind is to include the logo through CSS as a background image in which case you will be able to very easily swap the logo based on the CSS classes that get added to the body tag.
When viewing a course a CSS class such as course-{courseid} e.g. course-1, course-2, course-3 gets added to the body tag. This happens in both Moodle 1.X and Moodle 2.0.
If you would rather include a standard image tag then perhaps you could let us know which version of Moodle you using?
Cheers
Sam
Ray do you have Admin rights for your VLE site? If so then you can up load images to Site Files, and link to them via CSS.
Did you see my last comment on this thread? About the discussion about this very subject of alternative header images in courses?
Mary
Did you see my last comment on this thread? About the discussion about this very subject of alternative header images in courses?
Mary
Hi Mary,
Yes I did. If I read it correctly this requires changes to references in CSS which requires server access. The latter is not an option for the site in question.
Yes I did. If I read it correctly this requires changes to references in CSS which requires server access. The latter is not an option for the site in question.
Well how do you expect any of it to work if you don't have access to the server? Even if we could come up with a css file and a php file with the necessary code to do what you want, you would still need to upload the files...one way or another. How do think Moodle works? By magic!
Indeed. 
The challenge is to come up with the code that will reference an image file in a location where the end users can upload without access to the server. Although we take server access for granted there are many users, such as the ones who need this solution, who are never permitted server access.
Thanks to everyone for their suggestions so far... I'm sure there must be a way.
The challenge is to come up with the code that will reference an image file in a location where the end users can upload without access to the server. Although we take server access for granted there are many users, such as the ones who need this solution, who are never permitted server access.
Thanks to everyone for their suggestions so far... I'm sure there must be a way.
Mary,
The admin, who has access to the server, sets up an environment in which teachers, who don't have access to the server, can upload content though the Moodle UI during course creation/editing. It's magic!
The admin, who has access to the server, sets up an environment in which teachers, who don't have access to the server, can upload content though the Moodle UI during course creation/editing. It's magic!
Steven,
We have to assume NO access to the server. User Interface will NOT be an option as this will not be included in Moodle 2.1.x although it is included as Legacy Files in Moodle 2.0 for the present.
The alternative, and there are numerous to follow here, is that everything would have to be done using the Evans Server Protocol (ESP where imagination is KEY - think it and it happens).
Mary ROFL
We have to assume NO access to the server. User Interface will NOT be an option as this will not be included in Moodle 2.1.x although it is included as Legacy Files in Moodle 2.0 for the present.
The alternative, and there are numerous to follow here, is that everything would have to be done using the Evans Server Protocol (ESP where imagination is KEY - think it and it happens).
Mary ROFL
I understood "without access to the server" to mean "no admin access" or "no access to the Control Panel of the hosting service".
And by "Moodle UI" I meant the "front end of Moodle".
I believe Ray is looking for a way to upload a dynamic course logo in much the same way that you uploaded the ROFL icon: via an upload field placed neatly in the Moodle UI.
And by "Moodle UI" I meant the "front end of Moodle".
I believe Ray is looking for a way to upload a dynamic course logo in much the same way that you uploaded the ROFL icon: via an upload field placed neatly in the Moodle UI.
It's not an uploaded image, it's hot linked.
Server access, is server access you either have it or you don't.
If a teacher/course creator can up load files/images via the Moodle UI then that is, technically speaking, having access to the server, a limited access I grant you, but access non the less, but let's not quibble about it...life's too short.
Server access, is server access you either have it or you don't.
If a teacher/course creator can up load files/images via the Moodle UI then that is, technically speaking, having access to the server, a limited access I grant you, but access non the less, but let's not quibble about it...life's too short.
Mary,
Please go back and read Ray's post above. He says, "the end users can upload without access to the server". (LINK)
You ask us to not quibble - and I apologize if you interpret my tone as quibbling; I'm not intending it to be so - but the semantics are important here because they are causing an important misunderstanding.
I believe Ray is looking for a way to empower his end users to upload dynamic logos to their courses without direct access to his servers. My suggestions have been based on this understanding.
Please go back and read Ray's post above. He says, "the end users can upload without access to the server". (LINK)
You ask us to not quibble - and I apologize if you interpret my tone as quibbling; I'm not intending it to be so - but the semantics are important here because they are causing an important misunderstanding.
I believe Ray is looking for a way to empower his end users to upload dynamic logos to their courses without direct access to his servers. My suggestions have been based on this understanding.
Hi,
My apologies my terminology seems to have confused the issue. To clarify:
Server access: Direct access to the server using FTP, SFTP etc. Required to upload images or alter CSS files directly on the server.
The target users are able to upload files using the Moodle GUI. They may be admins but mainly users assigned to the Teacher role in courses.
"I believe Ray is looking for a way to empower his end users to upload dynamic logos to their courses without direct access to his servers." Exactly!
My apologies my terminology seems to have confused the issue. To clarify:
Server access: Direct access to the server using FTP, SFTP etc. Required to upload images or alter CSS files directly on the server.
The target users are able to upload files using the Moodle GUI. They may be admins but mainly users assigned to the Teacher role in courses.
"I believe Ray is looking for a way to empower his end users to upload dynamic logos to their courses without direct access to his servers." Exactly!
Ray,
My original misunderstanding came from this post I made earlier in the discussion, where I suggested uploading to the Site Files your answer stated no access to the server was possible, or words to that effect.
In the light of recent discussion I have added some more thoughts on the challenge HERE just below your comment to Frank.
Mary
My original misunderstanding came from this post I made earlier in the discussion, where I suggested uploading to the Site Files your answer stated no access to the server was possible, or words to that effect.
In the light of recent discussion I have added some more thoughts on the challenge HERE just below your comment to Frank.
Mary
Ah, I see.
I was referring to the requirement to have server access to the CSS files.
I have access to site files but teachers don't.
Ray
I was referring to the requirement to have server access to the CSS files.
I have access to site files but teachers don't.
Ray
Ray,
My point was that you can STILL have access to a CSS file which has been uploaded to Site Files by a Teacher. I've used this option my self on occasion for a similar purpose, and for the same reason, because, updating the main CSS in the theme folder was not accessible without a lot of messing about. The use of this CSS file was more to style a page, not the header, although there is nothing to stop you trying this method out. It just needs a little bit of HTML and CSS know how, easy enough to learn for a teacher I would have thought!
Mary
My point was that you can STILL have access to a CSS file which has been uploaded to Site Files by a Teacher. I've used this option my self on occasion for a similar purpose, and for the same reason, because, updating the main CSS in the theme folder was not accessible without a lot of messing about. The use of this CSS file was more to style a page, not the header, although there is nothing to stop you trying this method out. It just needs a little bit of HTML and CSS know how, easy enough to learn for a teacher I would have thought!
Mary
Have you thought of using the course summary to accomplish a dynamic logo?
Start by putting an image into the course summary (Administration>Settings). Then put the following code somewhere in your theme's header, or wherever you want the dynamic course logo to appear:
Start by putting an image into the course summary (Administration>Settings). Then put the following code somewhere in your theme's header, or wherever you want the dynamic course logo to appear:
<?PHP
if (!empty($COURSE->summary)) {
echo $COURSE->summary;
}
?>
if (!empty($COURSE->summary)) {
echo $COURSE->summary;
}
?>
Thanks Steven,
Unfortunately images in the course summary will be displayed when viewing courses in a category and this isn't desirable for us.
Could this approach be modified for an image located in course files
Unfortunately images in the course summary will be displayed when viewing courses in a category and this isn't desirable for us.
Could this approach be modified for an image located in course files
Ray,
I'm sure it could, but unfortunately I don't know how to implement it. And I bet it would require significant changes to the core code.
How about the low-tech approach of just putting the dynamic logo in topic 0?
I'm sure it could, but unfortunately I don't know how to implement it. And I bet it would require significant changes to the core code.
How about the low-tech approach of just putting the dynamic logo in topic 0?
Hi Ray,
I've created a screenshot how I have understood the suggestions so far. I don't quite understand the problem with putting the image in topic 0.
Perhaps you could post a screenshot what you want to achieve.
tia
Frank
I've created a screenshot how I have understood the suggestions so far. I don't quite understand the problem with putting the image in topic 0.
Perhaps you could post a screenshot what you want to achieve.
tia
Frank
Yes that's the broad effect. However, in the example shown the teacher would need to be able to adapt the path in the CSS or only one header image could be used.
Hi Ralf,
I understood Steven to mean the "summary" area in course settings rather than topic 0.
I understood Steven to mean the "summary" area in course settings rather than topic 0.
Yes, I meant the course summary area, editable via the course settings as in the screenshot below. In this example, the teacher uploads the dynamic logo to the course summary, which is controlled by the HTML editor. The logo then appears anywhere you want it to depending on where you add the PHP code I mentioned in an earlier reply. In the screenshot, you can see I've added it just below <div id="page"> in header.html of the standard theme.
Ray, I believe this is what you have been trying to achieve, just in an area that is not the course summary. If so, you might want to think about creating (1) another instance of the HTML editor on the "Edit course settings" page, and (2) another snippet of PHP that will call the logo based on course ID.
The CSS solution seems unworkable because it requires teachers to have access to CSS files. If you want the logo to be editable via the front end, then I think you will need to create a new upload field for your teachers on the "Edit course settings" page (requires modifying the core code) and then placing some snippet of PHP in your theme that will call your dynamic logo based on course ID.
If I can ask, why is using Topic O not an option?
Ray, I believe this is what you have been trying to achieve, just in an area that is not the course summary. If so, you might want to think about creating (1) another instance of the HTML editor on the "Edit course settings" page, and (2) another snippet of PHP that will call the logo based on course ID.
The CSS solution seems unworkable because it requires teachers to have access to CSS files. If you want the logo to be editable via the front end, then I think you will need to create a new upload field for your teachers on the "Edit course settings" page (requires modifying the core code) and then placing some snippet of PHP in your theme that will call your dynamic logo based on course ID.
If I can ask, why is using Topic O not an option?
Hi Steven,
That's cool! Now I understand: You (miss-) use the course summary as a container for the uploaded image and output the image via PHP anywhere in the theme you want.
But for injecting the PHP into theme you will have to have write access to the theme files on the server, which isn't the case with Ray, if I understand correctly.
That's cool! Now I understand: You (miss-) use the course summary as a container for the uploaded image and output the image via PHP anywhere in the theme you want.
But for injecting the PHP into theme you will have to have write access to the theme files on the server, which isn't the case with Ray, if I understand correctly.
Hi Frank,
Not quite. The theme can include whatever PHP as the server admin will upload this (once).
It must be able to be used with a course specific image that the Teacher can upload in the Moodle gui. Therefore it must be capable of dealing with a variable course ID number.
Not quite. The theme can include whatever PHP as the server admin will upload this (once).
It must be able to be used with a course specific image that the Teacher can upload in the Moodle gui. Therefore it must be capable of dealing with a variable course ID number.
In that case would it be feasable to have a set of themes based on the parent theme but incorporating the dynamics of the "Standard Logo" theme, where each seperate theme's logo has a unique filename, where this filename is embedded in the header code for the theme as is found in Standard Logo's header.html?
For Example in the theme for Course 1 the php in the header would be as follows:
if (file_exists($CFG->dirroot.'/logo-course1.jpg')) {
$standardlogo = $CFG->httpswwwroot.'/logo-course1.jpg';
} else if (file_exists($CFG->dirroot.'/logo-course1.gif')) {
$standardlogo = $CFG->httpswwwroot.'/logo-course1.gif';
} else if (file_exists($CFG->dataroot.'/1/logo-course1.jpg')) {
require_once($CFG->libdir.'/filelib.php');
$standardlogo = get_file_url('1/logo-course1.jpg', null, 'httpscoursefile');
} else if (file_exists($CFG->dataroot.'/1/logo-course1.gif')) {
require_once($CFG->libdir.'/filelib.php');
$standardlogo = get_file_url('1/logo-course1.gif', null, 'httpscoursefile');
}
This then would allow the Course Creator/Editing Teacher to upload course specific logos, each with their unique filename, to the Server Files via Moodle UI
And when the Course Creator/Editing Teacher creates a course which needs a course specific logo in the header, all they need do is select the desired theme pertaining to that specific logo in order to achive the desired outcome.
Would you say this method is within the remit for the 'challenge' Ray?
Mary
For Example in the theme for Course 1 the php in the header would be as follows:
if (file_exists($CFG->dirroot.'/logo-course1.jpg')) {
$standardlogo = $CFG->httpswwwroot.'/logo-course1.jpg';
} else if (file_exists($CFG->dirroot.'/logo-course1.gif')) {
$standardlogo = $CFG->httpswwwroot.'/logo-course1.gif';
} else if (file_exists($CFG->dataroot.'/1/logo-course1.jpg')) {
require_once($CFG->libdir.'/filelib.php');
$standardlogo = get_file_url('1/logo-course1.jpg', null, 'httpscoursefile');
} else if (file_exists($CFG->dataroot.'/1/logo-course1.gif')) {
require_once($CFG->libdir.'/filelib.php');
$standardlogo = get_file_url('1/logo-course1.gif', null, 'httpscoursefile');
}
This then would allow the Course Creator/Editing Teacher to upload course specific logos, each with their unique filename, to the Server Files via Moodle UI
And when the Course Creator/Editing Teacher creates a course which needs a course specific logo in the header, all they need do is select the desired theme pertaining to that specific logo in order to achive the desired outcome.
Would you say this method is within the remit for the 'challenge' Ray?
Mary
Hi Frank,
Cool, eh? Yes, this is my "misuse" of the course summary.
Injecting the PHP into the theme does require access to the core files (the theme), but once the PHP has been injected once, that's it. Then the PHP calls the course ID dynamically for each course. No more maintenance is necessary.
Cool, eh? Yes, this is my "misuse" of the course summary.
Injecting the PHP into the theme does require access to the core files (the theme), but once the PHP has been injected once, that's it. Then the PHP calls the course ID dynamically for each course. No more maintenance is necessary.
Yes, another location that can e called dynamically is needed. Changes to core aren't possible either.
Topic 0: The differentiation needs to be in the header as part of the theme to save valuable space in the remainder of the visible area of the course page.
Topic 0: The differentiation needs to be in the header as part of the theme to save valuable space in the remainder of the visible area of the course page.
Hi Ray,
Thanks for explaining. Yes, I agree with you about valuable screen real estate. That's why I explored and eventually discovered the course summary trick.
For your situation, without being able to modify the core code, you'll need some function that is already in Moodle that you are not currently using, and that you can commandeer for this dynamic logo. For me, that function is the PHP I mentioned above. For your situation, I unfortunately don't know what to recommend.
Thanks for explaining. Yes, I agree with you about valuable screen real estate. That's why I explored and eventually discovered the course summary trick.
For your situation, without being able to modify the core code, you'll need some function that is already in Moodle that you are not currently using, and that you can commandeer for this dynamic logo. For me, that function is the PHP I mentioned above. For your situation, I unfortunately don't know what to recommend.
Oops, sorry Frank. I called you Ralf in an earlier reply. That happens to me too.
No probs. You're not the first and won't be the last
That's too easy Frank, Operator D would be more of a challenge!
Ray,
I believe I have found a solution that you might like. It requires a one-time modification of your theme's header.html to inject the following code:
It is simply a formula that will construct a link which points to a file called "dynamic-logo.jpg" in a folder called "logo" in a given course (generated dynamically with $COURSE->id) on your domain (also generated dynamically with $CFG->wwwroot). I've also surrounded the dynamic logo with a div called "dynamic-logo" so that it may be styled to your liking in CSS. Feel free to change the names of the file, folder, and div. My example is only for example.
The dynamic logos are stored within the course, so your teachers will be able to upload a file through the Moodle UI. One caveat: instruct your teachers that the logo must be a named "dynamic-logo.jpg" and it must reside in the "logo" folder within the course (or whatever nomenclature you choose).
If the PHP finds a logo, it displays it. If it finds nothing, it displays nothing.
I've tested it locally (see screenshot). Let me know what you think.
I believe I have found a solution that you might like. It requires a one-time modification of your theme's header.html to inject the following code:
<div id="dynamic-logo">
<?PHP
echo '<img src="'.$CFG->wwwroot.'/file.php/'.$COURSE->id.'/logo/dynamic-logo.jpg" />';
?>
</div>It is simply a formula that will construct a link which points to a file called "dynamic-logo.jpg" in a folder called "logo" in a given course (generated dynamically with $COURSE->id) on your domain (also generated dynamically with $CFG->wwwroot). I've also surrounded the dynamic logo with a div called "dynamic-logo" so that it may be styled to your liking in CSS. Feel free to change the names of the file, folder, and div. My example is only for example.
The dynamic logos are stored within the course, so your teachers will be able to upload a file through the Moodle UI. One caveat: instruct your teachers that the logo must be a named "dynamic-logo.jpg" and it must reside in the "logo" folder within the course (or whatever nomenclature you choose).
If the PHP finds a logo, it displays it. If it finds nothing, it displays nothing.
I've tested it locally (see screenshot). Let me know what you think.
Perfect! That's exactly what I need.
Many thanks for this.
Many thanks for this.
Ray,
Glad to have helped.
Glad to have helped.
Hi Steven,
That's really cool!
Where did you get that $CFG->wwwroot.'/file.php/' part from? I tried $CFG->dataroot .'/'. $COURSE->id but couldn't get it to work properly.
Cheers,
Frank
That's really cool!
Where did you get that $CFG->wwwroot.'/file.php/' part from? I tried $CFG->dataroot .'/'. $COURSE->id but couldn't get it to work properly.
Cheers,
Frank
Frank,
The file.php part is given in the URL for standard logo image. If you look at the image in a standard logo theme the URL looks like this for my website...
.
What I did not realise, was that by adding the $Course->id inplace of the 1 in the above URL using the same heading code in the Standard Logo theme you can assign a number of logos for different courses. This puts a whole new dimension in Moodle theme design, which I am sure Ray will no doubt be talking about in his next How to Moodle book.
Cool!
Mary
The file.php part is given in the URL for standard logo image. If you look at the image in a standard logo theme the URL looks like this for my website...
.What I did not realise, was that by adding the $Course->id inplace of the 1 in the above URL using the same heading code in the Standard Logo theme you can assign a number of logos for different courses. This puts a whole new dimension in Moodle theme design, which I am sure Ray will no doubt be talking about in his next How to Moodle book.
Cool!
Mary
Well, actually I got that idea from your remark above that a theme could use a CSS file from a course's file section...
Hi Frank,
Thanks! Cool, eh?
I got the $CFG->wwwroot part from the config.php file. The file.php part is a part of the absolute URL of *any* file uploaded to course files.
So you tried $CFG->dataroot? That is the location of the "moodledata" directory (we also know this from config.php) and would insert "moodledata" into the URL. But if you look at the absolute URL of any file uploaded to course files, they all have the same basic structure: www.domain.com/moodle/file.php/...
So the domain name I got from $CFG->wwwroot, the file.php bit I threw in because it's always there, the course ID is of course $COURSE-id, the directory structure and filename thereafter I just decided arbitrarily (logo/dynamic-logo.jpg), and then I just concatenated the bits and pieces together, oh and also crossed my fingers.
Thanks! Cool, eh?
I got the $CFG->wwwroot part from the config.php file. The file.php part is a part of the absolute URL of *any* file uploaded to course files.
So you tried $CFG->dataroot? That is the location of the "moodledata" directory (we also know this from config.php) and would insert "moodledata" into the URL. But if you look at the absolute URL of any file uploaded to course files, they all have the same basic structure: www.domain.com/moodle/file.php/...
So the domain name I got from $CFG->wwwroot, the file.php bit I threw in because it's always there, the course ID is of course $COURSE-id, the directory structure and filename thereafter I just decided arbitrarily (logo/dynamic-logo.jpg), and then I just concatenated the bits and pieces together, oh and also crossed my fingers.