如何修改PbootCMS預設麵包屑導航樣式及自定義設定方法

黄文Rex發表於2024-10-04

在PbootCMS中,麵包屑導航是一個重要的導航元素,幫助使用者快速瞭解當前頁面的位置和路徑。為了滿足不同的設計需求,可以透過自定義引數和修改樣式來調整面包屑導航。下面詳細介紹如何進行這些自定義操作。

PbootCMS麵包屑導航呼叫方式

html
{pboot:position}

自定義引數

常用引數說明

  • separator:分隔符,非必填,預設為 >>
  • separatoricon:分割圖示,非必填,如使用圖示字型:separatoricon='fa fa-angle-double-right'
  • indextext:首頁文字,非必填,預設為“首頁”。
  • indexicon:首頁圖示,非必填,如使用圖示字型:indexicon='fa fa-home'

修改樣式

自定義分隔符

html
{pboot:position separator='/'}

此程式碼將麵包屑導航的分隔符改為 /

修改首頁文字

html
{pboot:position indextext='Home'}

此程式碼將首頁文字修改為 Home

其他自定義引數

除了上述兩種情況,還可以嘗試其他引數的自定義,以滿足具體需求:

使用圖示字型

html
{pboot:position separatoricon='fa fa-angle-double-right' indexicon='fa fa-home'}

此程式碼將分隔符圖示改為 fa fa-angle-double-right,並將首頁圖示改為 fa fa-home

相關文章