編輯導(dǎo)語：廣告模塊設(shè)計廣告能夠為網(wǎng)頁帶來很多的增色效果和盈利，廣告模塊的設(shè)計對網(wǎng)站來說非常重要。本文以廣告模塊設(shè)計為主題進行了分析，作者分享了他對廣告模塊的構(gòu)思。希望能給您帶來一些幫助。

一、廣告模塊構(gòu)思圖

二、廣告流程節(jié)點

三、后臺需求

1. 廣告管理和日志管理后臺入口

【日志管理】中新增廣告日志管理的二級菜單。廣告管理的入口位置在【運營管理】，新增一個廣告管理的二級菜單，廣告管理分別有兩個子菜單：廣告位管理、廣告發(fā)布記錄。

2. 廣告位管理

（1）列表

廣告位列表中顯示系統(tǒng)中所有廣告位項目。

字段說明：

• 列表展示順序按照廣告位ID數(shù)字1開始的自增倒序顯示；
• 廣告位ID：寫死，按照1開始的自增倒敘顯示；
• 廣告名稱：寫死廣告位名稱，分別是xxx、xxx、xxx；
• 廣告類型：寫死，首頁插屏-插屏、首頁底部banner-banner、首頁頂部banner-banner；
• 更新時間：最新編輯廣告位的時間；
• 操作：

編輯：

• 點擊編輯按鈕彈出編輯彈窗；
• 保存：對已編輯的信息進行保存，但不發(fā)布廣告；立即發(fā)布：對已編輯的信息進行保存且發(fā)布（發(fā)布：生成一條廣告發(fā)布記錄）；

發(fā)布：

用戶點擊發(fā)布按鈕時需校驗同一個廣告位的有效時間的開始和結(jié)束時間是否有重復(fù)的，若有重復(fù)的則需提示用戶：“發(fā)布失敗同一個廣告位的有效時間存在重復(fù)，請仔細檢查！”；

彈出確認框，確定即生成一條廣告發(fā)布記錄。

（2）廣告詳情

（3）編輯廣告

基本信息：

• 廣告名稱：不可編輯、寫死；
• 廣告類型：不可編輯，寫死，首頁插屏-插屏、首頁底部banner-banner、首頁頂部banner-banner；
• 廣告圖：只允許上傳一張，廣告圖的尺寸由UI定義，大小由開發(fā)定義；

廣告圖跳轉(zhuǎn)地址分三種情況：

1. 選擇應(yīng)用內(nèi)地址，默認寫死xxxxxxx（頁面待定），點擊廣告圖跳轉(zhuǎn)到對應(yīng)頁面內(nèi)；
2. 選擇不跳轉(zhuǎn)則點擊無法跳轉(zhuǎn)，默認不跳轉(zhuǎn)；
3. 選擇自定義頁面，展示富文本框，需在富文本框中編輯頁面內(nèi)容，該頁面寫在應(yīng)用內(nèi)，專門用來做插屏/banner廣告自定義頁面。

小程序內(nèi)跳轉(zhuǎn)地址為：

• 不跳轉(zhuǎn)；
• 跳轉(zhuǎn)至XX頁面；
• 跳轉(zhuǎn)至XX頁面；
• 自定義頁面。

規(guī)則設(shè)置：

頻次：僅在廣告類型是插屏時展示，頻次選項，寫死一下三個選項；

1. 每進入一次應(yīng)用的該頁面展示一次：用戶在有效時間每重新進入一次應(yīng)用的該頁面展示一次廣告，即應(yīng)用后臺關(guān)閉后重新進入一次該頁面則展示一次；
2. 有效時間內(nèi)該頁面只展示一次：用戶在有效時間內(nèi)；
3. 每進入該頁面一次展示一次：用戶在有效時間內(nèi)每次進入該頁面展示一次廣告；

有效時間：

1. 若該廣告存在狀態(tài)為“未開始或者進行中”狀態(tài)的廣告，則選擇的時間不可與當前存在這兩個狀態(tài)下的廣告的有效時間重復(fù)（將這兩個廣告的有效時間置灰，不可選），若時間跨度包含了已存在的有效時間，如：A 11月20日-11月21日已存在，B選擇了11月18日-11月底，則11月20日-11月21日不展示B而展示A，時間重復(fù)只展示一個（哪個先添加展示哪個）；
2. 結(jié)束時間可以選擇“永遠”（即無結(jié)束時間） ；

（4）發(fā)布廣告

彈出確認框，確定即生成一條廣告發(fā)布記錄。

3. 廣告發(fā)布記錄

存放已經(jīng)生成的廣告。

字段說明：

• 列表展示順序按照發(fā)布廣告的時間倒序顯示；
• 廣告記錄ID：按照1開始的自增倒敘顯示；
• 廣告ID、名稱：從廣告位中附帶過來；
• 跳轉(zhuǎn)地址：點擊廣告圖后跳轉(zhuǎn)的地址；
• 有效時間：廣告展示的有效時間（注：若一定時間段內(nèi)有廣告，則在已確定的位置展示廣告，若無則不展示）；
• 狀態(tài)：已結(jié)束（到了有效期自動結(jié)束、手動結(jié)束）、未開始（未到開始時間）、進行中（在有效時間內(nèi)）；
• 結(jié)束時間：即廣告展示的實際結(jié)束時間；
• 操作：

編輯：

可以對狀態(tài)為未開始和進行中狀態(tài)的廣告位進行編輯。

結(jié)束：

可以對狀態(tài)為未開始和進行中狀態(tài)的廣告位進行結(jié)束，點擊結(jié)束彈出結(jié)束確認彈窗，需填寫結(jié)束原因。

詳情：

4. 日志列表

存放點擊過廣告的用戶信息。

字段說明：

• 列表展示順序按照點擊時間倒序顯示；
• 日志記錄ID：按照1開始的自增倒敘顯示；
• 廣告ID、名稱：顯示用戶點擊的廣告位對于的ID和名稱；
• 用戶ID：點擊廣告位的用戶的ID；
• 點擊時間：用戶點擊廣告的時間。

四、前臺需求

1. 廣告展示入口

• 首頁頂部新增banner展示位置；
• 首頁底部新增banner展示位置；
• 首頁新增插屏展示位置。

#專欄作家#

一只產(chǎn)品喵，微信公眾號：一只產(chǎn)品喵，人人都是產(chǎn)品經(jīng)理專欄作家。擅長于原型圖制作和需求挖掘，愛好寫文章、繪畫、旅游等。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議。