Change soon according to the page

Question

Hello. I need the logo of the site to change according to the page the user visits. I have a site made in PHP in which the top is a include. So I thought to change the logo via Javascript.

I put the ID="logo" in img and a ID in the body of the pages that will have a different logo. So I hoped that through the If/Else, checking whether or not ID in the body, the src image if it changed. But it’s not rolling. I’m not a programmer and I got here by searching in Google. rs

Here are my codes:

HTML

<img id="logo" src="<?=$img_dir?>/logo_ultraclimber-resgate.png" alt="Ultra Climber Treinamentos e Serviços" />

JS

<script type="text/javascript">
if ('body[id="treina"]') {
    document.getElementById("logo").src='_include/images/logo_ultraclimber-treinamentos.png';
} if else ('body[id="serv"]') {
    document.getElementById("logo").src='_include/images/logo_ultraclimber-servicos.png';
} else {
    document.getElementById("logo").src='_include/images/logo_ultraclimber-resgate.png';
}

Thanks for the help! =]

Answer 1

Doing this in JS on a PHP site is kind of a "gambiarra". Ideally, you want to solve this in PHP itself.

For example, creating a variable before include:

_{php paginaresgate.}

<?php
   $logo = 'logo_ultraclimber-resgate.png';
   include( '__topo.php' );

   ... resto da pagina

And in the __topo.php you simply exchange the line with the logo hardcoded by something like this, which arrow a variable, or uses the provided by the user:

_{__top.php}

<?php
   ... 
   if ( !isset( $logo ) ) $logo = 'logo_default.png'; // caso não seja setado na página
   echo '<img id="logo" src="'.$img_dir.'/'.$logo.' alt="ultraclimber...">';
   ...

Note that there are many other ways to solve the problem, but this proposal here serves not only for the logo, but also for the <title> of the page, the <alt> image or any other variable data that does not significantly change the top structure.