8-4 templates/op_snews_focus.tpl

<div class="container">
    <h2>精選文章列表</h2>
    <div id="save_msg"></div>
    <div class="row" id="sort">
        <{foreach from=$all_focus key=i item=snews}>
            <div class="col-sm-4" id="sn_<{$snews.sn}>">
                <a href="index.php?sn=<{$snews.sn}>" style="cursor: move;">
                    <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>
</div>

<script type="text/javascript">
  $(document).ready(function(){
      $('#sort').sortable({ opacity: 0.6, cursor: 'move', update: function() {
          var order = $(this).sortable('serialize');
          $.post('save_sort.php', order, function(theResponse){
              $('#save_msg').html(theResponse);
          });
      }
      });
  });
</script>