7-2 templates/op_snews_list.tpl

<div class="row">
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">

        <!-- Wrapper for slides -->
        <div class="carousel-inner" role="listbox">
            <{foreach from=$all_focus key=i item=focus}>
                <div class="item <{if $i==0}>active<{/if}>">
                    <a href="index.php?sn=<{$focus.sn}>">
                        <img src="<{$focus.cover}>" alt="<{$focus.title}>" class="slide-img">
                    </a>
                    <div class="carousel-caption">
                        <h2><{$focus.title}></h2>
                        <{$focus.summary}>
                    </div>
                </div>
            <{/foreach}>
        </div>

        <!-- Controls -->
        <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
</div>

<div class="container">
    <h2>文章列表</h2>
    <div class="row">
        <{foreach from=$all key=i item=snews}>
            <div class="col-sm-4">
                <a href="index.php?sn=<{$snews.sn}>">
                    <div class="new-article top-shadow bottom-shadow">
                        <{if $snews.cover}>
                            <img src="<{$snews.cover}>" alt="<{$snews.title}>" class="cover img-thumbnail">    
                        <{else}>
                            <img src="https://picsum.photos/400/200?image=<{$i}>" alt="<{$snews.title}>" class="cover img-thumbnail">
                        <{/if}>
                        <div class="latest-post">
                            <h4><{$snews.title}></h4>
                        </div>
                        <p><{$snews.summary}></p>
                    </div>
                </a>
                
            </div>  

        <{foreachelse}>
            <div class="alert alert-danger">
                尚無內容
            </div>
        <{/foreach}>
    </div>

    <{$bar}>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $(".slide-img").css('height', $(window).height()-$('.navbar').height());
    });
    $(window).resize(function () {
        $(".slide-img").css('height', $(window).height()-$('.navbar').height());
    });
</script>