diff options
| author | Somrat <themefisher.dev@gmail.com> | 2022-02-13 07:04:23 +0300 |
|---|---|---|
| committer | Somrat <themefisher.dev@gmail.com> | 2022-02-13 07:04:23 +0300 |
| commit | 120c1a5f8409fd39a2121e88b82def3da55cc483 (patch) | |
| tree | 1b2430415a55cc17ea26be1e1d0a6eeb9016b58a | |
| parent | 1d842f398e85bab1fd3fd741c1b7b56f1c832bf3 (diff) | |
added pagination for blog posts
| -rw-r--r-- | assets/css/style.css | 35 | ||||
| -rw-r--r-- | exampleSite/config.toml | 11 | ||||
| -rw-r--r-- | layouts/_default/list.html | 6 |
3 files changed, 48 insertions, 4 deletions
diff --git a/assets/css/style.css b/assets/css/style.css index 724dbd2..90c123c 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -1325,4 +1325,37 @@ ul.social-icons li { text-decoration: none; } -/*# sourceMappingURL=maps/style.css.map */ +/* blog */ +.pagination { + justify-content: center; + padding: 30px 0; + margin-bottom: 0; +} + +.pagination .page-item .page-link { + display: inline-block; + width: 42px; + height: 42px; + border-radius: 0; + border: 1px solid #dedede; + text-align: center; + margin: 0 4px; + font-weight: 500; + color: #02bdd5; + padding: 0; + line-height: 41px; + box-shadow: 0 5px 25px rgba(#000, .05); +} + +.pagination .page-item.active .page-link { + background: #02bdd5; + color: #fff; + border-color: #02bdd5; +} + +.pagination .page-item .page-link:focus, +.pagination .page-item .page-link:hover { + box-shadow: none; + background: #02bdd5; + color: #fff; +}
\ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index d6775ad..610387f 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -1,7 +1,9 @@ -baseURL = "https://demo.gethugothemes.com/timer/examplesite/" +baseURL = "https://demo.gethugothemes.com/timer/site/" languageCode = "en-us" title = "Timer | Responsive Multipurpose Bootstrap Hugo Template" theme = "timer-hugo" +# post pagination +paginate = "2" # see https://gohugo.io/extras/pagination/ # We Used Ionicons Icon font for Icon, for more details check this link - https://ionicons.com/ @@ -10,22 +12,27 @@ theme = "timer-hugo" name = "Home" url = "/" weight = 1 + [[menu.main]] name = "About" url = "about/" weight = 2 + [[menu.main]] name = "Service" url = "service/" weight = 3 + [[menu.main]] name = "Gallery" url = "gallery/" weight = 4 + [[menu.main]] name = "Blog" url = "blog/" weight = 5 + [[menu.main]] name = "Contact" url = "contact/" @@ -37,7 +44,7 @@ home = "Home" logo = "images/logo.png" dateFormat = "6 January 2006" # Meta data -description = "Airspace Hugo theme" +description = "Timer Hugo theme" author = "Themefisher" # Google Analitycs googleAnalitycsID = "Your ID" diff --git a/layouts/_default/list.html b/layouts/_default/list.html index db3f67a..2b7e37f 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -6,7 +6,8 @@ <div class="container"> <div class="row"> <div class="col-md-12"> - {{ range .Data.Pages }} + {{ $paginator:= .Paginate .Data.Pages }} + {{ range $paginator.Pages }} <article class="wow fadeInDown" data-wow-delay=".3s" data-wow-duration="500ms"> <div class="blog-post-image"> @@ -38,6 +39,9 @@ </div> </article> {{ end }} + + <!-- pagination --> + {{ template "_internal/pagination.html" . }} </div> </div> </div> |