Hmmm - it seems someone has replaced the 'Use in your layout file' section with the way to use them in Templates without leaving the previous version for those many people not using Boost and mustache templates yet, but it would seem from your code that you are not using that newer theming style.
In your theme
<a class="brand" href="<?php echo $CFG->wwwroot;?>">
<img src="<?php echo $OUTPUT->pix_url('logo', 'theme'); ?>" alt="banner image" style='float:left; padding: 10px;'/>
</a>
Previous version of that linked page - for older themes (Clean based)
Using your images within your layout files
To use logo.jpg within the header of the layout file, open the layout
file e.g. general.php and find the correct spot to put your logo.
....
<div id="page-header" class="clearfix">
<!-- Logo should go here -->
<h1 class="headermain"><?php echo $PAGE->heading ?></h1>
<div class="headermenu"><?php
echo $OUTPUT->login_info();
echo $OUTPUT->lang_menu();
echo $PAGE->headingmenu;
?></div>
</div>
....
To achieve this I simply need to add the following line of code:
<img src="<?php echo $OUTPUT->pix_url('logo', 'theme'); ?>" alt="" />
As before, the image's file extension is not needed as Moodle finds it automatically.
Combined the solution is very simple:
....
<div id="page-header" class="clearfix">
<img src="<?php echo $OUTPUT->pix_url('logo', 'theme'); ?>" alt="" />
<h1 class="headermain"><?php echo $PAGE->heading ?></h1>
<div class="headermenu"><?php
echo $OUTPUT->login_info();
echo $OUTPUT->lang_menu();
echo $PAGE->headingmenu;
?></div>
</div>
....
The only other thing to consider is how this example would look if logo.jpg was located in a subfolder e.g. pix/myimages/logos/logo.jpg.
The code for this would be:
<img src="<?php echo $OUTPUT->pix_url('myimages/logos/logo', 'theme'); ?>" alt="" />
Note that 'theme' above means the word theme, and not the name of your theme
