Inserting a 960pixels image in top of every page of my courses

Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -
Number of replies: 17

It's possible? How can do that?

Thanx in advance

Marco

Average of ratings: -
In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Timothy Takemoto -

Dear Marco
You can add an image to the top of every page of your courses by editing the header.html file in your chosen theme. There are two html page headers inside that file, one for the top page of your site and one for the other pages (there really needs to be a third, for small popups, perhaps). Be sure to change them both.

If you want to add an image to the courses themselves then that is more difficult.

It is not possible to backup/restore functionality to restore an image into the first description of a section since even an empty description is a description, and restore>add to existing course option does not overwrite, it only adds.

It is possible to use backup/restore to restore a label but the "empty description" contains at least a return so the the first label is not at the top of the topic/week.

I used back/restore to add the image file to all my course files and then edited the top descriptor using the html editor.

There is probably a spiffing way of adding an image to all your courses using a mysql command but I have not worked out how to sql into sections yet.

Tim

In reply to Timothy Takemoto

Re: Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -

Hi Tim

this is my header.html file after insert our image:

>>>>>>>>>>>>>>>>>>>>>>BEGIN CODE<<<<<<<<<<<<<<<<<<<<<<<<
<table width="100%" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td align="right" valign="top"><img
          border="0" src="<?php echo $standardlogo ?>"></td>
      <td background="
http://localhost:8081/uevwai/theme/standardlogo/logo_right.jpg" align="right" valign="top"><?php echo $menu ?></td>
    </tr>
  </table>

>>>>>>>>>>>>>>>>>>>>>>END<<<<<<<<<<<<<<<<<<<<<<<<

But only appear in frontpage course page... All other site pages don't show nothing. What's wrong? Thanx in advance for your help.

Marco

In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Samuli Karevaara -
Marco, two things:

1) There are three html tables in the standard header.html: the first one only shows on the home page of your Moodle site, the second shows on other pages and the last defines the "breadcrumbs".

2) If you use "localhost" as the image domain, it will only work while being browsed from the server itself. At client machines the browser interprets the call to download an image from "localhost" as "download from thyself".
In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Jeffery Watkins -

Look for this line:

<?php } else if ($heading) {  // This is what gets printed on any other page with a heading ?>

And insert your image into the html that directly follows.  It will then show on all pages.

 

Also, all of your img tags need to have the correct php code for the images to work on your server.

 

Example:

<IMG SRC="<?php echo "$CFG->wwwroot/theme/$CFG->theme/images/header_01.jpg" ?>" WIDTH=279 HEIGHT=97 ALT="">

Jeff

In reply to Jeffery Watkins

Re: Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -

Very very thanks Samuly and Jeff.. Looks great now! wink But..... hmmm...

once more question, THE big question: say... I have 3(maybe more) images(logo.jpg, logo2.jpg, logo3.jpg,...) and need to show only one that 3 randomly... User enters now shows image 3, refresh that page shows image 1, again 3, again 2, ...

It's possible? Javascript is the answer? Thanx.

Marco

In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Samuli Karevaara -
Marco,

About randomly choosing one of three logos to the header: instead of javascript use php, it works for all browsers as it's done on the server:

Refine Jefferys suggestion and use

<IMG SRC="<?php echo "$CFG->wwwroot/theme/$CFG->theme/images/header_" . rand(1, 3) . ".jpg" ?>" WIDTH=279 HEIGHT=97 ALT="">

Parameters to the rand function specify the min and max numbers you want. It returns integer numbers, so here the pictures are named header_1.jpg, header_2.jpg and header_3.jpg. This way it's not truly random but enough so.
In reply to Samuli Karevaara

Re: Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -

Thanx Jamuli.... Great!!! Look my final header.html with random logos...
For home page:
<?php
srand((double)microtime()*1000000);
$randomico=rand(1,3);
?>
  <table width="960" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td align="right" valign="top"><img border="0" src="<?php echo "$CFG->wwwroot/theme/$CFG->theme/logos/logo"?><?php echo $randomico ?>.jpg"></td>
      <td background="<?php echo "$CFG->wwwroot/theme/$CFG->theme/logos/logo_right"?><?php echo $randomico ?>.jpg" align="right" valign="top"><?php echo $menu ?></td>
    </tr>
  </table>

For all others:
<?php
srand((double)microtime()*1000000);
$randomico2=rand(1,3);
?>
  <table width="960" cellpadding="0" cellspacing="0" border="0" class="header">
    <tr>
      <td align="left" background="<?php echo "$CFG->wwwroot/theme/$CFG->theme/logos/logo"?><?php echo $randomico2 ?>.jpg" valign="top" class="headermain" width="736" height="115"><?php echo $heading?></td>
      <td align="right" background="<?php echo "$CFG->wwwroot/theme/$CFG->theme/logos/logo_right"?><?php echo $randomico2 ?>.jpg" valign="top" class="headermenu"  width="224" height="115"><?php echo $menu ?></td>
    </tr>
  </table>

Thanx all for suggestions...

This is the real example. Please look that and after give us your comments:

http://www.minhaempresanainternet.com/uepvai/

Clicks F5 for refresh and see the random logos....

Thanx once more again.

Marco

In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Simon Reynolds -

Marco,

 

Olha grande, uma idéia fantástica. Eu devo tentar este em meu sitio. Talvez eu devo aprender o php primeiramente? (Eu devo praticar meu português mais smile  )

 

It looks great, a fantastic idea. I must try this out on my site. Maybe I should learn php first?

 

Regards

 

Simon (UK)

In reply to Simon Reynolds

Re: Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -

Hi Simon

thank you. Thanx to Jamuli, Tim and all that good people. Learn php could be very interesting. But I don't have good skills about php. I'm a ColdFusion developer! And a php student for moodle development.

Congratulations for your portuguese skills... ;-P

Best regards

Marco 

In reply to Timothy Takemoto

Re: Inserting a 960pixels image in top of every page of my courses

by Matt Molloy -

Hi Timothy,

I have tried to add an image to the header.html file. I used dreamweaver. When I view the page, all I can see is the place holder where the image should be. I have checked and rechecked the file: The image is on the server, exactly where the html code says it its. When I preview the page in my browser, the image shows, but when I use that theme and navigate to my site, only the placeholder shows.  I must be doing something silly, but can't for the life of me figure it out!

Can you help?

Regards,

Matt

In reply to Matt Molloy

Re: Inserting a 960pixels image in top of every page of my courses

by Chardelle Busch -
Picture of Core developers

Hi Matt,

You haven't given enough information, but the following scenarios should cover it.  The main thing is to remember a / before the link, then just follow the path to your image.

1.  If the image is in a folder in Moodle, for example, your theme folder is a good place to put it, AND Moodle is installed as the main folder.  Then, your image link should be:   /theme/"name of your theme folder"/"name of your image" e.g. /theme/standard/logo.gif

2.  If you have Moodle installed along with other folders (in other words if you link to it from a CMS, etc.) then you will need to add the Moodle folder name: /moodle/theme/etc.

3.  If you have your image in another folder not in Moodle (e.g. the Dreamweaver assets folder) then just link to that folder: /assets/"your image"

In reply to Chardelle Busch

Re: Inserting a 960pixels image in top of every page of my courses

by Matt Molloy -

Hi Chardelle,

Yes, I have the image in the theme folder, and the path name is as you set out. I can see it when I preview the page in a browser, but not when I go to the site, I can only see a place holder. What do you mean by "The main thing is to remember a / before the link...."?

When I use dreamweaver to insert an image, navigate the image and click insert, the code below is what ends up in my header.html:

" valign="top" class="headerhomemain"><?php echo $heading?> <img src="FASLogo-small.jpg" width="100" height="58">

Thanks for your help,

Matt

In reply to Matt Molloy

Re: Inserting a 960pixels image in top of every page of my courses

by Chardelle Busch -
Picture of Core developers
Oh I forgot, in your site configuration >> variables,  check on how you have your slash arguments set.  I have my slash arguments set to the second option: file.php/pic.jpg--which seems to work the best for me-- so for my image links they all begin with the forward slash /.  So, you'll need to change the Dreamweaver code, in your properties window, change the src to an example like one I posted above.  E.g.,  /theme/yourthemefoldername/FASLogo-small.jpg
In reply to Chardelle Busch

Re: Inserting a 960pixels image in top of every page of my courses

by Matt Molloy -

Thanks Chardelle,

Matt

In reply to Marco Antonio

Re: Inserting a 960pixels image in top of every page of my courses

by Amy Bellinger -

You sure you want to do that though, Marco? What about 800x600 folks? 

Myself, I always have my rez set at 1024 and really dislike having to make pages that look OK (i.e, not too Giant Sequoia School of Design), at 800 by 600. But I look around my office and a whole lot of people still view at 800. The trend must be to finer resolutions, but I wonder if there are any stats on it.  It's not a standard environment variable is it? The info would have to be collected in a survey?

In reply to Amy Bellinger

Re: Inserting a 960pixels image in top of every page of my courses

by Marco Antonio -

Thanks Tim and Emy...

I'll be looking header.html file. Emy, that 960px image haves a Logo and description for our school... I get that from our intranet site and don't need change. Only this.

Thanks once more again for the fast and great help...