Note: You are currently viewing documentation for Moodle 2.0. Up-to-date documentation for the latest stable version is available here: Header logo.

Header logo: Difference between revisions

From MoodleDocs
m (code formatting)
(Shifted to dev docs)
 
(15 intermediate revisions by 9 users not shown)
Line 1: Line 1:
To show your '''logo in the page header''', the file ''header.html'' in your theme folder requires editing.
{{Moved_to_dev_docs}}
 
In the file ''header.html'' you see the following lines (or similar):
 
<div style="font-family:monospace; border:1px dashed #2F6FAB; padding:1em; background-color:#F9F9F9;">
01:&nbsp;&lt;?php&nbsp;if&nbsp;($home)&nbsp;{&nbsp;&nbsp;
<br />02:&nbsp;//&nbsp;This&nbsp;is&nbsp;what&nbsp;gets&nbsp;printed&nbsp;on&nbsp;the&nbsp;home&nbsp;page&nbsp;only&nbsp;&nbsp;
<br />03:&nbsp;?&gt;
<br />04:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header-home\&quot;&gt;
<br />05:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermain\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$heading&nbsp;?&gt;&lt;/div&gt;
<br />06:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermenu\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$menu&nbsp;?&gt;&lt;/div&gt;
<br />07:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
<br />08:&nbsp;&lt;?php&nbsp;}&nbsp;else&nbsp;if&nbsp;($heading)&nbsp;{&nbsp;&nbsp;
<br />09:&nbsp;//&nbsp;This&nbsp;is&nbsp;what&nbsp;gets&nbsp;printed&nbsp;on&nbsp;any&nbsp;other&nbsp;page&nbsp;with&nbsp;a&nbsp;heading&nbsp;
<br />10:&nbsp;?&gt;
<br />11:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header\&quot;&gt;
<br />12:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermain\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$heading&nbsp;?&gt;&lt;/div&gt;
<br />13:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermenu\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$menu&nbsp;?&gt;&lt;/div&gt;
<br />14:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
<br />15:&nbsp;&lt;?php&nbsp;}&nbsp;?&gt;
</div>
 
The following code example shows a part from a header file with a logo. Please replace lines 5 and 12 above with lines 5 and 12 from the code example below.
 
<div style="font-family:monospace; border:1px dashed #2F6FAB; padding:1em; background-color:#F9F9F9;">
01:&nbsp;&lt;?php&nbsp;if&nbsp;($home)&nbsp;{&nbsp;&nbsp;
<br />02:&nbsp;//&nbsp;This&nbsp;is&nbsp;what&nbsp;gets&nbsp;printed&nbsp;on&nbsp;the&nbsp;home&nbsp;page&nbsp;only&nbsp;&nbsp;
<br />03:&nbsp;?&gt;
<br />04:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header-home\&quot;&gt;
<br />05:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermain\&quot;&gt;&lt;img&nbsp;src=\&quot;&lt;?php&nbsp;echo&nbsp;
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$CFG-&gt;wwwroot.\'/theme/\'.current_theme()&nbsp;?&gt;/pix/big_logo.gif\&quot;&nbsp;width=\&quot;300\&quot;&nbsp;
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height=\&quot;100\&quot;&nbsp;alt=\&quot;mycompany\&quot;&nbsp;title=\&quot;mycompany\&quot;&nbsp;id=\&quot;logo\&quot;&nbsp;/&gt;&lt;/div&gt;
<br />06:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermenu\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$menu&nbsp;?&gt;&lt;/div&gt;
<br />07:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
<br />08:&nbsp;&lt;?php&nbsp;}&nbsp;else&nbsp;if&nbsp;($heading)&nbsp;{&nbsp;&nbsp;
<br />09:&nbsp;//&nbsp;This&nbsp;is&nbsp;what&nbsp;gets&nbsp;printed&nbsp;on&nbsp;any&nbsp;other&nbsp;page&nbsp;with&nbsp;a&nbsp;heading&nbsp;
<br />10:&nbsp;?&gt;
<br />11:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header\&quot;&gt;
<br />12:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermain\&quot;&gt;&lt;img&nbsp;src=\&quot;&lt;?php&nbsp;echo
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$CFG-&gt;wwwroot.\'/theme/\'.current_theme()&nbsp;?&gt;/pix/small_logo.gif\&quot;&nbsp;width=\&quot;210\&quot;&nbsp;
<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;height=\&quot;70\&quot;&nbsp;alt=\&quot;mycompany\&quot;&nbsp;title=\&quot;mycompany\&quot;&nbsp;id=\&quot;logo\&quot;&nbsp;/&gt;&lt;/div&gt;
<br />13:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermenu\&quot;&gt;&lt;?php&nbsp;echo&nbsp;$menu&nbsp;?&gt;&lt;/div&gt;
<br />14:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
<br />15:&nbsp;&lt;?php&nbsp;}&nbsp;?&gt;
</div>
 
Moodle offers one header for all pages and a different header for the front/home page. You may, for example, make the header for your front page higher and place a bigger logo on it.
 
The logo position in the page header is defined in the CSS file ''styles_layout.css''. Please change the values for the CLASS <code>.headermain</code> and eventually for the IDs <code>#header</code> and <code>#header-home</code> if needed. You can find the definitions in the section header of the CSS file.
 
'''A tip for a fast jump to the header section of the CSS file:''' Select and copy the word "header" in the section list at the beginning of the file. Then call find in your program and paste "header" into the search dialogue. After you click "find" in your dialogue your program will find the start of the header section.
 
{{Scrapbook}}
[[Category:Administrator]]
[[Category:Developer]]
[[Category:Themes]]

Latest revision as of 07:21, 22 June 2011

This development related page is now located in the Dev docs.

See the Header logo page in the Dev docs.

Retrieved from "https://docs.moodle.org/20/en/index.php?title=Header_logo&oldid=85368"
Powered by MediaWiki