您可以使用影像滑桿模組在同一模組中顯示多個影像。 您可以將影像設定為自動循環播放,也可以支援訪客手動切換影像。
在圖像滑塊模塊中添加和編輯幻燈片
-
前往你的內容:
- 將遊標懸停在內容上,然後點擊「編輯」。
- 在內容編輯器中,按一下左側邊欄的「新 增新增」圖示。
- 按一下以展開「媒體」類別,然後按一下「影像滑桿」模組並將其拖曳到位。
- 在左側邊欄中,將滑鼠遊標懸停在投影片上,然後按一下編輯 編輯圖示,即可將影像新增到該投影片:
- 在「影像」部分,按一下上傳以從電腦中選擇影像,或按一下瀏覽影像以從檔案工具中選擇影像。
- 在「說明」欄位中,輸入將顯示在影像下方的說明。 若要顯示無標題的影像,請刪除預設文字。
- 若要新增投影片連結,請按照以下步驟操作:
- 點擊「連結至」下拉式選單,然後選擇連結類型。
- 在顯示的欄位中指定連結目的地。 深入瞭解如何在HubSpot中使用連結。
- 若要保持內容開啟,並在新視窗中開啟連結,請按一下以切換開啟新視窗中的開啟連結 。
- 若要將連結目的地識別為不屬於搜尋引擎網站,請勾選「否追蹤」核取方塊。
- 按一下套用變更以儲存此投影片的變更。
- 在側邊欄編輯器的頂部,按一下影像滑桿以返回模組概覽。
- 若要新增更多投影片,請將滑鼠遊標懸停在不同的投影片上,然後按一下編輯 編輯圖示。
- 若要完成變更,請按一下套用變更。
編輯圖像滑塊模塊的設置
-
前往你的內容:
- 將遊標懸停在內容上,然後點擊「編輯」。
- 在內容編輯器中,按一下影像滑桿模組。
- 在側邊欄編輯器中,按一下「設定」以編輯模組的設定。
- 按一下以展開「投影片」部分以編輯投影片選項:
- 在「每頁投影片 數」欄位中,輸入一次顯示在影像滑桿中的投影片數。 一次最多可以顯示五張投影片。 當一次選取多張投影片時,將不會顯示說明文字和縮圖。
- 在「影像大小」部分中,選擇長寬比選項。 預設情況下,影像將使用其自身的長寬比顯示。 要標準化整個影像的單一長寬比,請選擇強制長寬比。 這可能會導致某些影像出現扭曲。
- 按一下以展開「移動」部分以編輯投影片轉場選項:
- 要讓投影片在到達最後一張投影片時重複播放,請選擇循環播放投影片核取方塊。
- 要自動循環播放投影片,請選擇自動播放核取方塊。 如果投影片數量少於「每頁投影片數量」設定,則不會發生循環。
- 按一下以展開「導航」部分,編輯導航選項:
- 若要顯示允許訪客在投影片之間手動切換的箭頭,請選取顯示導覽箭頭核取方塊。
- 若要在導覽下方顯示影像縮圖,請勾選顯示縮圖核取方塊。
- 要在影像下方顯示可顯示投影片總數的點,並允許訪客選擇特定影像,請選擇顯示點導航。
- 若要完成變更,請按一下套用變更。
編輯圖片庫模組的樣式
-
前往你的內容:
- 將遊標懸停在內容上,然後點擊「編輯」。
- 在內容編輯器中,按一下影像滑桿模組。
- 在側邊欄編輯器中,按一下「樣式」索引標籤。
- 若要設定影像四角的圓角顯示方式,請按一下投影片,然後按一下以展開「影像」部分。 在角半徑字段中輸入像素值。 數值越高,出現的角落就越圓整。
- 若要在說明文字的上方或下方新增邊距,請按一下以展開「背景」部分,然後在上方的邊距和下方的邊距欄位中輸入像素值。
- 若要為說明文字新增內邊距,請在「內邊距」欄位中輸入像素值 。 要為每側添加單獨的值,請單擊單獨編輯,然後在字段中輸入像素值。
- 若要為說明新增背景顏色,請在「顏色」部分的第一個欄位中輸入 十六進位值,或按一下顏色選擇器並選擇顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要設置背景顏色的透明度,請在「顏色」部分的第二個字段中輸入百分比值。 100%的透明度是不透明的,而0%的透明度是不可見的。
- 若要編輯說明文字的字型,請按一下以展開「文字」部分,然後按一下「選擇字型」下拉式選單並選擇字型。
- 要更改字體大小,請單擊大小下拉菜單並選擇字體大小。
- 要更改字體顏色,請單擊顏色選擇器並選擇一種顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要更改字體粗細,請單擊粗 體、斜體或下劃線文字的粗體字粗細圖標。要編輯影像標題的外觀,請單擊幻燈片,然後單擊標題:
- 要編輯滑塊箭頭的外觀:
- 單擊導航。
- 單擊以展開滑塊箭頭部分。
- 要設置左右圖標的背景顏色,請在「背景顏色」部分的第一個字段中輸入十六進制值,或者單擊顏色選擇器並選擇一種顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要設置背景顏色的透明度,請在「背景顏色」部分的第二個字段中輸入百分比值。 100%的透明度是不透明的,而0%的透明度是不可見的。
- 要替換用於左右箭頭的圖標,請單擊左側圖標和右側圖標字段上方的替換 。 在右側面板中,選取一個圖示。
- 要設置左右圖標的顏色,請在圖標顏色部分的第一個字段中輸入十六進制值,或者單擊顏色選擇器並選擇顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要設置背景顏色的透明度,請在圖標顏色部分的第二個字段中輸入百分比值。 100%的透明度是不透明的,而0%的透明度是不可見的。
- 要更改影像和自動播放按鈕下方的點的外觀:
- 單擊導航。
- 按一下以展開「點和自動播放」按鈕部分。
- 在「顏色」部分的第一個欄位中輸入十六進位值,或單擊顏色選擇器並選擇顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 若要變更縮圖導覽的外觀:
-
- 要設置左右箭頭圖標的背景顏色,請在箭頭背景顏色部分的第一個字段中輸入十六進位值,或者單擊顏色選擇器並選擇一種顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要設置背景顏色的透明度,請在箭頭背景顏色部分的第二個字段中輸入百分比值。 100%的透明度是不透明的,而0%的透明度是不可見的。
- 要替換用於左右箭頭的圖標,請單擊左箭頭圖標和右箭頭圖標字段上方的替換 。 在右側面板中,選取一個圖示。
-
- 要設置左右箭頭圖標的顏色,請在箭頭圖標填充 顏色部分的第一個字段中輸入十六進位值,或者單擊顏色選擇器並選擇顏色。 您可以從「進階」索引標籤新增自訂顏色。
- 要設置箭頭的透明度,請在圖標顏色部分的第二個字段中輸入百分比值。 100%的透明度是不透明的,而0%的透明度是不可見的。
- 按一下以展開「縮圖影像」部分。
- 要設置用於所有略圖影像的寬高比,請單擊寬高比下拉菜單並選擇寬高比。
- 要設置用於所有略圖影像的寬度,請在「寬度」字段中輸入像素值 。
- 要設置略圖影像的圓角顯示方式,請在「半徑」字段中輸入像素值 。 數值越高,出現的角落就越圓整。
- 要編輯滑塊的間距:
- 單擊滑塊。
- 按一下以展開「間距」部分。
- 要添加滑塊上方和下方的邊距,請在上方的邊距和下方的邊距字段中 輸入像素值 。
- 要向滑塊添加填充,請在填充字段中輸入像素值 。 要為每側添加單獨的值,請單擊單獨編輯,然後在字段中輸入像素值。