主页 > 分享之美 >[教学]透过Dropbox建立免费HTML网页空间 (Pan >

  • [教学]透过Dropbox建立免费HTML网页空间 (Pan


    2020-05-22


    Dropbox 的应用非常多,这回来分享一下透过「Pancake.io」建立最基本的HTML网页空间利用。让免费2GB储存空间瞬间变成2GB免费HTML空间还支援SSL(HTTPS)网页、还可以绑定网址。2GB空间不算多,但是Dropbox总有一些活动或者是购买特定手机或服务都会赠送免费空间,或者是真的需要觉得不错也可以花钱购买Dropbox付费方案来使用。

    透过Dropbox搭配Pancake.io现在也能呈现HTML网页,让你不再苦于寻找稳定的免费空间,现在Dropbox就现成免费给你用。不过使用这种云端储存空间有一个要点需要注意,网站的流量不能太大,若网站流量过大可能帐号会被暂停或者是永久停权等状况发生的可能,所以简易的网页DEMO,像是你可能用jQuery做了一些网页特效药呈现範例档案给大家,可以善用Dropbox+Pancake.io。

    Dropbox的第三方服务应用非常多,我们介绍过自动备份WordPress到Dropbox、Dropbox代抓服务、MultCloud云端空间大串联、DropPages打造个人网站等相关应用。但这回我们要来回归基本面,利用Dropbox本身的「public」公开分享功能,把你製作好的网页丢到Dropbox上,成为一个可以预览的网页,有时候学校要交作业、要DEMO网页,都可以利用这样来呈现,不用苦恼找不到免费空间。

    前一阵子,大家疯狂使用Google Drive云端硬碟做为纯网页HTML空间,但是Google大神总爱修改规则,导致于后期根本无法正确地透过Google云端硬碟来当HTML空间,原因在于Google会修改网址造成若有引用其他档案资源,网页的特效可能无法呈现的诸多问题,现在虑用最简单的Dropobx就可以满足你的需求,立刻把网页轻鬆DEMO给大家看。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    香肠原先要介绍Dropbox的公开资料夹功能,后来发现网站上已经在2012年做了声明:

    自 2012 年 10 月 4 日起,新建立的 Dropbox 帐户不再拥有公开资料夹。别担心,您可以透过分享连结与好友和同事快速分享档案,就算他们没有 Dropbox 也没关係。

    如果您帐号为该时间之前注册,那幺你还是可以拥有公开资料夹功能。如果在该时间之后,资料夹就无法当成网页空间只能变成dropobx档案清单。为了满足很多人在Google Drive或Dropbox上寻找免费空间的需求,香肠找到了「Pancake.io」这个服务可以来做搭配,只要透过授权认证,即可把Dropbox的2GB当成免费网路空间。

    网站名称:Pancake.io网站网址:https://www.pancake.io/尚未拥有Dropbox,可以直接注册Dropbox或者是参考Dropbx注册教学。此服务还可以帮Dropbox 设定专属网址

    第1步 来到PANCAKE网站,这个网站提供git串接和Dropbox串接,不过我们先选择比较平民化、简单的Dropbox。执行串接之前,先点右上角﹝Sign up﹞进行注册。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第2步  直接输入你想要注册的信箱和密码(不是Dropbox信箱密码,别输入错了)。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第3步  注册完毕后点选左上【Projects】,进入后点﹝+ Create a new prokect﹞建立一个新专案。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第4步  Pancake.io网站提供Dropbox和Git串接,我们选择【Dropbox】,然后点下﹝+ create﹞。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第5步  这时会跳转到Dropbox的授权网页,如果需要登入Dropbox请直接登入,之后会看到以下画面,请点选﹝允许﹞让Pancake.io网站可以存取应用程式内的Pancake.io资料夹。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第6步  这时又会回到Pancake.io网站,请再次点﹝+ Create a new prokect﹞。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第7步  再次选择【Dropbox】然后点下﹝+ create﹞。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第8步  这时候Pancake网站就会自动帮您建好一个新专案,预设会帮您塞入两个範例档案,example和index。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第9步  点选【Settings】进入后可以调整专案的名称与此专案的网址,然后点下右下角﹝Update project﹞。

    Name:专案名称,香肠测试输入中文会异常,那就改输入英文吧!Subdomain:Pancake免费提供的次级网域,直接输入您想要的名称。URL:可以绑定自己的网址。Favicon:网址列的小图。Root folder:网站根目录,可以保持预设。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第10步  点选【Files】回到专案内的档案清单,您可以点﹝edit﹞就可以直接在pancake网站进行编辑。这两个DEMO档案早已经存在你的Dropbox空间啰!

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第11步  这是线上提供的编辑器,有储存(Save)、储存为(Save As…)、预览(Preview)、帮助(Help)等基本功能,预设这个是Markdown撰写方式,当然您也可以建立纯html档案(详细可参考官方说明)。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第12步  这是官方的预设index.txt于网页显示出来的样子。

    测试网址:http://sofree.pancakeapps.com/

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第13步  你可以登入你的Dropbox后,找到「Dropbox>应用程式>Pancake.io」,这边可以直接把你做好的网页直接拖曳档案上来,测试后可以支援js、html、css等基本纯HTML网页档案。例如香肠拉了一个「blogroll」资料夹,等待上传完毕即可。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第14步  上传后,来试试看网页,是不是就顺利读取到档案了呢?

    测试网址:http://sofree.pancakeapps.com/blogroll

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    第15步 上传的HTML档案也可以在Pancake网页中做线上编辑,当然您也可以在本地安装dropbox进行同步编辑,也是不错的选择。

    [教学]透过Dropbox建立免费HTML网页空间 (Pan

    Dropbox 透过Pancake.io即可活化成纯免费HTML空间,让你不需要苦于寻找免空,透过他就可以轻鬆拥有。不过小网站、测试站可行,但是大网站建议您还是寻求付费主机空间比较恰当。另外,此服务也能搭配自订网域,帮你的Dropbox绑上自己专属的个人网域!



    上一篇:
    下一篇: