top of page
michaelkao

頁面排版不再困擾 Magento 電子商務 全新頁面排版功能上線



一般編輯器無法滿足需求

▲一般的編輯器,使用上與word相似

像這樣類似的文案編輯器,相信只要有在網站編輯過文章的人,都有看過類似的樣板。一般而言,如果上稿的版面沒有特殊需求,例如部落格或論壇的發文,確實只要上圖片並撰寫標題內容,就能產出一篇圖文並茂的文章。但如果想用來編輯電商的活動促銷頁面,或是對圖片文案有特殊的編排需求,那麼依舊採用一般的編輯器,就真的比較辛苦,而且常常在實際頁面看到的結果,跟編輯的時候有很大的差距。

Magneto 2.4 PageBulider拖曳式編輯模板

近幾年來,為了方便使用者能更直覺的進行編輯,在某一些網站的編輯器中,陸陸續續可以看到所謂的「拖曳式模板編輯器」。這種編輯器方便的地方在於,只要先將整頁的版面都先編排好,再根據其中的區塊放入對應的圖片或文字就可以了。Magneto電子商務系統在2.4的版本開始,也提供的內建的PageBulider拖曳式編輯模板,方便使用者進行頁面文案編輯。

▲像這樣把需要的物件拖曳過去即可



一般編輯器vs拖曳式編輯模板

情境範例─圖片並排、段落對齊

一般編輯器的情境

在編輯文章中,一種比較常見的需求,就是將數張圖片並排在同一行。在一般的編輯器上,就是簡單的輸入文字後,插入需要的圖片,調整圖片大小間距位置後儲存完工送出。


▲照著眼睛所見的樣子編輯調整


▲與原本編輯器上看到的有差距,圖片換行了,段落與圖片也沒對齊


然而在實際的網頁上,可能因為沒有確實設定圖片於版面之間的比例,或是內建CSS樣式等等的因素,導致圖片等內容沒有正確出現在預期的位置,也就是大家所稱的「跑版」。雖然包含圖片位置跑版,或是段落文字的對齊等等的問題,透過多次的來回調整依舊能到位,但確實事倍功半。


PageBulider 拖曳式編輯模板的情境



不同於一般編輯器,Magneto 2.4提供的PageBulider拖曳式編輯模板,只要拉好區塊確認每段文字或圖片應該出現的位置,再一一放入,不需要後續花費大量時間反覆微調,頁面呈現的樣式便可快速到位。

▲簡單幾步,圖片不跑版,段落與圖片也對齊了!

Comments


bottom of page