板塊及外貌板塊

什麼是板塊?

I'MWEB是由頁面(菜單)內有板塊,板塊內有widget的形式構成的。 如下圖所示,將頁面內的區域分成多個板塊,每個板塊都能營造出不同的氣氛。

添加板塊

添加外觀板塊或提前構成的板塊
  1. 點擊左上方工具欄的添加板塊鍵。
  2. 點擊想要的板塊類型的預覽圖片。
  3. 板塊添加至最後一頁。

在內容,成員,聯絡分類裡能通過經常使用的版面設計添加預先構成的板塊。

添加空白板塊及移動板塊

想要添加一個沒有widget的空白板塊或移動板塊時,在板塊領域中按鼠標右鍵。 (因爲識別widget領域為優先領域,所以請點擊沒有widget的邊緣領域)

當板塊向上或下移動時,以板塊爲單位逐間移動。不能移動至高於上端或低於下端的位置。

板塊也能像widget一樣複製或粘貼。 複製/粘貼已製作好的板塊設計,可大大減少重複的工作。

板塊設置

可通過板塊設置控制板塊的背景色,背景圖片,間隙及各種效果。

  1. 背景圖片/視頻設置方法 : 放置鼠標在板塊的上端灰色部分,即可用尋找圖片按鈕上傳圖片或以YouTube視頻爲背景設定。
  2. 背景-圖片 : 選擇上傳的背景圖片顯示方法。 由9格構成的方形按鈕設置顯示圖片的標準位置
  3. 背景-背景色 : 指定背景色。 有上傳的圖片時將會重疊到圖片上,因此想要與圖片一起使用請調整透明度。
  4. 背景-文本 : 設置板塊顯示的基本文本顏色。 若空出此值,將會遵循共同設計設定的文本顏色。
  5. 黑白圖片 : 採用黑白處理上傳的背景圖片。
  6. 固定背景圖片 : 即使滑動,背景將會在固定位置顯示。
  7. 鼠標指針動作 : 隨着鼠標指針的移動,背景圖像也會移動。
  8. 間隙-上下空白,左右空白 : 設置板塊的內側空白。
  9. 網格間隔 : 通過解除默認網格間隙選項和調整網格上下及左右間隙,可在相應板塊中不遵循共同設計設定的網格間隙也能調整網格間隙。
  10. 橫向100%擴展 : 將板塊的正文領域擴展至瀏覽器大小。
  11. 側邊 : 若要在左側或右側插入側邊菜單時,選擇分割形狀的圖標。 可調整側邊領域的寬度,側邊領域和正文領域之間的間隙。

外觀板塊

以幻燈片方式運行的外觀板塊中適合顯示網站代表性的個性或重要資訊。

有2個以上的幻燈片時,轉換成下一個幻燈片的情況下將會產生Fade, Slide等轉換效果。 但只插入1個幻燈片時,不會發生該轉換效果。

適合當作外觀板塊的背景圖片是?

外觀板塊內的背景圖片以瀏覽器的橫向寬度爲準全面顯示。 外觀板塊可使用鼠標拖拉下端的末端調節高度,但根據瀏覽器橫向寬度原版圖片的上下或左右部分可能發生剪裁現象。因此選擇背景圖片時,請留下四週一定的空間。

用戶機器的屏幕大小非常多樣,外觀板塊中使用的圖片在手機中也照樣使用。因此,即使在PC上能完全顯示包含文本的圖片或集中於特定人物或產品的照片,但在其他機器環境中可能會發生剪裁現象(如下圖所示)。

  • 文本通過外觀板塊中輸入文本的方式表達。
  • 選擇集中於風景,圖案,特定事物的圖片。

秘訣:若想要在所有機器上顯示保持相同比例的圖片時,請使用圖片widget或畫廊widget。

返回列表

不知從何開始?

Web So Easy!

前往線上教學

用過一次就愛上 “我”就是 Imweb 的忠實粉絲

在 Imweb 盡情表達“我”的想法
1M
累積網站架設數
全球已有數十萬名用戶
在 Imweb 表達著自己的理念
315
平均每日架站數
每天有多個新品牌
在 Imweb 推出客製化網站
2.5K
全球合作夥伴數

Imweb 企業合作