iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 10
0
自我挑戰組

WordPress 初探 -- 據說是最經典 Avada 主題可以做些什麼呢?系列 第 10

10 - Fusion Builder 內容編輯器 - Columns 欄 編輯選項

  • 分享至 

  • xImage
  •  

本篇為 Avada Fusion Builder
Columns (欄) 編輯功能查找字典
*Columns 是啥? 可見 07 - 開始編輯前,了解下架構跟從哪裡開始

iT30D-WP-D10-1

Columns 欄 編輯選項:

General

  • Column Spacing ( Controls the column spacing between one column to the next )[ Enter any valid CSS unit ]
  • Center Content ( Set to "Yes" to center the content vertically. Equal heights on the parent container must be turned on. )[ Y / N ]
  • Link URL ( Add the URL the column will link to, ex: http://example.com. IMPORTANT: This will disable links on elements inside the column )
  • Link Target [ _self / _blank ]
  • Ignore Equal Heights [ Y / N ]( Choose to ignore equal heights on this column if you are using equal heights on the surrounding container. )
  • Column Visibility [ Small Screen / Medium Screen / Large Screen ]
  • CSS Class
  • CSS ID

Design

  • Border Size
    • Border Color
    • Border Style [ Solid / Dashed / Dotted ]
    • Border Position [ All / Top / Right / Bottom / Left ]
    • Border Radius [ Enter each value with four corners ]
    • Box Shadow [ Y / N ]
      • Box Shadow Position (px為單位,正值陰影在欄的下&右,負值則在上&左)
      • Box Shadow Blur Radius [ 0~100 ]
      • Box Shadow Spread Radius [ -100~100 ]
      • Box Shadow Color ( rgba working )
      • Box Shadow Style [ Outer / Inner ]
    • Padding [ Enter each value with four corners ]
    • Margin ( Leave empty for default value of 0px, 0px )

Animation

  • None
  • Bounce
  • Fade
  • Flash
  • RubberBand
  • Shake
  • Slide
  • Zoom

*動畫部分除了 None 值以外,每個效果選擇後可以分別設定:

  • Direction of Animation [ Top / Right / Bottom / Left / Static ]
  • Speed of Animation [ 0.1-1 ]
  • Offset of Animation ( Controls when the animation should start )
    • Default
    • Top of element hits bottom of viewport
    • Top of element hits middle of viewport
    • Bottom of element enters viewport

上一篇
09 - Fusion Builder 內容編輯器 - Container 行 編輯選項
下一篇
11 - 運用 Library 快速套用 Avada 其他指定樣式在既定版式裡
系列文
WordPress 初探 -- 據說是最經典 Avada 主題可以做些什麼呢?30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言