「「部落格導回官網首頁按鈕」調整」

• 將導回首頁的按鈕擺放在醒目位置，能有效將內容流量導回主網站，有助於引導購買、訂閱或註冊行為

• 當讀者看完文章後，若無明確動線，容易離開網站。加入清晰的「回首頁」按鈕，能協助用戶延伸瀏覽、提升停留時間與互動率

• 適當的首頁導回設計，有助於強化網站內部連結結構，增加搜尋引擎對主網頁的爬蟲權重與權威度，進一步優化整體 SEO 表現





✎ 重點拆解：


一、「「部落格導回官網首頁按鈕」調整語法」設定路徑

二、「「部落格導回官網首頁按鈕」調整語法」






一、「「部落格導回官網首頁按鈕」調整語法」設定路徑


設定路徑：頁面 > 部落格 > CSS自訂。





二、「「部落格導回官網首頁按鈕」調整語法」



\ 注意 /

針對各裝置設定，要自訂不同尺寸。


@media (max-width: 425px) {
    /*0~425 手機 */
    .fixed-top-navbar {
    background: #232323; /* 背景色 預設 #232323 */
    height: 24px;        /* 高度 預設 24px */
    color: #8f9192;  /* 箭頭顏色 預設 #8f9192 */
    font-size: 11px; /* 字體大小 預設 #8f9192 */
    }

    .fixed-top-navbar a, .fixed-top-navbar a:visited {
    color: #8f9192; /* 字體顏色 預設 #8f9192 */
    }
}
@media (min-width: 426px) and (max-width: 768px) {
    /*426~768 平板 */
    .fixed-top-navbar {
    background: #232323; /* 背景色 預設 #232323 */
    height: 24px;        /* 高度 預設 24px */
    color: #8f9192;  /* 箭頭顏色 預設 #8f9192 */
    font-size: 11px; /* 字體大小 預設 #8f9192 */
    }

    .fixed-top-navbar a, .fixed-top-navbar a:visited {
    color: #8f9192; /* 字體顏色 預設 #8f9192 */
    }
}
@media (min-width: 769px) {
    /*769~+∞ 桌機 */
    .fixed-top-navbar {
    background: #232323; /* 背景色 預設 #232323 */
    height: 24px;        /* 高度 預設 24px */
    color: #8f9192;  /* 箭頭顏色 預設 #8f9192 */
    font-size: 11px; /* 字體大小 預設 #8f9192 */
    }

    .fixed-top-navbar a, .fixed-top-navbar a:visited {
    color: #8f9192; /* 字體顏色 預設 #8f9192 */
    }
}


\ 注意 /

不限裝置，自訂同樣尺寸。

.fixed-top-navbar {
    background: #232323; /* 背景色 預設 #232323 */
    height: 24px;        /* 高度 預設 24px */
    color: #8f9192;  /* 箭頭顏色 預設 #8f9192 */
    font-size: 11px; /* 字體大小 預設 #8f9192 */
}

.fixed-top-navbar a, .fixed-top-navbar a:visited {
    color: #8f9192; /* 字體顏色 預設 #8f9192 */
}