Flex Message
今天我們要用來自製客製化選單的就是「
Flex Message」這個網站,這是LINE Developers中的一個功能,對於不會寫程式的人也能輕鬆的上手,而要使用時記得登錄自己的LINE才能用唷!!
首先,先點選右上角的「Showcase」,能讓你選擇想要的模板
先選一個跟你要製作的功能類似的模板下去修改,這樣才能夠事半功倍
選好模板後,你可能會看到中間一堆英文,可能不知道哪個是對應哪個區塊對吧,沒關係,LINE其實很貼心,你只要將游標移置對應的英文上,像我移到紅框中的box,左邊的圖示就會在相對應的地方顯示暗灰色,你便能馬上知道要修改的位置為何
而當你點選要修改的地方後,右半邊將會出現可以修改的東西,像是可修改例如顏色、大小、位置、超連結等等
大致說明一下常用的區塊
- hero適用於上方圖片下方區塊的模板,其主要是上方圖片區要選放圖片(image)
- body為下方區塊區,存放box區塊的地方
- footer為最下方,通常是選放按鍵等功能
- text為存放文字
- icon為存放圖片
- button為按鈕,主要是存放超連結
平常比較常用到的功能大概就是這些,但可能還是有些功能沒介紹到,這就只能大家自己好好摸索了
在中間的上方會有一些功能可以使用,像是複製、剪下、貼上、復原跟刪除等功能,大家都可以自行摸索看看
當製作好以後,點選右上角的「</> View as JSON」
就會跳出我們製作的程式碼,接著只要將其複製起來
接著將我複製的JSON程式碼貼到我們程式碼的主程式區塊中的contents中,這樣就大功告成拉
# 基本上程式編輯都在這個function
@handler.add(MessageEvent, message=TextMessage)
def handle_message(event):
essage = text = event.message.text
if re.match('部落格',message):
# Flex Message Simulator:https://developers.line.biz/console/fx/
flex_message = FlexSendMessage(
alt_text='部落格',
contents={…} #JSON程式碼貼在這裡
)
line_bot_api.reply_message(event.reply_token, flex_message)
else:
line_bot_api.reply_message(event.reply_token, TextSendMessage(message))
總結
我的部落格選單究竟是怎麼做出來的,我們將於之後實戰篇中教給大家,或是大家可以自行摸索要如何自製,也不一定要用在部落格選單,也可以運用在其他很多地方,讓你的LINE Bot更加繽紛有活力吧!!