3

I have a website with a special background-images on the article=home and a different background-image on all other articles. I use the following code in the template index.php:

<?php
$active = Jfactory::getApplication()->getMenu()->getActive();

if ($active->alias == 'home') {
?>
<style type="text/css">
<!--
body {
    background-image: url(http://mywebsite.com/templates/img/page_home.jpeg);}
-->
</style>
<?php } else { ?>
<style type="text/css">
<!--
    background-image: url(http://mywebsite.com/templates/img/page_others.jpeg);}
-->
</style>

It's working fine on Desktops. As soon the as the monitor width is smaller than specified in ".css @media" and the responsive Menu-Button is activ then the ...->getMenu()->getActive(); is not anymore saying the "$active->alias". How can i ask the responseive Menu alias?

  • Please could you format your code as there's a lot missing – Lodder Feb 21 '16 at 18:18
2

Future template updates will likely undo your template index.php file edits.

A better way to do this (and probably worth a try if your initial method is not working consistently) is to edit your home page menu item and add a Page Class e.g. home-page under the "Page Display" tab:

Page Class

You can then use the home-page CSS selector in your custom CSS file to override the page background for the Home Page:

body {
  background-image: url(http://mywebsite.com/templates/img/page_home.jpeg);
}
.home-page
  background-image: url(http://mywebsite.com/templates/img/page_others.jpeg);
}

See https://joomla.stackexchange.com/a/3878/120 for details on how to create a custom CSS file for your template.

  • 2
    Works like a charm. – Solenthaler Feb 22 '16 at 10:34
1

You'd better check if the menu item is default one (i.e. Front page) than checking for home alias which might be easily changed in admin.

<?php  
  $app = JFactory::getApplication();  
  $menu = $app->getMenu();  
  if ($menu->getActive() == $menu->getDefault()) {  
    echo 'This is the front page';  
  }  
?>

I'm sure that default menu item doesn't change with screen width, i.e. stays the same in responsive mode too.

More details can be found on https://docs.joomla.org/How_to_determine_if_the_user_is_viewing_the_front_page

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.