|
[添加flash篇]
現(xiàn)在為止知道的兩種方法：
1.采用頁面相套
具體方法：
1).先在自己的電腦上用網(wǎng)頁編輯器制作帶有目標(biāo)FLASH 的htm頁面，然后上傳到自己的googlepages。
2).用套用這個(gè)代碼，尺寸自己調(diào)整
<IFRAME border=0 name=x_book marginWidth=0 marginHeight=0 src="http://xxxx.googlepages.com/*.htm (剛剛做的htm)" frameBorder=0 width=650 height=360></IFRAME>
3).弄好之后在googlepages里通過html editor在線編輯功能，將上面的代碼粘貼到想要添加flash的功能。publish
完成。
演示地址：http://chaoup.googlepages.com/
2.直接在自己的電腦上用網(wǎng)頁編輯器制作帶有目標(biāo)FLASH 的htm頁面，然后上傳到自己的googlepages。
該flash的顯示地址是 ：http://xxxx.googlepages.com/*.htm
如有更好的方法，請(qǐng)?jiān)诖胃N，我們加上。同時(shí)感謝lc00 提供的第一種方法。
[添加在線音樂篇]
描述：你將可以聽一些你上傳到google page里的mp3音樂。
示例：http://gfansbbs.googlepages.com/onlinemusic.htm
教程：
該效果的實(shí)現(xiàn)需要添加部分javascript，但是google pages不支持javascript，你需要在自己的電腦上做好后在上傳。
1.添加
<script type="text/javascript" src="http://del./js/playtagger"></script>
該部分腳本添加到</head>前面。
2.添加
<ul><li><a href="/YourSong.mp3">你的歌曲</a></li></ul>
這段代碼就沒有特別的位置限制了。
不要忘記了上傳你的mp3文件到google page 里。
ps：如果你想要添加更多的音樂，可以用下面的代碼
<ul> <li><a href="/YourSong1.mp3">Your Song1</a></li> <li><a href="/YourSong2.mp3">Your Song2</a></li> </ul>
描述：你將可以在google page中實(shí)現(xiàn)文字的移動(dòng)效果。
演示：http://gfansbbs.googlepages.com/moving.htm
教程：
只需將下面的代碼添加如google page文件的代碼中即可：
<p class="description"> <div id="g_description">
<font color="#FF0000"><marquee>想要添加的移動(dòng)文字</marquee></font></div></p>
代碼放置的位置，你可以自己選。
[添加計(jì)數(shù)器篇]
1.在自己的gpc上添加計(jì)數(shù)器
在提供計(jì)數(shù)器的網(wǎng)站注冊(cè)一個(gè)賬戶，[提供一個(gè)較好的免費(fèi)計(jì)數(shù)器：http://www.]，當(dāng)你注冊(cè)成功后，statcounter就會(huì)要求你設(shè)置有關(guān)網(wǎng)站計(jì)數(shù)器的顏色、樣式等等細(xì)節(jié)。這些細(xì)節(jié)設(shè)置完畢，statcounter將自動(dòng)生成一段HTML代碼，添加這段代碼到你的googlepages的相應(yīng)頁面的相應(yīng)位置就可以了。如果你對(duì)HTML語言一點(diǎn)都不了解，那也沒有關(guān)系，下面我教你一步一步地設(shè)置。
- 復(fù)制statcounter自動(dòng)生成的那段HTML代碼，
- 打開googlepage中相要添加計(jì)數(shù)器的頁面，
- 選擇編輯頁面的Edit HTML[在頁面的左側(cè)]
- 粘貼你復(fù)制的HTML代碼到HTML-editor中HTML-code 的尾部，注意一定要加在"<body><html>"前面。
- Save, Publish, 你就完成了添加計(jì)數(shù)器。簡單吧
[添加google maps篇]
首先我們申明：關(guān)于google pages的教程都為我站原創(chuàng)，我們希望大家在轉(zhuǎn)載我站內(nèi)容是注明“轉(zhuǎn)載于——搜索風(fēng)”。我們發(fā)現(xiàn)很多的網(wǎng)站轉(zhuǎn)載了我站得教程，沒有注明出處，對(duì)于這種行為我們表示憤怒與鄙視，同時(shí)也會(huì)采取技術(shù)手段。
演示：http://gfansbbs.googlepages.com/-maps.htm
描述：可以讓google maps在你的google page上顯示。
教程：
1.將google page空白頁面 另存為 的 形式保存在自己的pc上面。取名為-maps[格式為htm]。
2.到google maps developer site 注冊(cè)一個(gè)google maps API，你會(huì)得到一個(gè)KEY碼。
3.用網(wǎng)頁編輯器打開文件 -maps.htm
4.在</head> 標(biāo)簽之前添加
<script src="http://maps.google.com/maps?file=api&v=1&key=[你自己的KEY 碼]="text/javascript"></script>
5.添加下面的代碼到任何你想要 的位置：
<div id="map" style="width: 400px; height: 300px"></div>
<script type="text/javascript" defer="defer">
var map = new GMap(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.centerAndZoom(new GPoint(-73.972, 40.747), 4);
var point = new GPoint(-73.972, 40.747);
map.addOverlay(new GMarker(point));
</script>
</div>
其中(-73.972, 40.747)可以變，這個(gè)是地球的經(jīng)緯度值。如果你不知道怎么取經(jīng)緯度值，你可以在 這個(gè)國外的網(wǎng)站得到。
6.保存，上傳就可以了。
[添加反饋表格篇]
描述：你google page將可以在線給你反饋一些關(guān)于網(wǎng)站的信息，這些信息將直接發(fā)送到你的email中。
演示：http://gfansbbs.googlepages.com/form.htm
教程：在這里注冊(cè)一個(gè)賬戶，注冊(cè)完畢后，你可以選擇表格樣式等等資料，然后，bravenet會(huì)給自動(dòng)生存一段代碼。你將代碼添加到你的google page中即可。
bravenet自動(dòng)生存的代碼如下：
<form> <input type="hidden" name="cpv" value="2" /> <!-- DO NOT CHANGE OR REMOVE THE 3 TAGS ABOVE THIS COMMENT --> <div style="padding: 2px;"> <div style="font: normal 11px Arial, Sans-Serif;">Name:<br> <input type="text" name="name" height="10" style=" font: normal 11px Arial, Sans-Serif;"> </div> <div style="padding-top: 8px; font: normal 11px Arial, Sans-Serif;">E-Mail:<br> <input type="text" name="email" height="10" style=" font: normal 11px Arial, Sans-Serif;"></div> <div style="padding-top: 8px; font: normal 11px Arial, Sans-Serif;">Country:<br> <select name="country" height="10" style=" font: normal 11px Arial, Sans-Serif;"> <option>North America</option> <option selected="true"> United States of America</option> <option> Canada</option> <option> </option> <p> <option>Europe</option> <option>Austria</option> <option> Belgium</option> <option> Finland</option> <option> France</option> <option> Germany</option> <option> Greece</option> <option> Italy</option> <option> Netherlands</option> <option> Norway</option> <option> Portugal</option> <option> Spain</option> <option> Sweden</option> <option> Switzerland</option> <option> United Kingdom</option> <option> Rest of Europe</option> <option> </option> <option>Eastern Europe</option> <option> Czech Republic</option> <option> Hungary</option> <option> Poland</option> <option> Russia</option> <option value="0" > Rest of Eastern Europe</option> <option value="0"> </option> <option>Asia Pacific</option> <option> Australia</option> <option> Hong Kong</option> <option> India</option> <option> Japan</option> <option> Korea</option> <option> Mainland China</option> <option> Malaysia</option> <option> New Zealand</option> <option> Taiwan</option> <option> Rest of Asia</option> <option> </option> <option>Middle East</option> <option> Turkey</option> <option> Rest of the Middle East</option> <option> </option> <option>Latin America</option> <option> Brazil</option> <option> Mexico</option> <option> Rest of Latin America</option> <option> </option> <option>Africa</option> <option> South Africa</option> <option> Rest of Africa</option> </select></div> <div style="padding-top: 8px; font: normal 11px Arial, Sans-Serif;">comments:<br> <textarea cols="25" rows="10" name="comments" style=" font: normal 11px Arial, Sans-Serif;"> Type your comments here.</textarea></div> <div style="padding-top: 8px; font: normal 11px Arial, Sans-Serif;">What do you like:<br> Apples or Oranges?<br> <span style="font: normal 11px Arial, Sans-Serif; padding-left: 10px;">Apples</span> <input type="radio" name="fruit" value="Apples" style="border:0px;"> <span style="font: normal 11px Arial, Sans-Serif;">Oranges</span> <input type="radio" name="fruit" value="Oranges" style="border:0px;"></div><br> <div style="padding-top: 8px; font: normal 11px Arial, Sans-Serif;">Favorite Color(s):<br> <span style="font: normal 11px Arial, Sans-Serif; padding-left: 10px;">Blue</span> <input type="checkbox" name="colors" value="Blue" style="border:0px; margin: 0 7px 0 5px;"> <span style="font: normal 11px Arial, Sans-Serif;">Green</span> <input type="checkbox" name="colors" value="Green" style="border:0px; margin: 0 0 0 5px;"><br> <span style="font: normal 11px Arial, Sans-Serif; padding-left: 10px;">Pink</span> <input type="checkbox" name="colors" value="Pink" style="border:0px; margin: 0 7px 0 7px;"> <span style="font: normal 11px Arial, Sans-Serif;">Red</span> <input type="checkbox" name="colors" value="Red" style="border:0px; margin: 0 0 0 16px;"></div> <br> <input type="submit" name="submit" value="Submit"><input type="reset" name="reset" value="Reset" style="margin-left: 10px;"> </form> 當(dāng)然你也可以根據(jù)你的需求適度的修改代碼。上述代碼，你可以自己的需要將部分代碼修改，比如”name“修改為“姓名”“country”改為“國家” 等等。
[添加google video篇]
描述：你將可以在google page上添加任何http://video.google.com/上可以提供的video。
示例：http://gfansbbs.googlepages.com/googlevideo.htm
教程：
為了添加google video，我們必須添加一段代碼，代碼如下[你可以直接復(fù)制]
<embed style="width:400px; height:326px;" id="VideoPlayback0" align="middle" type="application/x-shockwave-flash" src="http://video.google.com/googleplayer.swf?videoUrl=http%3A%2F%2Fvp.video.google.com%2Fvideodownload%3Fversion%3D0%26secureurl%3DoQAAAPXhqGFm66n3aw_97JuqIsSlHA9icacxpqsc2fVGLExmt-A2NHLuP7nmF5L-GtUqEKqqdSmCGOxfMn4BM8ixd7Lk07XWev11NFKyKG7pPcLL3DhPo0cpvQDVpVHfLh2BO3zo5KPVw6yI9nR-5kWDoeqXXQ5EhwGyWWQdbHh3iiWfa8uIwdh01GOmkXRFvD_E9cgWzP13M9Rf_ve5rmlw0tyxB0Jl67r5GK4O11NQDGpt%26sigh%3DVGccijslI38KihvV9IHLVehWBUU%26begin%3D0%26len%3D35433%26docid%3D-1179199752553564847&thumbnailUrl=http%3A%2F%2Fvideo.google.com%2FThumbnailServer%3Fcontentid%3D7547ca8caa119fba%26second%3D5%26itag%3Dw320%26urlcreated%3D1143380351%26sigh%3DRvr72aiKv0M1ykiggswDCiCJ8kQ&playerId=-1179199752553564847" allowScriptAccess="sameDomain" quality="best" bgcolor="#ffffff" scale="noScale" wmode="window" salign="TL" FlashVars="playerMode=embedded">
這段代碼的添加方法如同html的編輯，沒有特別的地方。
對(duì)于上面的代碼，它是 google video的文件地址，你可以在google video網(wǎng)站上可以找到。
[直接從GPC登陸gmail篇]
<form action="https://www.google.com/accounts/ServiceLoginAuth" method="post" style="margin: 0px;"> <input name="continue" value="http://gmail.google.com/gmail" type="hidden"> <input name="service" value="mail" type="hidden"> <input name="rm" value="false" type="hidden"> <p style="line-height: 200%;"><input name="Email" alt="" type="text"> login<br><input name="Passwd" maxlength="25" alt="" type="password"> password<br><input value="sign in" type="submit"> </p> </form> 只要將這個(gè)代碼添加到GPC就可以了。
演示
http://gfansbbs.googlepages.com/login
[添加guestbook篇]
1.訪問HTMLgear ，
2.單擊 Get this gear，注冊(cè)一個(gè)賬戶;
3.選擇你喜歡的guestbook樣式，
4.單擊"save & create". HTMLgear會(huì)生成一個(gè)guestbook的代碼。
5.登陸你的Google Page creator，在你想要制作guestbook的頁面添加HTMLgear生成的guestbook的代碼。記住將代碼放在"<body><html>"前面。
[如何使pc上制作與GPC模版相同外觀的頁面篇]
我想很多的人都在制造googlepages，但是由于google的限制，許多的功能都不能實(shí)現(xiàn)，并且google的home頁面時(shí)無法刪掉的。
為了讓自己的頁面看起來協(xié)調(diào)一致，我們不得不突破google的限制。廢話少說，現(xiàn)在來教大家怎樣讓自己在pc上制作的頁面與google模版有相同的外觀。
其實(shí)很簡單，方法如下：
1）選定自己喜歡的模版，同時(shí)用這個(gè)模版在googlepages上做一個(gè)頁面。
2）在瀏覽器的左上角，文件〉另存為〉[存為html文件]
3）用網(wǎng)頁編輯器打開，開始你的修改制作過程，
4）制作完畢，上傳。
5）在其他頁面鏈接此頁即可。
FINISH！
在Googlepage里運(yùn)用TiddyWiki的教程
如何在Googlepage里運(yùn)用TiddyWiki，下面是一個(gè)簡單的步驟：
1.到敝小站（http://icomesee.googlepages.com/wiki.html）或者TiddlyWiki 使用教學(xué)中文（http://web.nlhs./~lss/wiki/TiddlyWikiTutorialTW.html）去了解TiddyWiki是怎么被利用的；
2.下載一個(gè)最新版本的空TiddyWiki（這是一個(gè)獨(dú)立的大小不足200K的Html文件，你所有的編輯工作都是在這個(gè)單一的文件里操作，你所有加入的文本內(nèi)容也都在這個(gè)文件里，圖片除外）。
下載地址：TiddyWiki官方網(wǎng)站（[url]http://www.英文好的進(jìn)），或是直接下載我提供的中文版(http://icomesee.googlepages.com/empty.rar）。
(注意：當(dāng)你使用IE編輯的時(shí)候，在保存的時(shí)候可能有問題，建議下載一個(gè) FireFox)
3.結(jié)合TiddlyWiki 使用教學(xué)中文版（http://web.nlhs./~lss/wiki/TiddlyWikiTutorialTW.html）教程，開始摸索如何運(yùn)用TiddyWiki;
4.當(dāng)你已經(jīng)可以運(yùn)用TiddyWiki的時(shí)候，思考一個(gè)問題如何將TiddyWiki整合到GPC里？有兩種方式：a.用iFrame調(diào)用~TiddyWiki成為你GPC內(nèi)的某個(gè)頁面；b.直接以頁面跳轉(zhuǎn)代碼將~TiddyWiki作為你的GPC主頁面。我是采用了a方式。
5.如果決定采用a方式，你需要修改TiddyWiki的頁面風(fēng)格來與你本來的網(wǎng)頁一致，這需要通過修改StyleSheetColors,PageTemplate,StyleSheetLayout這幾個(gè)Tiddler來實(shí)現(xiàn)。你會(huì)發(fā)現(xiàn)TiddyWiki官方網(wǎng)站提供的empty.html文件是以籃色調(diào)為背景的，我正是通過修改，使得本頁面以紅、灰顏色為主。
6.在調(diào)整好你的TiddyWiki后，將其上傳到GPC里，通過iFrame或者是頁面跳轉(zhuǎn)來引用該頁面。引用后的TiddyWiki是無法修改的，你會(huì)發(fā)現(xiàn)本頁面中每個(gè)Tiddler原來的edit按鈕都變成了view，其它一些編輯功能也都隱藏了。在這種情況下TiddyWiki只能作為你個(gè)人的內(nèi)容展示，而無法與網(wǎng)絡(luò)其他用戶互動(dòng)。
7.后期更新：在你的本地電腦修改TiddyWiki頁，需要的時(shí)候，重新上傳至GPC里即可。
XHTML之動(dòng)畫文字篇
XHTML之動(dòng)畫文字篇
I. <marquee>標(biāo)簽
只適用于Internet Explorer（官方不推薦使用，不過好像firefox也可以顯示動(dòng)畫文字……）
<marquee>標(biāo)簽和屬性值被其他瀏覽器忽略，但它的內(nèi)容不會(huì)被忽略
A. align屬性
top , middle , bottom 之一，表示字母指定點(diǎn)將與周圍文字的相應(yīng)點(diǎn)對(duì)齊方式。
B. behavior , direction , loop屬性
behavior屬性
三個(gè)值：scroll （默認(rèn)）, alternate（） , slide（）
direction屬性
兩個(gè)值：left（默認(rèn)，從右向左）, right（從左向右）
loop屬性
可以是infinite 或者整數(shù)值
C. bgcolor屬性
允許改變字幕區(qū)域的背景顏色，接受RGB顏色值或標(biāo)準(zhǔn)顏色名
D. height和width屬性
兩個(gè)屬性可以接受數(shù)值或者百分比
E. hspace和vspace屬性
需要整數(shù)值
F. scrollamount和scrolldelay屬性
scrollamount
滾動(dòng)過程中文字每次移動(dòng)的象素?cái)?shù)
scrolldelay
設(shè)置滾動(dòng)過程中文字相鄰兩次移動(dòng)之間的時(shí)間間隔
|
