Aquesta pàgina forma part de la documentació de Moodle en català, tot i que no ha estat traduïda encara. Podeu contribuir obertament a les tasques de traducció. Podeu consultar la Guia d'edició de la documentació i també participar ens els debats del fòrum de traductors de la documentació a moodle.org

Header logo: diferència entre les revisions

De MoodleDocs
Salta a:navegació, cerca
m (code formatting)
m (formatting revert)
Línia 3: Línia 3:
In the file ''header.html'' you see the following lines (or similar):
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;">
<pre>
01:&nbsp;&lt;?php&nbsp;if&nbsp;($home)&nbsp;{&nbsp;&nbsp;
01: <?php if ($home) {
<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;
02: // This is what gets printed on the home page only
<br />03:&nbsp;?&gt;
03: ?>
<br />04:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header-home\&quot;&gt;
04:   <div id="header-home">
<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;
05:     <div class="headermain"><?php echo $heading ?></div>
<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;
06:     <div class="headermenu"><?php echo $menu ?></div>
<br />07:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
07:   </div>
<br />08:&nbsp;&lt;?php&nbsp;}&nbsp;else&nbsp;if&nbsp;($heading)&nbsp;{&nbsp;&nbsp;
08: <?php } else if ($heading) {
<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;
09: // This is what gets printed on any other page with a heading  
<br />10:&nbsp;?&gt;
10: ?>
<br />11:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header\&quot;&gt;
11:   <div id="header">
<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;
12:     <div class="headermain"><?php echo $heading ?></div>
<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;
13:     <div class="headermenu"><?php echo $menu ?></div>
<br />14:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
14:   </div>
<br />15:&nbsp;&lt;?php&nbsp;}&nbsp;?&gt;
15: <?php } ?>
</div>
</pre>


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.
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;">
<pre>
01:&nbsp;&lt;?php&nbsp;if&nbsp;($home)&nbsp;{&nbsp;&nbsp;
01: <?php if ($home) {
<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;
02: // This is what gets printed on the home page only
<br />03:&nbsp;?&gt;
03: ?>
<br />04:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header-home\&quot;&gt;
04:   <div id="header-home">
<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;
05:     <div class="headermain"><img src="<?php echo  
<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;
        $CFG->wwwroot.'/theme/'.current_theme() ?>/pix/big_logo.gif" width="300"
<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;
        height="100" alt="mycompany" title="mycompany" id="logo" /></div>
<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;
06:     <div class="headermenu"><?php echo $menu ?></div>
<br />07:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
07:   </div>
<br />08:&nbsp;&lt;?php&nbsp;}&nbsp;else&nbsp;if&nbsp;($heading)&nbsp;{&nbsp;&nbsp;
08: <?php } else if ($heading) {
<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;
09: // This is what gets printed on any other page with a heading  
<br />10:&nbsp;?&gt;
10: ?>
<br />11:&nbsp;&nbsp;&nbsp;&lt;div&nbsp;id=\&quot;header\&quot;&gt;
11:   <div id="header">
<br />12:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=\&quot;headermain\&quot;&gt;&lt;img&nbsp;src=\&quot;&lt;?php&nbsp;echo
12:     <div class="headermain"><img src="<?php 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;
        $CFG->wwwroot.'/theme/'.current_theme() ?>/pix/small_logo.gif" width="210"
<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;
        height="70" alt="mycompany" title="mycompany" id="logo" /></div>
<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;
13:     <div class="headermenu"><?php echo $menu ?></div>
<br />14:&nbsp;&nbsp;&nbsp;&lt;/div&gt;
14:   </div>
<br />15:&nbsp;&lt;?php&nbsp;}&nbsp;?&gt;
15: <?php } ?>
</div>
</pre>


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.
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.

Revisió del 17:43, 11 feb 2006

To show your logo in the page header, the file header.html in your theme folder requires editing.

In the file header.html you see the following lines (or similar):

01: <?php if ($home) {  
02: // This is what gets printed on the home page only  
03: ?>
04:   <div id="header-home">
05:     <div class="headermain"><?php echo $heading ?></div>
06:     <div class="headermenu"><?php echo $menu ?></div>
07:   </div>
08: <?php } else if ($heading) {  
09: // This is what gets printed on any other page with a heading 
10: ?>
11:   <div id="header">
12:     <div class="headermain"><?php echo $heading ?></div>
13:     <div class="headermenu"><?php echo $menu ?></div>
14:   </div>
15: <?php } ?>

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.

01: <?php if ($home) {  
02: // This is what gets printed on the home page only  
03: ?>
04:   <div id="header-home">
05:     <div class="headermain"><img src="<?php echo 
        $CFG->wwwroot.'/theme/'.current_theme() ?>/pix/big_logo.gif" width="300" 
        height="100" alt="mycompany" title="mycompany" id="logo" /></div>
06:     <div class="headermenu"><?php echo $menu ?></div>
07:   </div>
08: <?php } else if ($heading) {  
09: // This is what gets printed on any other page with a heading 
10: ?>
11:   <div id="header">
12:     <div class="headermain"><img src="<?php echo
        $CFG->wwwroot.'/theme/'.current_theme() ?>/pix/small_logo.gif" width="210" 
        height="70" alt="mycompany" title="mycompany" id="logo" /></div>
13:     <div class="headermenu"><?php echo $menu ?></div>
14:   </div>
15: <?php } ?>

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 .headermain and eventually for the IDs #header and #header-home 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.