與網(wǎng)站類似，小程序詳情頁同樣支持自定義設(shè)計。以產(chǎn)品詳情為例，小程序產(chǎn)品詳情頁默認(rèn)有基本的樣式設(shè)置項，如容器、圖片、標(biāo)題、底部按鈕等設(shè)置項

如果想完全自定義設(shè)計，首先需要刪除默認(rèn)的版塊，添加自由容器版塊到頁面中并設(shè)置綁定頁面數(shù)據(jù)源

綁定頁面數(shù)據(jù)源的意思是當(dāng)前版塊里面的數(shù)據(jù)允許綁定當(dāng)前詳情頁的動態(tài)數(shù)據(jù)，例如詳情標(biāo)題、圖片、正文內(nèi)容都屬于當(dāng)前頁面數(shù)據(jù)源數(shù)據(jù)。拖拽圖片到頁面中，設(shè)置使用動態(tài)數(shù)據(jù)，選擇縮略圖字段即完成了詳情產(chǎn)品圖的自動綁定(需預(yù)覽才能看到實際效果)。除此之外還可以對圖片進(jìn)行樣式設(shè)置，例如添加圓角。

與圖片類似，拖拽文本元素到版塊里同樣可以綁定動態(tài)數(shù)據(jù)，例如綁定產(chǎn)品標(biāo)題字段。

另外比較重要的就是詳情富文本內(nèi)容了，富文本比較特殊，內(nèi)容高度是根據(jù)后臺編輯內(nèi)容長度決定了，無法設(shè)計時確定。因為不能使用固定高度的自由容器，而應(yīng)使用流式容器，流式容器的區(qū)別是他的高度會隨著內(nèi)容高度自動變化。默認(rèn)拖拽富文本組件到頁面中將自動包裹流式容器，可以給上級流式容器添加內(nèi)邊距提升閱讀體驗。

底部按鈕的添加比較特殊，底部按鈕屬于浮動元素，始終固定貼緊在手機(jī)底部，添加時需要切換到浮動面板，拖拽按鈕到頁面中，然后設(shè)置左下對齊或者右下對齊模式，設(shè)置對應(yīng)的位置信息就能讓按鈕始終固定在底部對應(yīng)位置。

完成了以上設(shè)置，一個帶有基本數(shù)據(jù)的自定義詳情頁就做好啦！可以添加任意元素到頁面中進(jìn)行裝飾，也可以添加其他動態(tài)列表到底部版塊里方便顯示更多信息。