在We.Retail中試用互動式版面

所有We.Retail頁面都使用「版面容器」元件來建置自適應設計。 版面容器提供段落系統,可讓您將元件定位在回應式格線中。 此格線可根據裝置/視窗大小和格式重新排列版面。 此元件與頁面編輯器中的​Layout​模式搭配使用,可讓您根據裝置建立和編輯回應式版面。

試用

  1. 在語言主要分支的「體驗」區段中編輯「北極衝浪」頁面。

    http://localhost:4502/editor.html/content/we-retail/language-masters/en/experience/arctic-surfing-in-lofoten.html

  2. 切換至​預覽​以檢視該頁面對網站訪客的呈現效果。 向下捲動至文章​Aloha spirits in Norwher Norway​的內容。

    chlimage_1-178

  3. 調整瀏覽器視窗大小,並隨著版面動態適應調整大小而觀看影片。

    chlimage_1-179

  4. 切換至「版面」模式。 模擬器工具列會自動顯示,讓您依目標裝置規劃版面配置。

    選取元件會在編輯選單中顯示浮動和隱藏選項,以及調整元件控制點大小。

    chlimage_1-180

  5. 抓取並拖曳元件的大小調整控制代碼會自動顯示版面格線,以協助您調整大小。

    chlimage_1-181

更多資訊

如需詳細資訊,請參閱編寫檔案回應式版面或管理員檔案設定版面容器和版面模式,以取得完整的技術詳細資訊。

本頁內容