These variables were added to the top of the index.php allowing developers to assign the variables to HTML elements, primarily the <body>
tag, and thus applying styling for each individual element in any view.
Here is an example:
Variables:
<?php
$option = $app->input->getCmd('option', '');
$view = $app->input->getCmd('view', '');
$layout = $app->input->getCmd('layout', '');
$task = $app->input->getCmd('task', '');
$itemid = $app->input->getCmd('Itemid', '');
?>
Body Tag:
<body class="site <?php echo $option
. ' view-' . $view
. ($layout ? ' layout-' . $layout : ' no-layout')
. ($task ? ' task-' . $task : ' no-task')
. ($itemid ? ' itemid-' . $itemid : '');
?>">
Now if you view the homepage of my newly installed Joomla site, you will see something like the following markup in your browser inspector:
<body class="site com_content view-category layout-blog no-task itemid-101">
If you go to the Joomla login page, you will see something like this instead:
<body class="site com_users view-login no-layout no-task itemid-115">
Now lets say for a very basic example, you wanted a white background on the homepage but a black background on the login page, you can simply add the following to your CSS file:
body.com_content {
background: #FFF;
}
body.com_users {
background: #000;
}