網路相簿太單調嗎?TiltViewer讓你的相簿「動」起來!

13
17,447 人次

小技巧:沒有自己的網頁空間怎麼辦?

如果沒有自己的網頁空間,要怎麼上傳TiltViewer這隻程式呢?很簡單,這邊教你一個小技巧,只要你有Google或Gmail的帳號就行! 方法就是利用免費的Google Page Creator (Google的免費網頁空間),步驟如下:

  1. 先打開瀏覽器連接到 http://pages.google.com ,輸入自己的帳號密碼登入。
  2. 進入之後有簡單的使用條款畫面,按下接受即可進入。
    image
  3. 之後會出現編輯畫面,先別管它,按下左上角的「Back to Site Manager」,進入「網站管理員」即可。
    image
  4. 按下主畫面右方的〔upload〕按鈕,即可上傳檔案,將剛才tiltviewer裡面的檔案上傳即可。
    image
  5. 輸入網址: http://你的google帳號.googlepages.com/index.html ,就會出現TiltViewer畫面了,簡單吧!
  6. 如果我不想輸入網址裡面的index.html怎麼辦?很簡單,先到「網站管理員」,按一下中間有房子圖示的檔案(即首頁檔)
    image
    進入編輯畫面之後,按下畫面最右下角的[edit html]連結,然後貼上:

    <script type="text/javascript">
    window.location.href="index.html";
    </script>

    按下畫面下方的〔Update〕按鈕來儲存頁面,最後再按下畫面上方的〔Publish〕即可發布至網頁上。
    image 
    如此一來你的網址後面就不用輸入index.html,變成http://你的google帳號.googlepages.com,是不是很方便呢?

PS:

  1.  一個Google帳號可以建立三個Google Pages網頁,只要在「網站管理員」畫面上方的下拉式選單中,選擇「Create another site」即可建立新的網站。
  2. 在Google Pages 裡面無法建立資料夾,因此如果你要展示多組相簿,可以事先將index.html複製多份再上傳。如果你要用前述的方法一,手動建立相簿,記得gallery.xml裡面的相片路徑中的"imgs/”要去掉,然後把照片直接上傳到Google Pages裡面(但是太多的話可能會有些混亂,不好整理,因此不建議使用)
  3. 每個Google Page網站有100MB的容量限制。因此每個Google帳號可建三個就等於有300MB的空間了。

13 意見

  1. 你的教學真的太棒啦!!
    但現在google page已經不能用了
    只能用google site
    請問在google site要如何upload”TiltViewer”資料夾呢
    我在google site裡找了半天找不到site manager>”<
    大感謝*心*

  2. 大大 您好

    這陣子在找嵌入式系統設計相關的部落格,意外發現你的內容滿豐富也滿有深度

    最近我也成立【嵌入式設計學院】部落格,http://www.wretch.cc/blog/cdpda

    內容包含嵌入式系統設計‧QT圖形開發‧Linux Device Driver‧科技人甘苦談‧ETC幫幫忙

    有空可以來留言! 網址:http://www.wretch.cc/blog/cdpda

  3. 老師您好!

    拜見您的用TiltViewer這套簡單的網頁小程式,我也照您所說的做,不過圖片飛不進來。

    請問出了什麼問題? http://www.fulin.hostwq.net/tiltviewer/index.html
    下列是程式碼,請幫我看一下,好嗎? 我的flickr是50354130@N03

    TiltViewer

    /* hide from ie on mac \*/
    html {
    height: 100%;
    overflow: hidden;
    }

    #flashcontent {
    height: 100%;
    }
    /* end hide */

    body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #000000;
    color:#ffffff;
    font-family:sans-serif;
    font-size:40;
    }

    a {
    color:#cccccc;
    }

    TiltViewer requires JavaScript and the latest Flash player. Get Flash here.

    var fo = new SWFObject(“TiltViewer.swf”, “viewer”, “100%”, “100%”, “9.0.28”, “#000000”);

    // TILTVIEWER CONFIGURATION OPTIONS
    // To use an option, uncomment it by removing the “//” at the start of the line
    // For a description of config options, go to:
    // http://www.airtightinteractive.com/projects/tiltviewer/config_options.html

    //FLICKR GALLERY OPTIONS
    // To use images from Flickr, uncomment this block
    //fo.addVariable(“useFlickr”, “true”);
    //fo.addVariable(“user_id”, “50354130@N03”);
    //fo.addVariable(“tags”, “jump,smile”);
    //fo.addVariable(“tag_mode”, “all”);
    //fo.addVariable(“showTakenByText”, “true”);

    // XML GALLERY OPTIONS
    // To use local images defined in an XML document, use this block
    fo.addVariable(“useFlickr”, “true”);
    fo.addVariable(“xmlURL”, “gallery.xml”);
    fo.addVariable(“maxJPGSize”,”640″);

    //GENERAL OPTIONS
    fo.addVariable(“useReloadButton”, “false”);
    fo.addVariable(“columns”, “3”);
    fo.addVariable(“rows”, “3”);
    //fo.addVariable(“showFlipButton”, “true”);
    //fo.addVariable(“showLinkButton”, “true”);
    //fo.addVariable(“linkLabel”, “View image info”);
    //fo.addVariable(“frameColor”, “0xFF0000”);
    //fo.addVariable(“backColor”, “0xDDDDDD”);
    //fo.addVariable(“bkgndInnerColor”, “0xFF00FF”);
    //fo.addVariable(“bkgndOuterColor”, “0x0000FF”);
    //fo.addVariable(“langGoFull”, “Go Fullscreen”);
    //fo.addVariable(“langExitFull”, “Exit Fullscreen”);
    //fo.addVariable(“langAbout”, “About”);

    // END TILTVIEWER CONFIGURATION OPTIONS

    fo.addParam(“allowFullScreen”,”true”);
    fo.write(“flashcontent”);

發表迴響