Custom banner background if attribute is set
Permalink
Hello forum :-)
I’m new to concrete and currently working on customising a theme. Not sure if this is the right forum for my question.
In the CSS file, I have set various classes, which in turn load different background images into the banner, like so:
In the page template, I used to have this code to add a custom class to the banner. However, it only worked if a page attribute called "banner_class" was set.
If the attribute was not set, no banner background image was loaded. I certainly didn’t want to add a default background image to the .banner class to prevent 2 images having too be loaded if the attribute was set.
Instead, I wanted to have a fallback just in case the attribute is left blank and went with this code:
So far, this solution works, but I can’t help and find this solution too complicated and am wondering if I missed something. Could this be done easier? I am running v8.2.1
I’m new to concrete and currently working on customising a theme. Not sure if this is the right forum for my question.
In the CSS file, I have set various classes, which in turn load different background images into the banner, like so:
.default-banner { background-image: url("../images/banner-default.jpg"); background-repeat: repeat; background-position: 0 -400px; } .about-banner { background-image: url("../images/about.jpg"); background-repeat: repeat; background-position: 0 -100px; }
In the page template, I used to have this code to add a custom class to the banner. However, it only worked if a page attribute called "banner_class" was set.
<!-- banner start -->
<!-- ================ -->
<div class="banner <?php echo $c->getCollectionAttributeValue('banner_class')?>">
<div class="fixed-image section dark-translucent-bg">
<div class="container">
<div class="space-top"></div>
<?php
$a = new Area('Page_Title');
$a->display($c);
?>
<div class="separator-2"></div>
<?php
$a = new Area('Banner_content');
$a->display($c);
?>Viewing 15 lines of 19 lines. View entire code block.
If the attribute was not set, no banner background image was loaded. I certainly didn’t want to add a default background image to the .banner class to prevent 2 images having too be loaded if the attribute was set.
Instead, I wanted to have a fallback just in case the attribute is left blank and went with this code:
<?php $banner = $c->getCollectionAttributeValue('banner_class'); if (empty($banner)) { $banner = "default-banner"; } ?> <main> <!-- banner start --> <!-- ================ --> <div class="banner <?php echo $c->getCollectionAttributeValue('banner_class')?>"> <div class="fixed-image section dark-translucent-bg"> <div class="container"> <div class="space-top"></div> <?php $a = new Area('Page_Title');
Viewing 15 lines of 26 lines. View entire code block.
So far, this solution works, but I can’t help and find this solution too complicated and am wondering if I missed something. Could this be done easier? I am running v8.2.1
This line should be like below
That‘s what I have at the moment. Pasted my previous code twice. Sorry for that.
But is that the proper way to do this or is there an easier way than creating several classes and inserting an additional class by using page attributes?
But is that the proper way to do this or is there an easier way than creating several classes and inserting an additional class by using page attributes?
