維看幫助中心

如何添加區塊?

瀏覽數量:266     作者:本站編輯     發佈時間: 2017-02-10      來源:本站

如何添加區塊?區塊添加方式):

第1步:在頁面上單擊“+”號圖標展開添加區塊的層,如下截圖所示:

添加區塊.png


第2步:所有的區塊都會列在這裡,選擇要添加的一個區塊分類;

添加區塊.jpg


第3步:此時頁面上可以快速選擇區塊,頁面右側既可實時預覽。選擇的這個區塊分類下所有的排版版式都會列出來,單擊選中其中一個,然後單擊點擊右上角“應用按鈕”,頁面立即添加選中的區塊。點擊右上角“取消”,即取消當前操作。

區塊.jpg

區塊添加後效果如下,直接把以下信息替換為自己的信息就可以。

區塊添加效果.jpg


新增多套頁頭區塊 & Banner區塊(2018-12-18更新)

【應用場景】為了讓客戶網站的首屏更美觀,多終端的響應更完美,我們最近重點開發了多套頁頭區塊和Banner區塊,應用在網站頁頭或者頁頭下方首屏區域是再適合不過了。

【應用效果】應用效果如下截圖所示:

1

新增功能:(2018-12-25更新)

1、新增多套頁頭區塊和banner區塊。

【應用場景】為了讓客戶網站的首屏更美觀,多終端的響應更完美,我們最近重點開發了多套頁頭區塊和Banner區塊,應用在網站頁頭或者頁頭下方首屏區域是再適合不過了。

【應用效果】應用效果如下截圖所示:

6


頁頭區塊效果展示二:

7


功能優化:(2019-1-15更新)

1、優化證書展示區塊,添加默認圖片展示,解決了鼠標難以移出區塊的問題,使區塊交互更加合理;

【應用效果】當瀏覽該組件時,若鼠標置於區塊內部,滾動鼠標滾輪則切換展示證書,若鼠標置於區塊外部,滾動鼠標滾輪則繼續向下瀏覽其他內容。應用效果如下截圖所示:

新增區塊


新增功能:(2019-1-25更新)

1、新增高級幻燈片組件文字層的打字機效果;

【應用場景】為了滿足不同用戶的個性化需求,豐富網站的展現效果,我們在高級幻燈片組件的文字層增加了一個“打字機效果”,使得文字可以在幻燈片上逐一展現。

【演示示例】首先添加高級幻燈片組件,添加圖片後點擊編輯按鈕,然後點擊添加文字層,在動畫效果一欄選擇打字機效果,就可以在幻燈片中應用打字機效果了。操作步驟如下:

1

【應用效果】打字機的應用效果如下:

dazijixiaoguo2

2、新增一個首屏區塊;

【應用場景】為了給用戶提供更多樣化的選擇,我們新增了一個首屏區塊用於展示多層級的產品信息,以滿足不同用戶的需要。

【應用效果】區塊左側展示產品的一級分類,當鼠標劃過一級分類時,右側出現二級分類,當鼠標劃過二級分類時,右側出現三級分類。應用效果如下:

2

3.新增兩個文章展示區塊;

【應用場景】此次新增了兩個文章展示區塊,給用戶更加豐富的選擇空間,網站建設越來越稱心如意。

【應用效果】區塊的展示效果如下:

3

4

4.新增一個圖文展示區塊。

【應用場景】增添了一個圖文展示區塊,區塊形式更加多樣化。

【應用效果】區塊的展示效果如下:

5


5.新增多個區塊:(2019-3-28優化)

【應用場景】為了大家的網站可以有多樣化的選擇,我們本次又增加了3個區塊。

【應用效果】本次新增了兩個圖文展示區塊和一個頁腳區塊,各區塊位置和應用效果如下:

1)圖文展示區塊一的位置及應用效果如下圖所示:

圖文展示區塊


2)圖文展示區塊二的位置及應用效果如下圖所示:

圖文展示區塊


3)頁腳區塊的位置及應用效果如下圖所示:

頁腳區塊


6.新增自動輪播圖文展示區塊(2019-4-25優化)

【應用場景】自動輪播圖文展示區塊採用大圖的方式展示產品,使產品細節展示更加到位,同時自動輪播的形式使網頁富於活力,更能夠吸引用戶。

【應用效果】自動輪播圖文展示區塊的應用效果如圖所示:

輪播展示2

7、新增圖文展示區塊;(2019-5-23優化)

【操作方法】點擊添加區塊按鈕後選擇“圖文區塊”,具體新上的兩個區塊見下圖:

新增區塊


【應用效果】新增區塊的展示效果分別如下所示:

區塊一:

變色區塊


區塊二:

區塊2


8、區塊增加“編號”和“標籤”的顯示,並支持搜索;(2019-6-25優化)

【應用場景】為了方便客戶快速識別區塊和搜索區塊,給每個區塊增加一個“編號”和“標籤”,並支持用戶進行搜索。

【操作指導】點擊新增區塊,在左側區塊詳情的搜索欄中輸入區塊“編號”或“標籤”就可以搜索到相應的區塊,如下圖所示:

區塊ID搜索


9、新增查看已有區塊ID功能;(2019-7-23優化)

【應用場景】為了解決在網站編輯頁面中難以查看已添加區塊ID的問題,我們將每個區塊的ID展示出來,方便用戶快速定位區塊ID;
【操作指導】在網站編輯頁面中點擊某一區塊,將光標移動到右側出現的“ID”圖標上即可展示區塊ID,如下圖所示:

查看區塊ID


10、網站的區塊增加切換版本的按鈕;(2019-8-6優化)

【應用場景】為了減少新版本的區塊上線時對用戶網站頁面的影響,我們在舊版本區塊上增加了切換新版本的按鈕,用戶可以選擇是否切換為最新的版本的區塊;

【應用效果】如下圖所示:

區塊版本更換


11、新增圖文展示區塊(2019-11-07優化)

新增若干區塊,以“圖文展示”區塊(ID:5649)為例演示。

【操作指導】進入“編輯網站”界面,點擊添加區塊,輸入本區塊ID5649,點擊“應用”區塊,如下圖所示:

區塊5649-1


點擊區塊圖片中央的“編輯”按鈕,可進行區塊內容編輯,如下圖所示:

區塊5649-2


在彈出的區塊編輯界面中,可進行添加/刪除圖片集操作,也可針對每個圖片進行更換圖片、設置圖片標題、編輯圖片描述、添加圖片鏈接等操作,如下圖所示:

區塊5649-3


【應用效果】如下圖所示:

區塊5649



12、新增圖文展示區塊(2019-11-28優化)


新增若干區塊,以“圖文展示”區塊(ID:6009)為例演示。


【操作指導】進入“編輯網站”界面,點擊添加區塊,輸入本區塊ID6009,點擊“應用”區塊,如下圖所示:

區塊1


點擊區塊圖片中央的“編輯”按鈕,可進行區塊圖文編輯,如下圖所示:

區塊2


在彈出的區塊編輯界面中,可進行添加/刪除圖片集操作,也可針對每個圖片進行替換圖片、編輯圖片、編輯圖片描述、圖片標題、添加圖片鏈接等操作,如下圖所示:

區塊3


【應用效果】如下圖所示:

Untitled




13、新增圖文展示區塊(2020-1-2優化)

新增若干區塊,本次以“產品展示”區塊(ID:7869)和“首屏模塊”區塊(ID:7939)為例演示。


1)“產品展示”區塊(ID:7869)

【操作指導】進入“編輯網站”界面,點擊添加區塊,輸入本區塊ID7869,點擊“應用”區塊,如下圖所示:

區塊7869-1


點擊區塊圖片中央的“編輯”按鈕,可進行區塊產品分類選擇,如下圖所示:

區塊7869-2


【應用效果】如下圖所示:

區塊演示


2)“首屏模塊”區塊(ID:7939)

【操作指導】進入“編輯網站”界面,點擊添加區塊,輸入本區塊ID7939,點擊“應用”區塊,如下圖所示:

區塊7939-1


點擊區塊圖片中央的“編輯”按鈕,可進行區塊圖文編輯,如下圖所示:

區塊7939-2


在彈出的區塊編輯界面中,可進行添加/刪除圖片集操作,也可針對每個圖片進行替換圖片、編輯圖片、編輯圖片描述、圖片標題、添加圖片鏈接等操作,如下圖所示:

區塊7939-3


【應用效果】如下圖所示:

區塊演示1


14、新增功能:

1)全站移動端優化提速

【應用場景】網站訪問速度是一個很重要的指標,不僅影響用戶瀏覽體驗,更重要的是會影響網站的搜索引擎排名,特別是外貿網站。

【速度優化】維看本次針對響應式網站,通過圖片智能壓縮異步js/css文件加載移動端智能計算首屏內容Google字體本地化網頁靜態化緩存混合CDN(境內使用阿里雲CDN、境外使用AWS CDN)、全球五大洲自建CDN邊緣節點200+(保證網站首次訪問速度)等多種技術進行全站優化提速,大幅提升網站訪問速度,提高Google測速評分,優化效果如下圖所示:

WechatIMG56


2、新增移動端組件&區塊隱藏功能

【操作指導】移動端隱藏功能,可自定義隱藏移動端組件&區塊,提高網頁加載速度,打造精美移動端網站。進入“編輯網站”界面,點擊“手機”圖標進入移動端編輯,如下圖所示:

圖1-1


在移動端編輯頁面,鼠標懸停在頁面各組件上,顯示“編輯”功能,如下圖所示:

圖1-2


點擊“編輯”按鈕進行該組件編輯,可修改該組件在移動端的“顯示/隱藏”狀態(此處以隱藏“高級幻燈片”組件為例),如下圖所示:

注:在移動端進行的編輯操作,僅會在移動端生效,並不會影響PC端的顯示效果。

圖1-3


隱藏後的組件在移動端前台將不會顯示(PC端正常顯示),如下圖所示:

圖1-4


圖1-5


【功能預告】接下來,我們將會開發適合移動端的專屬新區塊、新組件,並全站支持AMP,逐步完成對移動端及AMP端的速度優化和美觀的優化,最終達到移動端和AMP端的又快又美。



建站流程

找不到你的問題?
135-6001-3420
seoprixcom@gmail.com
214227632
Facebook
Twitter
Google
LinkedIn
Instagram
維看雲建站系統
專業外貿建站系統,為您打造一個適合谷歌的優化網站!
  • 客服QQ
    214227632
  • 微信手機
    (852) 6741 8807
  • 郵箱
    seoprixcom@gmail.com