twitter-bootstrap - php 如果没有图像使 Bootstrap 列 col-md-12

Question

这是我的第一篇文章，但我过去经常使用这个网站。我是一个 php 新手，但我对 bootstrap、html、css 和 Joomla 很着迷。

我在 Joomla 中使用 K2，我需要更改 K2 类别项目布局(此处示例:www.caravanningoz.com.au/news)

目前，我将图像设置为左侧的 bootstrap 3 col-md-5，然后图像右侧的介绍文本设置为 col-md-7。

我遇到的问题(我相信很多人已经知道)是如果没有上传图片，那么左边应该有图片的地方会有一个很大的空白区域。

我希望能够使用一些 php 代码来表示“如果没有图像，则设置删除图像 col-md-5 并制作 introtext col-md-12(因此它适合整个列) .

这里是 k2 类别项目布局 php 文件中的大部分代码:

<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>

Answer 1

将其放在您发布的脚本的顶部:

<?php
    if(!empty($this->item->image)) {
        $class = "col-md-5 col-sm-5";
    } else {
        $class = "col-md-12 col-sm-12";
    }
?>

现在您可以使用 $class 代替“col-md-7 col-sm-7”。