Php if no image do bootstrap colulmn col-md-12
This is my first post, but I've used this site a lot in the past. I'm a php newbie but I'm goof with bootstrap, html, css and Joomla.
I am using K2 in Joomla and I need to change the layout of a K2 category item (example here: www.caravanningoz.com.au/news)
At the moment I have an image set to the left with bootstrap 3 col-md-5 And then the introductory text to the right of the image is set with col-md-7.
The problem I am (I'm sure many can tell already) is that if the image is not loaded then there should be a big white space on the left where the image should be.
I want to be able to use some php code to say "if there is no image, then set to remove the image col-md-5 and do the introtext col-md-12 (so that it matches the entire column).
here is most of the code from the k2 category php file:
<div class="row">
<div class="catItemView group<?php echo ucfirst($this->item->itemGroup); ?><?php echo ($this->item->featured) ? ' catItemIsFeatured' : ''; ?><?php if($this->item->params->get('pageclass_sfx')) echo ' '.$this->item->params->get('pageclass_sfx'); ?>">
<div class="catItemImage left col-md-5 col-sm-5">
<?php if($this->item->params->get('catItemImage') && !empty($this->item->image)): ?>
<!-- Item Image -->
<a class="categoryItemImage" href="<?php echo $this->item->link; ?>" title="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>">
<div class=" grow-up drop-shadow">
<img class="img-responsive caption" src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
</div>
</a>
<?php endif; ?>
</div>
<div class="catItemContent right col-md-7 col-sm-7">
<!-- Plugins: BeforeDisplay -->
<?php echo $this->item->event->BeforeDisplay; ?>
<!-- K2 Plugins: K2BeforeDisplay -->
<?php echo $this->item->event->K2BeforeDisplay; ?>
<?php if($this->item->params->get('catItemTitle')): ?>
<!-- Item title -->
<h3 class="catItemTitle">
<?php if(isset($this->item->editLink)): ?>
<!-- Item edit link -->
<span class="catItemEditLink">
<a class="modal" rel="{handler:'iframe',size:{x:990,y:550}}" href="<?php echo $this->item->editLink; ?>">
<?php echo JText::_('K2_EDIT_ITEM'); ?>
</a>
</span>
<?php endif; ?>
<?php if ($this->item->params->get('catItemTitleLinked')): ?>
<a href="<?php echo $this->item->link; ?>">
<?php echo $this->item->title; ?>
</a>
<?php else: ?>
<?php echo $this->item->title; ?>
<?php endif; ?>
<?php if($this->item->params->get('catItemFeaturedNotice') && $this->item->featured): ?>
<!-- Featured flag -->
<span>
<sup>
<?php echo JText::_('K2_FEATURED'); ?>
</sup>
</span>
<?php endif; ?>
</h3>
<?php endif; ?>
<?php if($this->item->params->get('catItemAuthor')): ?>
<!-- Item Author -->
<span class="catItemAuthor">
<?php echo K2HelperUtilities::writtenBy($this->item->author->profile->gender); ?>
<?php if(isset($this->item->author->link) && $this->item->author->link): ?>
<a rel="author" href="<?php echo $this->item->author->link; ?>"><?php echo $this->item->author->name; ?></a>
<?php else: ?>
<?php echo $this->item->author->name; ?>
<?php endif; ?>
</span>
<?php endif; ?>
<div class="clr"></div>
<div>
<?php if($this->item->params->get('catItemDateCreated')): ?>
<!-- Date created -->
<span class="catItemDateCreated">
<?php echo JHTML::_('date', $this->item->created , JText::_('DATE_FORMAT_LC3')); ?>
</span>
<?php endif; ?>
<?php if($this->item->params->get('catItemCategory')): ?>
<!-- Item category name -->
<span class="catItemCategory">
<span><?php echo JText::_('K2_PUBLISHED_IN'); ?></span>
<a href="<?php echo $this->item->category->link; ?>"><?php echo $this->item->category->name; ?></a>
</span>
<?php endif; ?>
</div>
source to share
There is already an instruction if
to check if an image exists, so all you have to do is put your container div inside, like so:
<?php if($this->item->params->get('catItemImage') && !empty($this->item->image)) { ?>
<!-- Item Image -->
<div class="catItemImage left col-md-5 col-sm-5">
<a class="categoryItemImage" href="<?php echo $this->item->link; ?>" title="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>">
<div class=" grow-up drop-shadow">
<img class="img-responsive caption" src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
</div>
</a>
</div>
<div class="catItemContent right col-md-7 col-sm-7">
<?php } else { ?>
<div class="catItemContent right col-md-12">
<?php } ?>
source to share