電子商務網站架設技術外部連結

建國科大資管系饒瑞佶2014/4

零售業批貨技巧與網拍架站創業訓練班

Google Maps

Download Google maps modulehttp://www.opencart.com/index.php?route=extension/extension/info&extension_id=5561

安裝• 解壓縮

• Catalog目錄內所有資料複製到 c:\appserv\www\store\catalog• admin目錄內所有資料複製到 c:\appserv\www\store\mycart

Install Google Maps extension

Add Maps

先加入一個地圖點請參考my_maps1.htm

地圖點編號，設定顯示連結用

Add Module

地圖點編號，設定顯示連結用

設定出現位置

首頁

YouTuBe

http://www.opencart.com/index.php?route=extension/extension/

info&extension_id=335&path=5&filter_license=0&filter_download_id=28&page=3

安裝• 將解開後的 catalog 與 admin目錄內的檔案覆蓋原本網站上內容

• 記得 admin內的檔案要複製到mycart

影片編號

影片大小

影片出現位置

Google Translate

http://www.opencart.com/index.php?route=extension/extension/

info&extension_id=5368&path=5&filter_license=0&filter_download_id=28&page=3

安裝• 將解開後的 catalog 與 admin目錄內的檔案附蓋原本網站上內容

• 記得 admin內的檔案要複製到mycart

翻譯器出現位置

Visitor Counter

http://www.opencart.com/index.php?route=extension/extension/

info&extension_id=882&path=5&filter_license=0&filter_download_id=28&page=6

計數方式

計數器出現位置

計數器文字與底色

加入 SNS連結

http://www.opencart.com/index.php?route=extension/extension/

info&extension_id=3343&path=5&filter_license=0&filter_download_id=28

Install guide

• 1) copy catalog folders in the root folder of your website

• 2) go to catalog\view\theme\default\stylesheet\stylesheet.css and at the end of file add:

go to catalog\view\theme\default\stylesheet\stylesheet.css and at the end of file add

div#twitter{position:fixed;width:72px;height:72px;bottom:0px;right:2px;

}div#Xing{

position:fixed;width:72px;height:72px;bottom:0px;right:2px;

}div#Facebook{

position:fixed;width:72px;height:72px;bottom:0px;right:2px;

}div#Youtube{

position:fixed;width:72px;height:72px;bottom:0px;right:2px;

}

if you want to integrate it into the Home page only go to catalog\view\theme\default\template\common\home.tpl and after <?

php echo $footer; ?> add

</div><div id="Ntezwerk"><div align="center"> <a target="_blank" href="https://www.xing.com/" title="visit us by

Xing"><img alt="" src="catalog/view/theme/default/image/xing-icon72.png"/></a>

<a target="_blank" href="http://twitter.com" title="Follow us on twitter"><img alt="" src="catalog/view/theme/default/image/twitter-icon72.png"/></a>

<a target="_blank" href="http://www.facebook.com" title="visit us by Facebook"><img alt="" src="catalog/view/theme/default/image/facebook-icon72.png"/></a>

<a target="_blank" href="http://www.youtube.com/" title="visit us by Youtube"><img alt="" src="catalog/view/theme/default/image/youtube-icon72.png"/></a>

<g:plusone size="tall"></g:plusone></div>

result

if you want to integrate it into the footer,so it shows on every pagego to catalog\view\theme\default\template\common\footer.tpl and after <div

id="powered"><?php echo $powered; ?> add

</div><div id="Ntezwerk"><div align="center"> <a target="_blank"

href="https://www.xing.com/" title="visit us by Xing"><img alt="" src="catalog/view/theme/default/image/xing-icon72.png"/></a>

<a target="_blank" href="http://twitter.com/" title="Follow us on twitter"><img alt="" src="catalog/view/theme/default/image/twitter-icon72.png"/></a>

<a target="_blank" href="http://www.facebook.com/" title="visit us by Facebook"><img alt="" src="catalog/view/theme/default/image/facebook-icon72.png"/></a>

<a target="_blank" href="http://www.youtube.com/" title="visit us by Youtube"><img alt="" src="catalog/view/theme/default/image/youtube-icon72.png"/></a>

<g:plusone size="tall"></g:plusone></div>

result

延伸• 表示可以依此方式任意增加自己需要的link

• 例如建國科大

利用 FB做產品 Comments

利用 FB做產品 Commentshttp://developers.facebook.com/docs/plugins/

選擇 Comments

填寫資料

網址

寬度

資料筆數

顏色

取得 code

加入 codeC:\AppServ\www\store\catalog\view\theme\default\template\product\product.tpl

before

after

網址或 IP

最上方還要加入 JavaScript code

result