ForumID
myemail@bz.com.tw
進入會員專區 進入會員專區
clear
person
按鈕文字
local_grocery_store
0
按鈕文字
clear_all
按鈕文字
search
開始搜尋
申請網站
申請網站
image/svg+xml
image/svg+xml 會員專區,修改會員資料,修改密碼,購物紀錄,紅利查詢等
image/svg+xml
image/svg+xml 會員專區,修改會員資料,修改密碼,購物紀錄,紅利查詢等
回首頁>V2 網頁設計教學>初階課程>[V2 網頁設計]修改「輪播展示」示範

輪播展示元素的修改示範

 

現在先看一下什麼是「輪播展示」:

Skin Care
怒髮衝冠,憑闌處,瀟瀟雨歇。抬望眼,仰天長嘯,壯懷激烈。
Skin Care
怒髮衝冠,憑闌處,瀟瀟雨歇。抬望眼,仰天長嘯,壯懷激烈。
怒髮衝冠,憑闌處,瀟瀟雨歇。抬望眼,仰天長嘯,壯懷激烈。
Skin Care

快速建立概念 / 首先,我們先來看一段 11 分多鐘的影片:

這段影片和這篇文章主要想教大家的是:

  1. 如何選取播放展示元素。
  2. 修改輪播展示裡面的各個展示項目( 各個 Page )。
  3. 限制選取與取消限制選取的操作。
  4. 選取多個檔案一次上傳。
  5. 文字陰影的設定。
  6. 預覽功能的使用與限制。
  7. 不可以放到輪播展示裡面的元素種類。

 

 

1. 如何選取播放展示元素

「輪播展示」元素是一種複合型的容器,它包含了一到多個「輪播展示項目」,所以在選取上,常常只能選到輪播展示項目,而沒辦法選到輪播展示這個「父元素」。選取的方法至少有三種,一是用「元素檢視與選取視窗」來選取,二是用滑鼠右鍵的跳出選單,下方的「其他選擇」;最後比較建議使用的是三,使用編輯畫面下方的元素階層選擇器直接點選最直覺。


 

 

「元素檢視與選取視窗」來選取


 

滑鼠右鍵的跳出選單,下方的「其他選擇」


 

 


2. 修改輪播展示裡面的各個展示項目

當您選取了某個輪播展示元素之後,如果編輯工具視窗沒有出現,可以用快速鍵( Ctrl + Alt )跳出工具視窗,或是按滑鼠右鍵跳出選單中,選擇「元素編修」的「設定輪播展示」:


 

 

之後,您應該會看到以下畫面:

 


 

您可以看到有「上一頁」和「下一頁」,這個就是切換輪播展示的頁面工具,透過切換頁面,修改每一頁面裡面的元素( 圖或文 )。

 

 

3. 限制選取取消限制選取的操作

由於可能在多次編修後,或是透過編輯器製作了複雜的元素堆疊,有時候會造成無法直接選取我們要的元素,這時候,我們就可以暫時把不需經常修改,或是面積過大,常常會擋到其他元素,影響其他元素選取的元素,設定為「限制選取」。比如影片中,在播放展示第一頁的弧形半透明白色色塊,他會擋到上方 Logo,影響了我們的操作,所以我們將它設定為限制選取。當我們遇到需要修改這個被限制選取的物件時,我們可以用上方所說明的「其他選擇」的方式來選取此元素。

 

那如果遇到會去擋到其他元素但是又必須時常去修改它的時候怎麼辦?有一個小要訣就是將此元素設定為「標記此元素」:



 

這時候您就可以在右邊的標記物件中找到此元素連結。

 

4. 選取多個檔案一次上傳

在影片中,我們選擇要使用的圖檔,透過 Ctrl + 點選來複選要的檔案,上傳到伺服器。其實這個部分是屬於作業系統的操作,大多數的人都知道要怎樣複選檔案。這裡要說明的是平台所使用的「網路檔案管理員」,其總共有三種上傳方式:

一般單一檔案上傳:如果只有一個檔案,使用滑鼠直接將檔案拖拉到檔案輸入區塊,是很快速的方式( chrome )。當然您也可以按下「選擇檔案」( chrome )按鈕來選擇要傳送的檔案。

多檔上傳:在右方有「多檔上傳...」的下拉選單,您可以看到兩個選項,一是「網頁上傳」,一個是「FTP上傳」。網頁上傳操作方式如您在影片中所看到的那樣,就不再多加說明。如果選擇 FTP 上傳,系統會發配給您目前有效連線緒期間的專用伺服器域名、帳號和密碼( 登出後如果連線緒過期,則前述資料無效 )。這必須配合 FTP 客戶端軟體使用才行。這兩種傳送方式有其區別,最大的差別在單一檔案量,網頁傳送的單一檔案有 10 Mb 的限制,而 FTP 可以到 1Gb。

 

注意FTP 上傳只有「流量精算方案」的使用者可以使用。

 

 

5. 文字陰影的設定

文字陰影再文字特效裡面有不可或缺的作用,善用這些文字特效,可以讓網頁有很不一樣的呈現。在影片中,我們試著修改影子的顏色,而讓文字產生不一樣的顏色光暈( Glow )。文字陰影和方塊陰影( 和文字陰影雷同,但是是套在非文字元素上,例如方塊元素等 )都可以透過設定多組陰影設定來產生光暈或外部陰影、內部陰影( 可做凹陷效果 )等效果,也可以製作出像多層外框般特效、或是立體效果。

 

6. 預覽功能的使用與限制

V2 是所見即所得的 RWD 網頁版型與內容編輯器,在編輯過程中,我們須常常檢視各個解析度的頁面變化。在編輯的過程中,如果想檢視各個解析度,您可以使用編輯器右邊的解析度切換把( 編輯時解析度預覽鍵 ),您可以直接拖拉,或是滑鼠移到此鍵後按下右鍵,選擇要預覽的解析度。

但是如果要模擬各個設備上的呈現狀態,您必須先存檔,然後使用下方指令行的「預覽」功能。

預覽可以呈現五種解析度的變化,包含 PC、平板(直)、平板(橫)、手機(直)、手機(橫) 五種。

 

7. 以下元素不可放入輪播展示元素內

因為程式有所限制,以下元素無法「塞」到輪播展示內:

  1. 輪播展示元素,就是輪播展示元素無法放入其他輪播展示元素裡面。
  2. 設定為捲動陳列容器,操作上會相衝突。
  3. 表單,內容會無法送出。
  4. 設定卷軸模式與滑動相本模式的相本無法正常在輪播展示內顯示。

 

總結

這篇文章主要講到「播放展示」元素的修改,也順便提到了一些網路檔案管理員的使用介紹,相信對您在操作後台以及 V2 編輯器上有更多的認識,特別要注意「限制選取」的功能,有時候您發現某個元素一直選不到,那可能就是該元素已經被限制了選取,如果不是,請點選下方指令行的「重新整理」或是「重整」( 可能以後會改名為「重整」 ),或許是因為編輯器與元素對照的替代物件沒有更新完全所致。

另外,關於「文字陰影」與「方塊陰影」它們還是有一些不同( 差一個參數,文字陰影沒有陰影大小這個參數 ),所以使用上要特別注意。

特別注意關於預覽的功能,PC 版本的預覽當然是沒有什麼問題,但是在平板與手機的預覽,還是要以實際設備上看到的為準,所以當您差不多完成版面設計後,請記得在相關設備上進行正式的瀏覽

 

下一篇文章,我們來說說「選單」元素。