Hi,
I have looked everywhere and tried to follow all that I have seen but I can't seem to add a logo to the site I am building.
I simply want to add a logo to the oceanblue theme. How do I do it? I have tried editting the header.html file in the oceanblue theme with code to point to the logo but it doesn't work. The logo is in the oceanblue themefolder (and I tried the pix folder with the config.php setting for customspix turned on and off).
I know this might seem easy to some, but I am rather new to this. So how do I add a logo to the theme?
On another note I would love to see some good documentation on theme design for beginners. I am new to moodle (I know php, xhtml and css okay) and it's hard to find any decent documentation on how to create a custom theme, even though the moodle advertises itself as having easily customised themes. That hasn't been my experience so far.
Any help on either of these would be hugely appreciated.
Hi Matt. I struggled as well but finally figured it out yesterday. Below is the code I have in my header.html file, the logo (logo.jpg in my case) is in the root moodle folder. If you are using a gif as your logo you would need to change the extension in the header file where it refers to the logo. This code will put the logo on the main site page as well as all other pages. If you only want it on your site main page, the code in the header file in the standardlogo theme does the trick.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html<?php echo $direction ?>>
<head>
<?php echo $meta ?>
<meta name="keywords" content="moodle, <?php echo $title ?> " />
<title><?php echo $title ?></title>
<link rel="shortcut icon" href="<?php echo "$CFG->wwwroot/theme/$CFG->theme" ?>/favicon.ico" />
<?php include("$CFG->javascript"); ?>
</head>
<body<?php
echo " $bodytags";
if ($focus) {
echo " onload=\"setfocus()\"";
}
?>>
<div id="page">
<?php if ($home) { // This is what gets printed on the home page only
if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else {
$standardlogo = $CFG->wwwroot.'/theme/'.$CFG->theme.'/logo.jpg';
}
?>
<div id="header-home">
<div class="headermain"><img src="<?php echo $standardlogo ?>" border="0" alt="" /></div>
<div class="headermenu"><?php echo $menu ?></div>
</div>
<?php } else { // This is what gets printed on the other pages
if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else {
$standardlogo = $CFG->wwwroot.'/theme/'.$CFG->theme.'/logo.jpg';
}
?>
<div id="header">
<div class="headermain"><img src="<?php echo $standardlogo ?>" border="0" alt="" /></div>
<div class="headermenu"><?php echo $menu ?></div>
</div>
<?php } ?>
<div class="clearer"> </div>
<?php if ($navigation) { // This is the navigation table with breadcrumbs ?>
<table class="navbar"><tr><td>
<div class="breadcrumb"><?php print_navigation($navigation); ?></div>
<div class="navbutton"><?php echo $button; ?></div>
</td></tr></table>
<?php } else if ($heading) { // If no navigation, but a heading, then print a line
?>
<hr size="1" noshade="noshade" />
<?php } ?>
<div class="clearer"> </div>
<!-- END OF HEADER -->
<div id="content">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html<?php echo $direction ?>>
<head>
<?php echo $meta ?>
<meta name="keywords" content="moodle, <?php echo $title ?> " />
<title><?php echo $title ?></title>
<link rel="shortcut icon" href="<?php echo "$CFG->wwwroot/theme/$CFG->theme" ?>/favicon.ico" />
<?php include("$CFG->javascript"); ?>
</head>
<body<?php
echo " $bodytags";
if ($focus) {
echo " onload=\"setfocus()\"";
}
?>>
<div id="page">
<?php if ($home) { // This is what gets printed on the home page only
if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else {
$standardlogo = $CFG->wwwroot.'/theme/'.$CFG->theme.'/logo.jpg';
}
?>
<div id="header-home">
<div class="headermain"><img src="<?php echo $standardlogo ?>" border="0" alt="" /></div>
<div class="headermenu"><?php echo $menu ?></div>
</div>
<?php } else { // This is what gets printed on the other pages
if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dirroot.'/logo.jpg')) {
$standardlogo = $CFG->wwwroot.'/logo.jpg';
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else if (file_exists($CFG->dataroot.'/1/logo.jpg')) {
if (empty($CFG->slasharguments)) {
$standardlogo = $CFG->wwwroot.'/file.php?file=/1/logo.jpg';
} else {
$standardlogo = $CFG->wwwroot.'/file.php/1/logo.jpg';
}
} else {
$standardlogo = $CFG->wwwroot.'/theme/'.$CFG->theme.'/logo.jpg';
}
?>
<div id="header">
<div class="headermain"><img src="<?php echo $standardlogo ?>" border="0" alt="" /></div>
<div class="headermenu"><?php echo $menu ?></div>
</div>
<?php } ?>
<div class="clearer"> </div>
<?php if ($navigation) { // This is the navigation table with breadcrumbs ?>
<table class="navbar"><tr><td>
<div class="breadcrumb"><?php print_navigation($navigation); ?></div>
<div class="navbutton"><?php echo $button; ?></div>
</td></tr></table>
<?php } else if ($heading) { // If no navigation, but a heading, then print a line
?>
<hr size="1" noshade="noshade" />
<?php } ?>
<div class="clearer"> </div>
<!-- END OF HEADER -->
<div id="content">
Hi Matt,
we started with a documentation for moodle themes . The approach would be to follow the described steps to build your own theme. Using your own theme you will not break it with the next Moodle update overwriting all delivered themes. To start with the logo part please have a look at the theme "standardlogo".
Nikki's posting seams to base on the code in "standardlogo" too.
I hope this helps
Urs
Thanks for the link. IN all my searching i hadn't come across it 