2012 3-18客製化網頁與joomla結合應用 -ring

Now we bring you…

客製化網頁與joomla結合應用

主講者:Ring / A.J

Des13.com

鼎益盛網頁設計有限公司

Joomla! CMS管理系統

網頁視覺設計

Flash視覺動畫

CIS平面形象設計

Blog 部落格行銷

經營項目：

自我介紹

SEO 網站優化及關鍵字行銷

電子商務網站

專業主機代理

1

講題大綱： 一．自我介紹 二．css+div介紹 案例分享：純css做的網站，如花蓮縣消防局和i-tale.. 三．國外joomla模板介紹 四．joomla結合客製化網頁設計 案例分享：賽德克麻辣火鍋.自動小園丁.新勝裕號... 五．以花蓮縣消防局為實例介紹joomla版面layout

CSS +DIV 2 什麼是

HTML

網頁內文的資料以

文字編排的方式標示與構成

= 網頁語法

CSS Cascading Style Sheets

1996年由致力推動網頁技術標準化的團體

-- W3C (World Wide Web Consortium)

發表了CSS第一版

= 階層式樣式表

DIV

定義特定範圍，將資訊做視覺化

的分類，讓人一看就能了解的重

要工具，是網頁版面設計的基礎

= 區塊要素

DIV in CSS in HTML

表格式設計:

使用多重TABLE語法

組成複雜的巢狀表格

DIV = 區塊要素

CSS的優勢及必要性:

實施SEO（搜尋引擎最佳化）

符合網頁標準規格

提高可維護性

確保無障礙網頁設計

減輕網路負荷

CSS+DIV 案例分享

CSS與JOOMLA樣板(TEMPLATE)的關係

JOOMLA 典型的樣板架構

Index.php

也就是整體的版面配置

Template.css

定義整體外觀的字型、邊距、標題、

圖像邊框以及項目清單樣式等…

css –

包含所有*.css檔案

joomla+CSS+DIV 案例分享

JOOMLA 3 國外模板介紹

rockettheme.com

templatemonster.com

joomlart.com

JOOMLA

4 結合客製化網頁設計

實際案例分享

客戶自己畫的草圖…

完成的網站 - seediq.com.tw

客製訂購表單 - seediq.com.tw

客製訂購表單 後台 - seediq.com.tw

頂茗創意茶坊 - www.topprootea.com

自動小園丁

autogardener.com

新勝裕號 www.mame.tw

joomla版面layout 實例:花蓮縣消防局 5

版面確定

確認版面區塊

版面確定

確認版面區塊

Index.php

導入css檔案

Joomla自訂標籤

<jdoc:include type="[類型]" name="[名稱]" />

Index.css

Joomla 後台安裝樣版

www.des13.com

des13@des13.com

鼎益盛網頁設計 專業、實在、負責

Thank you for

your listening!