更新

assets/css/joe.index.scss

@@ -283,4 +283,36 @@
             top: 10px;
         }
     }
+    &.swiper-container-vertical {
+        .swiper-button-next,
+        .swiper-button-prev {
+            display: none;
+        }
+    }
+    .swiper-button-next,
+    .swiper-button-prev {
+        background: rgba(0, 0, 0, 0.1);
+        transition: background 0.35s, right 0.35s, left 0.35s;
+        border-radius: 2px;
+        &:hover {
+            background: rgba(0, 0, 0, 0.25);
+        }
+        &::after {
+            font-size: 20px;
+        }
+    }
+    .swiper-button-next {
+        right: -27px;
+    }
+    .swiper-button-prev {
+        left: -27px;
+    }
+    &:hover {
+        .swiper-button-next {
+            right: 10px;
+        }
+        .swiper-button-prev {
+            left: 10px;
+        }
+    }
 }

assets/js/joe.global.js

@@ -317,6 +317,20 @@ document.addEventListener('DOMContentLoaded', () => {
         });
     }
 
+    /* 切换标签显示不同的标题 */
+    {
+        if (Joe.DOCUMENT_TITLE) {
+            const TITLE = document.title;
+            document.addEventListener('visibilitychange', () => {
+                if (document.visibilityState === 'hidden') {
+                    document.title = Joe.DOCUMENT_TITLE;
+                } else {
+                    document.title = TITLE;
+                }
+            });
+        }
+    }
+
     /* 懒加载 */
     new LazyLoad('.lazyload');
 

assets/js/joe.index.js

@@ -1,39 +1,50 @@
 /* 首页需要用到的JS */
-console.time("Index.js执行时长")
+console.time('Index.js执行时长');
 document.addEventListener('DOMContentLoaded', () => {
     /* 激活轮播图功能 */
     {
         if ($('.joe_index__banner .swiper-container').length !== 0) {
-			let direction = 'horizontal'
+            let direction = 'horizontal';
-			if (!Joe.IS_MOBILE && $('.joe_index__banner-recommend .item').length === 2) direction = 'vertical'
+            if (!Joe.IS_MOBILE && $('.joe_index__banner-recommend .item').length === 2) direction = 'vertical';
-			new Swiper('.swiper-container', { keyboard: true, direction, loop: true, autoplay: true, mousewheel: true, pagination: { el: '.swiper-pagination' } })
+            new Swiper('.swiper-container', {
+                keyboard: true,
+                direction,
+                loop: true,
+                autoplay: true,
+                mousewheel: true,
+                pagination: { el: '.swiper-pagination' },
+                navigation: {
+                    nextEl: '.swiper-button-next',
+                    prevEl: '.swiper-button-prev'
+                }
+            });
         }
     }
 
     /* 初始化首页列表功能 */
     {
-		let queryData = { page: 1, pageSize: 12, type: 'created' }
+        let queryData = { page: 1, pageSize: 12, type: 'created' };
         const initDom = () => {
-			$('.joe_index__list .joe_list').html('')
+            $('.joe_index__list .joe_list').html('');
-			let activeItem = $('.joe_index__title-title .item[data-type="' + queryData.type + '"]')
+            let activeItem = $('.joe_index__title-title .item[data-type="' + queryData.type + '"]');
-			let activeLine = $('.joe_index__title-title .line')
+            let activeLine = $('.joe_index__title-title .line');
-			activeItem.addClass('active').siblings().removeClass('active')
+            activeItem.addClass('active').siblings().removeClass('active');
-			activeLine.css({ left: activeItem.position().left, width: activeItem.width() })
+            activeLine.css({ left: activeItem.position().left, width: activeItem.width() });
-		}
+        };
         const pushDom = () => {
             return new Promise((reslove, reject) => {
-				$('.joe_load').attr('loading', true)
+                $('.joe_load').attr('loading', true);
-				$('.joe_load').html('加载中')
+                $('.joe_load').html('加载中');
-				$('.joe_index__list .joe_list__loading').show()
+                $('.joe_index__list .joe_list__loading').show();
                 $.ajax({
                     url: Joe.BASE_API,
                     type: 'POST',
                     data: { routeType: 'publish_list', page: queryData.page, pageSize: queryData.pageSize, type: queryData.type },
                     success(res) {
                         if (res.data.length === 0) {
-							$('.joe_load').remove()
+                            $('.joe_load').remove();
-							$('.joe_index__list .joe_list__loading').hide()
+                            $('.joe_index__list .joe_list__loading').hide();
-							return
+                            return;
                         }
                         res.data.forEach(_ => {
                             $('.joe_index__list .joe_list').append(`
@@ -49,6 +60,7 @@ document.addEventListener('DOMContentLoaded', () => {
                                     </a>
                                     <div class="information">
                                         <a href="${_.permalink}" class="title" title="${_.title}">
+                                            <span class="badge" style="display: ${_.type === 'sticky' ? 'block' : 'none'}">置顶</span>
                                             <h6>${_.title}</h6>
                                         </a>
                                         <a class="abstract" href="${_.permalink}" title="文章摘要">${_.abstract}</a>
@@ -68,41 +80,41 @@ document.addEventListener('DOMContentLoaded', () => {
                                         </div>
                                     </div>
                                 </li>
-                            `)
+                            `);
-						})
+                        });
-						$('.joe_load').removeAttr('loading')
+                        $('.joe_load').removeAttr('loading');
-						$('.joe_load').html('查看更多')
+                        $('.joe_load').html('查看更多');
-						$('.joe_index__list .joe_list__loading').hide()
+                        $('.joe_index__list .joe_list__loading').hide();
-						new LazyLoad('.list_lazyload')
+                        new LazyLoad('.list_lazyload');
-						reslove(res.data.length > 0 ? res.data.length - 1 : 0)
+                        reslove(res.data.length > 0 ? res.data.length - 1 : 0);
                     }
-				})
+                });
-			})
+            });
-		}
+        };
-		initDom()
+        initDom();
-		pushDom()
+        pushDom();
         $('.joe_index__title-title .item').on('click', async function () {
-			if ($(this).attr('data-type') === queryData.type) return
+            if ($(this).attr('data-type') === queryData.type) return;
-			queryData = { page: 1, pageSize: 12, type: $(this).attr('data-type') }
+            queryData = { page: 1, pageSize: 12, type: $(this).attr('data-type') };
-			initDom()
+            initDom();
-			pushDom()
+            pushDom();
-		})
+        });
         $('.joe_load').on('click', async function () {
-			if ($(this).attr('loading')) return
+            if ($(this).attr('loading')) return;
-			queryData.page++
+            queryData.page++;
-			let length = await pushDom()
+            let length = await pushDom();
-			length = $('.joe_index__list .joe_list .joe_list__item').length - length
+            length = $('.joe_index__list .joe_list .joe_list__item').length - length;
-			const queryElement = `.joe_index__list .joe_list .joe_list__item:nth-child(${length})`
+            const queryElement = `.joe_index__list .joe_list .joe_list__item:nth-child(${length})`;
-			const offset = $(queryElement).offset().top - $('.joe_header').height()
+            const offset = $(queryElement).offset().top - $('.joe_header').height();
-			window.scrollTo({ top: offset - 15, behavior: 'smooth' })
+            window.scrollTo({ top: offset - 15, behavior: 'smooth' });
-		})
+        });
     }
 
     /* 激活列表特效 */
     {
-		const wow = $('.joe_index__list').attr('data-wow')
+        const wow = $('.joe_index__list').attr('data-wow');
-		if (wow !== 'off' && wow) new WOW({ boxClass: 'wow', animateClass: `animated ${wow}`, offset: 0, mobile: true, live: true, scrollContainer: null }).init()
+        if (wow !== 'off' && wow) new WOW({ boxClass: 'wow', animateClass: `animated ${wow}`, offset: 0, mobile: true, live: true, scrollContainer: null }).init();
     }
 
-	console.timeEnd("Index.js执行时长")
+    console.timeEnd('Index.js执行时长');
-})
+});

core/api.php

@@ -32,6 +32,28 @@ function _getPost($self)
     $pageSize = $self->request->pageSize;
     $type = $self->request->type;
     $result = [];
+    /* 增加置顶文章功能，通过JS判断（如果你想添加其他标签的话，请先看置顶如何实现的） */
+    $sticky_text = Helper::options()->JIndexSticky;
+    if ($sticky_text && $page == 1) {
+        $sticky_arr = explode("||", $sticky_text);
+        foreach ($sticky_arr as $cid) {
+            $self->widget('Widget_Archive@' . $cid, 'pageSize=1&type=post', 'cid=' . $cid)->to($item);
+            $result[] = array(
+                "image" => _getThumbnail($item, false),
+                "time" => date('Y-m-d', $item->created),
+                "created" => date('Y年m月d日', $item->created),
+                "title" => $item->title,
+                "abstract" => _getAbstract($item, false),
+                "category" => $item->categories,
+                "views" => _getViews($item, false),
+                "commentsNum" => number_format($item->commentsNum),
+                "agree" => _getAgree($item, false),
+                "permalink" => $item->permalink,
+                "lazyload" => _getLazyload(false),
+                "type" => "sticky"
+            );
+        }
+    }
     $self->widget('Widget_Contents_Sort', 'page=' . $page . '&pageSize=' . $pageSize . '&type=' . $type)->to($item);
     while ($item->next()) {
         $result[] = array(
@@ -45,7 +67,8 @@ function _getPost($self)
             "commentsNum" => number_format($item->commentsNum),
             "agree" => _getAgree($item, false),
             "permalink" => $item->permalink,
-            "lazyload" => _getLazyload(false)
+            "lazyload" => _getLazyload(false),
+            "type" => "normal"
         );
     };
     $self->response->throwJson(array("data" => $result));
@@ -145,4 +168,3 @@ function _pushRecord($self)
     $result = curl_exec($ch);
     $self->response->throwJson(json_decode($result));
 }
-

functions.php

@@ -204,7 +204,6 @@ function themeConfig($form)
     $JFooter_Right->setAttribute('class', 'joe_content joe_global');
     $form->addInput($JFooter_Right);
 
-    /* Live2d */
     $JLive2d = new Typecho_Widget_Helper_Form_Element_Select(
         'JLive2d',
         array(
@@ -244,6 +243,16 @@ function themeConfig($form)
     $JLive2d->setAttribute('class', 'joe_content joe_global');
     $form->addInput($JLive2d->multiMode());
 
+    $JDocumentTitle = new Typecho_Widget_Helper_Form_Element_Text(
+        'JDocumentTitle',
+        NULL,
+        NULL,
+        '网页被隐藏时显示的标题',
+        '介绍：在PC端切换网页标签时，网站标题显示的内容。如果不填写，则默认不开启'
+    );
+    $JDocumentTitle->setAttribute('class', 'joe_content joe_global');
+    $form->addInput($JDocumentTitle);
+
     $JAside = new Typecho_Widget_Helper_Form_Element_Checkbox(
         'JAside',
         array(
@@ -536,7 +545,7 @@ function themeConfig($form)
     $JIndex_Carousel->setAttribute('class', 'joe_content joe_index');
     $form->addInput($JIndex_Carousel);
 
-    $JIndex_Recommend = new Typecho_Widget_Helper_Form_Element_Textarea(
+    $JIndex_Recommend = new Typecho_Widget_Helper_Form_Element_Text(
         'JIndex_Recommend',
         NULL,
         NULL,
@@ -549,6 +558,18 @@ function themeConfig($form)
     $JIndex_Recommend->setAttribute('class', 'joe_content joe_index');
     $form->addInput($JIndex_Recommend);
 
+    $JIndexSticky = new Typecho_Widget_Helper_Form_Element_Text(
+        'JIndexSticky',
+        NULL,
+        NULL,
+        '首页置顶文章（非必填）',
+        '介绍：请务必填写正确的格式 <br />
+         格式：文章的ID || 文章的ID || 文章的ID （中间使用两个竖杠分隔）<br />
+         例如：1 || 2 || 3'
+    );
+    $JIndexSticky->setAttribute('class', 'joe_content joe_index');
+    $form->addInput($JIndexSticky);
+
     $JIndex_Hot = new Typecho_Widget_Helper_Form_Element_Radio(
         'JIndex_Hot',
         array('off' => '关闭（默认）', 'on' => '开启'),

index.php

@@ -64,6 +64,8 @@
                                         <?php endforeach; ?>
                                     </div>
                                     <div class="swiper-pagination"></div>
+                                    <div class="swiper-button-next"></div>
+                                    <div class="swiper-button-prev"></div>
                                 </div>
                             <?php endif; ?>
                             <?php if (sizeof($recommend) === 2) : ?>

public/include.php

@@ -8,6 +8,7 @@
         WALLPAPER_BACKGROUND_PC: '<?php $this->options->JWallpaper_Background_PC() ?>',
         IS_MOBILE: /windows phone|iphone|android/gi.test(window.navigator.userAgent),
         BAIDU_PUSH: <?php echo $this->options->JBaiduToken ? 'true' : 'false' ?>,
+        DOCUMENT_TITLE: '<?php $this->options->JDocumentTitle() ?>',
         encryption: str => window.btoa(unescape(encodeURIComponent(str))),
         decrypt: str => decodeURIComponent(escape(window.atob(str))),
         changeURLArg: function(url, arg, arg_val) {