bhouseWeb/themes/hugo-lamp/layouts/blog/list.html

{{ define "main" }}
<section class="page-title3 bg-2">
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center">
                <h1>設計專欄</h1>
            </div>
        </div>
    </div>
</section>

<div class="page-wrapper" style="padding-top: 50px;">
    <div class="container">
        <div class="row">
            <div class="col-md-8">
            {{ $paginator := .Paginate .Data.Pages }}
            {{ range $paginator.Pages }}
            <div class="mb-5 post">
                <div class="mb-4">
                    <a href="{{ .RelPermalink }}">
                        <amp-img
                            alt="{{ .Title }}"
                            src="{{ .Params.Image | relURL }}"
                            width="2664"
                            height="956"
                            layout="responsive">
                        </amp-img>
                    </a>
                </div>
                <a href="{{ .RelPermalink }}" style="color:#444444;" data-vars-event="accuhit" data-vars-event-type="6" data-vars-event-col1="{{ .Params.Col1 }}" data-vars-event-col2="{{ .Params.col2 }}" data-vars-event-col4="{{ .Params.title }}">
                    <div class="title-size"><b>{{ .Title }}</b></div>
                </a>
                <p class="blog-content" style="font-size:0.8rem;">{{ .PublishDate.Format "January 2, 2006" }}</p>
                <div class="blog-content">
                    <p class="card-text" style="color:#4D4D4D;">{{ .Summary }}</p>
                    <a href="{{ .RelPermalink }}" class="btn btn-light">繼續閱讀</a>
                </div>
            </div>

            <!-- <div class="mb-5 post">
                <div class="mb-4">
                    <a href="{{ .Permalink }}">
                        <amp-img
                            alt="{{ .Title }}"
                            src="{{ .Params.Image | relURL }}"
                            width="2664"
                            height="956"
                            layout="responsive">
                        </amp-img>
                    </a>
                </div>
                <h3><a href="{{ .Permalink }}" style="color:black;"><b>{{ .Title }}</b></a></h3>
                <p class="blog-content" style="font-size:0.8rem;">{{ .PublishDate.Format "January 2, 2006" }}</p>
                <div class="blog-content">
                    <p>{{ .Summary }}</p>
                    <a href="{{ .Permalink }}" class="btn btn-light">繼續閱讀</a>
                </div>
            </div> -->
            {{ end }}
            
            <!-- pagination -->
            {{ $paginator := .Paginator }}
            {{ $adjacent_links := 2 }}
            {{ $max_links := (add (mul $adjacent_links 2) 1) }}
            {{ $lower_limit := (add $adjacent_links 1) }}
            {{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }}
            {{ if gt $paginator.TotalPages 1 }}
            <nav class="text-center">
                <ul class="pagination post-pagination">
                <!-- Previous page. -->
                {{ if $paginator.HasPrev }}
                    <li>
                        <a href="{{ $paginator.Prev.URL }}" class="page-link">上一頁</a>
                    </li>
                {{ end }}
                <!-- Page numbers. -->
                {{ range $paginator.Pagers }}
                    {{ $.Scratch.Set "page_number_flag" false }}
                    <!-- Advanced page numbers. -->
                    {{ if gt $paginator.TotalPages $max_links }}
                        <!-- Lower limit pages. -->
                        <!-- If the user is on a page which is in the lower limit.  -->
                        {{ if le $paginator.PageNumber $lower_limit }}
                            <!-- If the current loop page is less than max_links. -->
                            {{ if le .PageNumber $max_links }}
                                {{ $.Scratch.Set "page_number_flag" true }}
                            {{ end }}
                            <!-- Upper limit pages. -->
                            <!-- If the user is on a page which is in the upper limit. -->
                        {{ else if ge $paginator.PageNumber $upper_limit }}
                            <!-- If the current loop page is greater than total pages minus $max_links -->
                            {{ if gt .PageNumber (sub $paginator.TotalPages $max_links) }}
                                {{ $.Scratch.Set "page_number_flag" true }}
                            {{ end }}
                            <!-- Middle pages. -->
                        {{ else }}
                            {{ if and ( ge .PageNumber (sub $paginator.PageNumber $adjacent_links) ) ( le .PageNumber (add $paginator.PageNumber $adjacent_links) ) }}
                                {{ $.Scratch.Set "page_number_flag" true }}
                            {{ end }}
                        {{ end }}
                        <!-- Simple page numbers. -->
                    {{ else }}
                        {{ $.Scratch.Set "page_number_flag" true }}
                    {{ end }}
                    <!-- Output page numbers. -->
                    {{ if eq ($.Scratch.Get "page_number_flag") true }}
                    <li class="{{ if eq . $paginator }} active {{ end }}">
                        <a href="{{ .URL }}">
                        {{ .PageNumber }}
                        </a>
                    </li>
                    {{ end }}
                {{ end }}
                <!-- Next page. -->
                {{ if $paginator.HasNext }}
                    <li>
                        <a href="{{ $paginator.Next.URL }}">下一頁</a>
                    </li>
                {{ end }}
                </ul>
            </nav>
            {{ end }}
            </div>
            <div class="col-md-4">
                {{ partial "blog-sidebar.html" . }}
            </div>
        </div>
    </div>
</div>
{{ end }}