Dreamweaver網(wǎng)設計與制作指南第章

第18章查詢網(wǎng)站的制作本章介紹用ASP開發(fā)的一個查詢網(wǎng)站的制作流程，包括分析網(wǎng)站的構思、結構策劃、配置ASP開發(fā)環(huán)境、建立本地站點、創(chuàng)建并連接數(shù)據(jù)庫文件。本章重要知識點：如何查看站點地圖創(chuàng)建數(shù)據(jù)庫以及建立數(shù)據(jù)庫連接文件第18章查詢網(wǎng)站的制作如何制作表單以及表單中各元素屬性的設置設置請求變量如何使用程序設置段落換行制作信息分頁框架頁的使用及應用18.1構思意圖按客戶的需求，該查詢網(wǎng)站定位為“吉林查詢網(wǎng)”，即將吉林省中的企業(yè)按區(qū)域劃分，并按地區(qū)分配二級域名，通過該網(wǎng)站可以讓企業(yè)免費加入查詢網(wǎng)，并通過增值服務為企業(yè)生成名片，方便查詢不同地區(qū)不同類別的企業(yè)名稱，為企業(yè)與企業(yè)之間、客戶和企業(yè)之間提供了開放式的平臺。18.2結構設計及布局設置在定位了網(wǎng)站的構思策劃以后，就要對網(wǎng)站的整體結構進行設置，并通過圖片和文字等基本元素對網(wǎng)站進行相應的布局設置。18.2.1網(wǎng)站結構設計在正式制作網(wǎng)站之前，首先進行網(wǎng)站目錄結構的策劃與分析，然后進行網(wǎng)站布局的設置，以方便對網(wǎng)站進行管理和更新。18.2.2網(wǎng)站布局設置界面采用簡單的設計，為不同地區(qū)的查詢分站設置不同的Logo和Banner。頁面布局采用左右結構，左側欄放置企業(yè)的類別，右側放置明星企業(yè)以及推薦企業(yè)。18.3分析站點地圖為該網(wǎng)站所有的目錄建立一個站點，使得ASP文件可以在瀏覽器中運行，首先要在DW8中配置ASP的運行環(huán)境。下面補充介紹如何查看站點中各頁面之間的超級鏈接。18.4數(shù)據(jù)庫分析制作ASP的網(wǎng)站，必須應用數(shù)據(jù)庫才能完成整個網(wǎng)站數(shù)據(jù)的更新、查詢、編輯等操作，本例使用的是Access數(shù)據(jù)庫jlcx.mdb，使用了“admin”、“dengji”、“entercard”3個表。18.5制作CSS樣式在制作網(wǎng)站之前，首先要為網(wǎng)站定制相應的CSS樣式，建立CSS樣式表。本例中所使用的CSS樣式表有main.css和style.css，前一個應用首頁和分站及查詢模板，后一個應用于后臺管理及企業(yè)名片樣式。18.6準備網(wǎng)頁素材和制作軟件在制作網(wǎng)頁過程中，需要使用的軟件有UleadGIFAnimator和Photoshop，因本例所實現(xiàn)的主要是查詢功能，因而在界面美化方面沒有過多的要求，主要讓瀏覽者使用方便，操作快捷。18.7配配置ASP環(huán)境制作ASP的的網(wǎng)站，首先先要指定硬盤盤中的某一文文件夾為本地地站點，并在在DW8中配配置站點的相相關參數(shù)。18.8創(chuàng)創(chuàng)建數(shù)據(jù)庫庫運行Access軟件，，為本例創(chuàng)建建數(shù)據(jù)庫及數(shù)數(shù)據(jù)表。18.8.1建立jlcx.mdb數(shù)據(jù)庫庫本節(jié)建立jlcx.mdb數(shù)據(jù)庫。。18.8.2建立admin數(shù)數(shù)據(jù)表本節(jié)建立admin數(shù)據(jù)據(jù)表。18.8.3建立dengji數(shù)據(jù)表本節(jié)建立dengji數(shù)數(shù)據(jù)表。18.8.4建立entercard數(shù)據(jù)據(jù)表本節(jié)建立entercard數(shù)據(jù)表表。18.8.5定義數(shù)數(shù)據(jù)表初始值值新建的數(shù)據(jù)表表中值都為空空，為了設計計的需求，先先將數(shù)據(jù)表設設置初始值。。18.9制制作數(shù)據(jù)庫庫連接文件在DreamweaverCS4中可以自定定義數(shù)據(jù)庫連連接。18.10制制作網(wǎng)站站首頁index.htm網(wǎng)站站的的首首頁頁用用靜靜態(tài)態(tài)HTML設設計計，，應應用用ASP技技術術制制作作的的網(wǎng)網(wǎng)站站只只需需將將調(diào)調(diào)用用程程序序和和腳腳本本的的文文件件制制作作成成為為.asp文文件件即即可可。。18.11制制作作““關關于于我我們們””頁頁面面about.htm在網(wǎng)網(wǎng)站站中中““關關于于我我們們””、、““誠誠征征代代理理””、、““廣廣告告服服務務””均均為為靜靜態(tài)態(tài)頁頁面面，，同同用用一一個個網(wǎng)網(wǎng)站站界界面面模模板板，，將將Photoshop中中制制作作的的界界面面用用ImageReady切切割割成成為為網(wǎng)網(wǎng)頁頁。。切切割割圖圖片片為為網(wǎng)網(wǎng)頁頁在切切割割圖圖片片的的過過程程中中，，注注意意圖圖片片的的整整體體分分割割與與局局部部分分割割相相結結合合，，讓讓界界面面中中的的圖圖片片大大小小合合適適，，又又不不至至于于太太零零散散，，因因為為本本書書第第15章章、、16章章已已經(jīng)經(jīng)詳詳細細介介紹紹了了靜靜態(tài)態(tài)頁頁面面的的制制作作流流程程，，在在此此不不再再重重復復介介紹紹頁頁面面的的具具體體制制作作過過程程。。設設置置網(wǎng)網(wǎng)頁頁標標題題和和頁頁面面屬屬性性本節(jié)節(jié)設設置置網(wǎng)網(wǎng)頁頁標標題題和和頁頁面面屬屬性性。。從從外外部部導導入入CSS樣樣式式本節(jié)節(jié)從從外外部部導導入入CSS樣樣式式。。新新建建CSS鏈鏈接接樣樣式式本節(jié)節(jié)新新建建CSS鏈鏈接接樣樣式式。。設設置置文文本本內(nèi)內(nèi)容容本節(jié)節(jié)設設置置文文本本內(nèi)內(nèi)容容。。設設置置尾尾部部版版權權信信息息本節(jié)節(jié)設設置置尾尾部部版版權權信信息息。。18.12制制作作企企業(yè)業(yè)登登記記頁頁面面現(xiàn)在在開開始始制制作作有有ASP程程序序的的頁頁面面，，首首先先制制作作為為企企業(yè)業(yè)提提供供免免費費登登記記的的頁頁面面EnterReg.asp。。新新建建文文檔檔本節(jié)節(jié)新新建建文文檔檔。。制制作作登登記記表表格格本節(jié)節(jié)制制作作登登記記表表格格。。制制作作表表單單接下下來來在在表表格格中中插插入入表表單單。。設設置置表表單單屬屬性性本節(jié)節(jié)設設置置表表單單屬屬性性。。插插入入包包含含文文件件本頁頁需需要要與與數(shù)數(shù)據(jù)據(jù)庫庫相相連連接接，，因因此此在在頁頁面面中中必必須須插插入入數(shù)數(shù)據(jù)據(jù)庫庫連連接接文文件件。。設設置置請請求求變變量量本節(jié)節(jié)設設置置請請求求變變量量。。制制作作腳腳本本文文件件在登登記記表表中中有有幾幾項項文文本本框框是是必必填填項項，，需需使使用用一一段段Java腳腳本本文文件件來來進進行行說說明明，，當當讀讀者者沒沒有有填填寫寫這這幾幾個個必必填填項項時時，，彈彈出出提提示示這這段段代代碼碼需需插插入入在在</head>之之前前。。18.13制制作作分分站站信信息息顯顯示示頁頁面面從網(wǎng)網(wǎng)站站的的首首頁頁進進入入各各分分站站后后，，顯顯示示該該地地區(qū)區(qū)的的企企業(yè)業(yè)信信息息，，還還有有““明明星星單單位位””和和““最最新新加加入入企企業(yè)業(yè)””，，左左側側是是企企業(yè)業(yè)的的分分類類。。定定義義變變量量界面面的的模模板板與與前前面面的的靜靜態(tài)態(tài)頁頁相相同同，，其其實實每每個個地地區(qū)區(qū)的的頁頁面面都都是是相相同同的的，，只只是是Logo和和Banner都都分分別別定定義義了了變變量量，，在在實實際際頁頁面面中中采采用用程程序序調(diào)調(diào)用用的的方方式式。。設設置置網(wǎng)網(wǎng)頁頁標標題題每一一個個地地區(qū)區(qū)的的標標題題都都是是從從變變量量中中提提取取的的。。設設置置Logo和和Banner圖圖像像屬屬性性在之之前前已已經(jīng)經(jīng)定定義義好好了了Logo和和Banner圖圖片片名名稱稱的的變變量量，，在在制制作作中中只只需需設設置置變變量量名名稱稱以以及及設設置置好好圖圖像像的的大大小小即即可可。。設置分分站Logo圖圖像的的源文文件為為“images/<%=ImgUrl%>.gif”。。制制作作左側側欄本節(jié)制制作左左側欄欄。制制作作搜索索欄本節(jié)制制作搜搜索欄欄。制制作作頁面面中部部信息息在頁面正中中位置制作作信息顯示示，此處顯顯示“滾動動公告”、、“明星單單位”及““最新加入入企業(yè)”。。滾動公告明星單位最新加入企企業(yè)18.14制作作企業(yè)信息息顯示頁面面單擊企業(yè)名名稱，顯示示的頁面是是從數(shù)據(jù)庫庫中按企業(yè)業(yè)在數(shù)據(jù)庫庫中的id編號顯示示，本頁由由之前制作作好的靜態(tài)態(tài)頁面另存存生成，保保存文件名名為“ShowEnter.asp””，在文檔檔代碼第一一行插入包包含文件。。數(shù)數(shù)據(jù)庫查查詢在制作頁面面內(nèi)容之前前，先要在在<body>標簽簽中制作數(shù)數(shù)據(jù)庫查詢詢語句。企企業(yè)信息息表格在右側正文文部分制作作企業(yè)信息息表格。制制作段落落換行腳本本在記錄顯示示中因為單單位簡介的的內(nèi)容比較較多，可能能會存在分分段的情況況，在文檔檔代碼中，，設置代碼碼讓該記錄錄可以按發(fā)發(fā)布的樣式式分段顯示示，在<body>中插入代代碼。18.15企業(yè)業(yè)名片頁面面在登記企業(yè)業(yè)時，如果果有網(wǎng)址，，即顯示企企業(yè)網(wǎng)址，，如果沒有有，“吉林林查詢網(wǎng)””為用戶提提供了付費費企業(yè)名片片，在付費費后單擊““企業(yè)名片片”鏈接，，即可顯示示其信息。。制制作頁面面在搜索框中中輸入關鍵鍵字。制作查詢結結果頁面與與index_jl.asp的制作方方法基本相相同，只是是將明星單單位滾動顯顯示移到左左側欄，中中間部分顯顯示查詢結結果，是明明星企業(yè)的的的優(yōu)化顯顯示，并用用符號“★★”作為標標記，普通通企業(yè)在記記錄前用方方框圖標作作為標記。。制制作分頁頁制作分頁。。18.17后臺臺管理登錄錄頁面login.asp所有的信息息都可以在在后臺進行行添加、修修改、刪除除等管理，，本站的后后臺功能18.18后臺臺管理首頁頁admin_index.asp在login.asp登錄成成功后，轉轉入后臺管管理首頁，，admin_index.asp，，該頁由左左右框架頁頁組成。18.19案例例擴展本章案例詳詳細講解了了“吉林查查詢網(wǎng)”的的制作過程程，相信讀讀者對于使使用ASP制作網(wǎng)頁頁的流程有有了一定的的認識，應應用ASP制作本例例的網(wǎng)站測測試網(wǎng)站站鏈接打開“文件件”面板，，選擇文件件index.htm，單擊擊鼠標右鍵鍵，在彈出出的菜單中中選擇“檢檢查鏈接””|“選擇擇文件/文文件夾”命命令。申申請域名名和空間每個網(wǎng)站都都要自己的的獨立主機機和服務器器，域名也也必須是唯唯一的。有有了域名，，才會讓網(wǎng)網(wǎng)站在無邊邊無際的互互聯(lián)網(wǎng)中占占有一席之之地，就比比如人有了了名字，可可以讓別人人記住你。。申請請域域名名配置置二二級級域域名名申請請空空間間配配置置FTP站站點點屬屬性性在DreamweaverCS4中中可可以以更更新新網(wǎng)網(wǎng)站站信信息息在本本案案例例中中，，在在前前臺臺可可以以讓讓用用戶戶通通過過EnterReg.asp自自助助登登記記企企業(yè)業(yè)信信息息，，由由管管理理員員在在后后臺臺將將企企業(yè)業(yè)審審核核通通過過，，使使其其成成為為正正式式用用戶戶。。在后后臺臺也也可可以以進進行行添添加加企企業(yè)業(yè)的的資資料料、、增增加加企企業(yè)業(yè)名名片片，，以以及及對對企企業(yè)業(yè)資資料料的的修修改改、、刪刪除除、、添添加加等等操操作作。。18.