Question

我正在尝试使用自定义内容短代码插件在循环中使用备用样式设置帖子的样式。有些是这样的。

Example image of post styling using bootstrap col-offset

这就是我正在尝试的

<?php start_short(); ?>
    [loop type=service orderby=date order=ASC]
    <div class="jumbo" style="background-image: url([field image-url]);">
        <div class="blackBG row">
            <div class="col-md-5 col-md-offset-7 BGdark opaque page-block-full wow fadeInRight" data-wow-duration="0.40s" data-wow-delay="0.50s">
                <h1><b class="square BGsec">1</b><small>[field title]</small></h1>
                <p>[content more=true more=... length=200]</p>
                <a class="btn btn-default light" href="[field url]" title="DUX Technology - [field title]">Check Now <i class="fa fa-chevron-circle-right"></i></a>
            </div>
        </div>
    </div>
    [/loop]
    <?php end_short(); ?>

我想要展示的是：

    <div class="jumbo" style="background-image: url([field image-url]);">
        <div class="blackBG row">
            <div class="col-md-5 col-md-offset-7 BGdark opaque page-block-full wow fadeInRight" data-wow-duration="0.40s" data-wow-delay="0.50s">
                <h1><b class="square BGsec">1</b><small>[field title]</small></h1>
                <p>[content more=true more=... length=200]</p>
                <a class="btn btn-default light" href="[field url]" title="DUX Technology - [field title]">Check Now <i class="fa fa-chevron-circle-right"></i></a>
            </div>
        </div>
    </div>
    <div class="jumbo" style="background-image: url([field image-url]);">
        <div class="blackBG row">
            <div class="col-md-5 BGdark opaque page-block-full wow fadeInRight" data-wow-duration="0.40s" data-wow-delay="0.50s">
                <h1><b class="square BGsec">1</b><small>[field title]</small></h1>
                <p>[content more=true more=... length=200]</p>
                <a class="btn btn-default light" href="[field url]" title="DUX Technology - [field title]">Check Now <i class="fa fa-chevron-circle-right"></i></a>
            </div>
        </div>
    </div>
    <div class="jumbo" style="background-image: url([field image-url]);">
        <div class="blackBG row">
            <div class="col-md-5 col-md-offset-7 BGdark opaque page-block-full wow fadeInRight" data-wow-duration="0.40s" data-wow-delay="0.50s">
                <h1><b class="square BGsec">1</b><small>[field title]</small></h1>
                <p>[content more=true more=... length=200]</p>
                <a class="btn btn-default light" href="[field url]" title="DUX Technology - [field title]">Check Now <i class="fa fa-chevron-circle-right"></i></a>
            </div>
        </div>
    </div>

我怎样才能做到这一点？

Answer 1

上面的代码在WordPress中生成一个帖子循环，每个帖子都有一个col-md-offset-7类。

我所做的是使用jQuery even函数从备用帖子中删除类。

$("div.service-post:even").removeClass("col-md-offset-7");

使用自定义内容短代码的WordPress备用样式与bootstrap col-offset

1 个答案: