简体   繁体   中英

Change Thumbnail Image depending on category

I was making this shopping site as a test, but have come across a problem when trying to change the banners at the tops of the page based on the category the user is viewing

This is for a site being run off a seerver on my localhost, not wordpress btw

 <div class="item"> <div class="image"> <img src="assets/images/banners/cat-banner-1.jpg" alt="" class="img-responsive"> </div> <div class="container-fluid"> <div class="caption vertical-top text-left"> <div class="big-text"> <br /> </div> <?php $sql=mysqli_query($con,"select categoryName from category where id='$cid'"); while($row=mysqli_fetch_array($sql)) {?> <div class="excerpt hidden-sm hidden-md"> <?php echo htmlentities($row['categoryName']);?> </div> <?php }?> </div> <.-- /.caption --> </div> <!-- /.container-fluid --> </div>

I tried using PHP to make the banner section responsive like so:

 <div class="image"> <?php if (is_category( 'Entertainment' )): ?><img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-1.jpg"/><?php endif;?> <?php if (is_category( 'Science' )): ?><img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-2.jpg"/><?php endif;?> <?php if (is_category( 'Lifestyle' )): ?><img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-3.jpg"/><?php endif;?> </div>

I realize this was a sloppy way to do it, but was all I could come up with and it still did not work.

What would I have to do to the PHP in order to make the site change banner images for different categories? Is there a way I could also do it perhaps without using PHP?

php

<?php 

if $is_category == 'Entertainment' {

<img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-1.jpg"/>

}else if{ $is_category =='Science' {

<img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-2.jpg"/>

}else{ $is_category =='Lifestyle' {

<img class="round_corners hover-shadow" src="assets/images/banners/cat-banner-3.jpg"/>

}

?>

css

.round_corners { 
some format 
}
.hover-shadow {
some format
} 

html

echo $is_category

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM