百韵网 >>  正文

怎样在GitHub免费创建网站和域名 如何通过GitHub免费搭建在线网页

来源:www.baiyundou.net   日期:较早时间
工具/材料 电子邮箱账号
01
通过搜狗搜索GitHub,进入到这个官方网站,这个网站的性质是全世界最大的极客交流平台,点击【sign up】进行账号注册,如果已经有了账号,可以点击【sign in】进行登陆。。
02
注册的时候需要填写这个用户名,电子邮箱和密码,电子邮箱填写自己正常使用的,因为到后面需要进行邮箱验证。密码需要复杂,包括字母和数字才能设置成功。
03
GitHub这里有免费版和会员版,普通用户点击第一个免费版本就可以正常使用建站功能了。
04
然后是一个问卷调查表,主要就是了解一下你的编程水平、自己的身份和注册的目的。
05
注册完成后会跳转到下面的界面,点击【start a project】,意思是创建一个项目
06
在这里需要验证邮箱地址才能创建成功,这就是之前告诉大家注册的时候要使用自己常用的邮箱的原因。
07
打开自己的邮箱,登陆账号,点击邮箱中的【verify your email】,就会再次跳转到GitHub官网
08
这里我们点击创建项目就可以正常创建了。
09
在仓库中进行命名创建一个仓库,仓库用于存放网页的代码,网页的素材,可以交权限设置为共享,或者是建私人可见。
10
创建成功之后呢,有一行选项卡,点击最后一个【setting】
11
界面向下滚动,找到【GitHub pages】,点击下面的主题,【choose a theme】
12
这里,我们就选择第一个主题,主要差别就是背景。
13
之后在代码也可以看到自己的用户名以及这个仓库名,代码在中间部位可以进行编辑。
14
那我们这个网站的网址是什么呢?我们再次点击【setting】
15
同样找到【GitHub pages】,在下面就会出现自己的网站域名,点击即可进行访问
16
这里就可以看到我们之前选中的主题,大概就是下面的这个样子。
17
回到网页代码编辑器,我们可以将代码进行修改,比如将网页的这个前面几个字改为 欢迎来到我的酷知网。
18
修改代码需要点击下面的保存修改,然后进行提交,在界面底部有一个绿色按钮,点击即可。
19
然后我们再访问自己的网站,使用F5刷新 ,如果你网页修改的篇幅比较大,它这个服务器会有缓存的时间需要稍微等待一会儿才会在网页上显示。
20
怎样将网页分享给别人?
我们创建域名,设计网页不是为了给自己看,需要通过一定的方法将网页进行分享,这里可以使用下面图片中的工具将网页,用二维码分享给别人。
21
选中转化网址,将网页粘贴过来,点击生成二维码
22
二维码的样式可以修改,最主要的是可以将其下载下来。
23
之后我们就可以将这个二维码,通过QQ,微信等方式分享给好友,让我的网站得到充分的传播。
特别提示
代码修改后不会立即同步,需要稍等。

可自行安装DEDES、SHOPEX、DZ等常用的网站程序。

如何通过GitHub免费搭建在线网页~

  拥有下列条件才能使用此方法:
  (此项内部问题请自行度娘)
  1.你需要拥有一个GitHub账号;
  2.你需要安装git程序;
  3.你需要掌握基本的电脑以及网页编辑相关知识;
  下面只是简略列出快速搭建网页的步骤(该步骤为windows系统下方法)
  (重要)建立项目主页步骤:
  1.打开How people build software · GitHub (官网),登录;
  2.点击右上角“+”,新建一个repository(仓库);
  ??? a.填写"repository name"仓库名(必需)和"Description"描述(可选);
  ??? b.类型默认选择为public.(此处无需更改,private为私人类型需要花钱购买该项服务);
  ??? c.勾选项"Intialize this repository with a Readme"为初始化(可选);
  ??? d.点击"Create repository"按钮;
  3.创建用于页面展示的gh-pages分支;
  ??? a.点击"settings";
  ??? b.在options下右侧显示内容拉至下部找到GitHub Pages栏;
  ??? c.点击"Automatic page generator"按钮跳转到编辑页面;
  ??? d.在接下来的操作中基本都不用管,一路点绿色按钮直到点击"publish page"按钮结束;
  ??? e.此时已创建完用于展示的默认页面;
  4.克隆仓库到本地并在本地将你需要展示的内容文件上传到gh-pages分支;
  ??? a.在你本地用来安放仓库的目录下右键选择"git bash here"会弹出git命令窗口;
  ??? b.在命令窗口中输入 "git clone https://github.com/用户名/仓库名" 从远程库中克隆到本地生成对应的仓库名文件夹;
  ??? c.双击(仓库名)文件夹;
  ??? d.在命令窗口中输入 "git checkout -b gh-pages origin/gh-pages" 在本地新建一个由远程"orgin/gh-pages"分支下面分化出来的"gh-pages"(暂时不懂也无所谓,执行这句就行);
  ??? e.然后输入命令 "git rm -rf ."删除当前仓库目录下的所有(步骤2中创建分支时系统默认生成的)文件;
  ??? f.直接在此处编辑你用来展示页面的文件或者将你需要用来展示页面的文件放到此目录下;
  ??? g.在命令窗口中输入 "git add ."缓存当前目录下的所有文件['.'代表全部,如果只是修改/更新请将'.'换成需要更改的文件(夹)名];
  ??? h.在命令窗口中输入 "git commit -m '注释内容' "? 提交文件到当前仓库;
  ??? i.在命令窗口中输入 "git push origin gh-pages"? 推送文件到远程仓库(此处最后需要你输入你的用户名和密码);
  另外,如果已经完成过上面步骤,但是后面想修改前面的文件内容时:
  按顺序执行第3步中的"c"、"a"、"g"、"h"、"i"即可;
  至此,项目页面展示完成,通过"http://用户名.github.io/项目名"即可展示你的页面了。
  (注意:上述步骤中输入命令时,只需输入双引号内的内容。)
  最后补充你可能需要的链接地址
  下载git,请点击官方地址官方下载地址(请选择对应的版本)?;
  如需了解更多有关git的相关知识请点击Pro Git 简体中文版?
  此处内容有必要了解一下(选修)
  该处的内容摘要自:单个GitHub帐号下添加多个GitHub Pages的相关问题 - 我很好奇 - SegmentFault
  1.个人主页必须要和用户的GitHub帐号同名,所以每个用户有且只能有一个repo作为个人主页,且必须是 的形式;而项目主页的命名则没有这种限制,且数量有任意多个;
  2.不考虑绑定的自定义域名的前提下,个人主页的GitHub二级域名为 ;项目主页的GitHub二级域名为,没有 这种方式;
  3.个人主页的展示内容以 master 分支里的文件为准;而项目主页的展示内容以 gh-pages 分支内的文件为准;
  

1. 什么是Github
Github 官方主页


简单说,Github是一个基于git的社会化代码分享社区。

你可以在Github上创建免费的远程仓库(remote repository),分享你的代码,当然也可以关注其他人的代码
你也可以建立公司账户,创建私有的远程仓库,与开发团队共同协作开发
想要使用Github Pages,你首先要创建一个Github账户

2. 谁在使用Github免费托管网站 ?

Bootstrap
NODESCHOOL
WebComponents
......

3. Github pages的两种类型

3.1 Project Pages(Repository Pages)


URL for Project Pages.png


在Github上我们可以给不同的project分别创建相应的repository,对于某一个repository,你可以在其中创建一个小网站,向人们展示你的项目,提供项目的相关信息等等。这就是所谓的project pages。例如上面说的bootstrap.com
在一个repo的gh-pages分支中的所有文件将出现在github.io上。
Project Pages How-To
创建一个gh-pages分支
编辑相应的html/css/js文件,用于展示在github.io上
push gh-pages分支到Github上面
//下面是一些会用到的git command
git checkout -b gh-pages //create a gh-pages branch
git branch //check all branches and which branch you are currently working on
git push origin gh-pages //push gh-pages branch to github
git checkout --orphan go-pages //you can create a new empty branch
git push origin :gh-pages //delete a remote branch


最简单地方法是从Github上直接自动生成页面,还可以选择模板。移步这里

3.2 User Pages


URL for User Pages


每一个Github账户只能有一个User Pages,主要用来展示一个账户中最最重要的项目。
命名为username.github.io的repo中的内容将会出现在username.github.io上。

User Pages How-To

创建一个CNAME文件,包含你的个性域名,放在source文件夹下
example.com


把你个性域名的A record指向Github DNS
192.30.252.153
192.30.252.154



创建一个新的repo,名字必须是username.github.io



创建新的repo



创建你的网站,包括:HTML文件,CSS文件...

my_website_folder
|- index.html
|- main.css
|- bootstrap.js
|...


创建本地git repo
~ $ cd my_website_folder //进入你的网站所在的文件夹
~ $ git init
~ $ git add .
~ $ git commit -m "Initial commit"


添加remote repo到本地,push到Github
~ $ git remote add origin https://github.com/Jason-Yuan/Jason-Yuan.github.io.git
~ $ git remote -v //可以查看是否添加成功,及其详细信息
~ $ git push origin master


设置个性域名

如果想要搭建博客,下面列了一些非常流行的framework,可自动生成静态页面:

Octopress (基于Ruby)
Jekyll (基于Ruby) - 通过Github Pages和Jekyll搭建个人博客
Hexo (基于NodeJS) - 通过Github Pages和Hexo搭建个人博客
Pelican (基于Python)

4. Github Pages的限制(Limitations)

Github Pages只是静态网站(HTML, CSS, JavaScript)
没有服务端,所以不支持服务端的语言(没有ruby, php, python)

相关要点总结:

15065467321:怎么免费申请网站免费创建网站
廉单答:可以免费申请网站并免费创建网站的途径有多种。下面是一些详细的方法:首先,可以选择使用免费建站平台来创建网站。这些平台通常提供简单易用的网站创建工具,用户只需按照平台提供的步骤进行操作,即可完成网站的搭建。例如,WordPress、Weebly和Jimdo等平台都提供免费的建站服务。以WordPress为例,用户只需在官方...

15065467321:如何免费创建网站?
廉单答:怎么免费做网站?第一个免费做网站的工具叫做“上线了”,自己搜一下就知道了。这是一个免费建站比较好用的工具。在下方就可以快捷注册,邮箱设置密码就ok。注册完毕之后,点击右上角进行登录。进入后台管理系统,选择创建新的网站。选择任意喜欢的模板,进行个人网站定制。鼠标放在模板上,会弹出两个按钮...

15065467321:GitHub男人的天堂,你真的玩的转吗?超强超详细GitHub教程
廉单答:首先,我先对GitHub来一个简单的介绍,GitHub有一个很强大的功能就是,你在服务器上边可以创建一个库(稍后会介绍怎么创建),写代码是一件很重的任务,尤其是很多人完成一个很大的项目的时候,就十分的复杂,一群人一起来写某个项目,大家完成的时间,完成的进度都是不相同的,你写一点我写一点,甚至可能你今天写的出现...

15065467321:如何免费建立网站(简单步骤)
廉单答:第一步:选择一个网站建设平台 要建立一个网站,首先需要选择一个合适的网站建设平台。目前,有很多免费的网站建设平台可供选择,如WordPress、Wix、Weebly等。这些平台提供了丰富的模板和插件,使您可以快速地建立一个专业的网站。第二步:注册一个域名 域名是您网站的网址,例如www.example.com。在选择...

15065467321:如何申请免费网页怎么申请免费网站
廉单答:如何申请一个免费域名我想上传网页?你要有空间ftp,才可以上传。空间是购买的,你确定有吗?如果有的话,就下载一个上传工具,我用的是Cuteftppro。下载完安装后,打开:文件-新建FTP站点。标签:指的是站点的名字,也就是你网站的名字,这个可以随便填。主机地址:就是IP地址用户名和密码就按提供商...

15065467321:怎样免费建立一个个人小型网站
廉单答:计算机与网络专业技术人员能利用一技之长及在某一方面的专长轻松制作网页,但大量的网络菜鸟级人物如何制作个人主页,建立个人网站呢?我大概总结了以下几点,希望对一些对这方面缺乏基本了解的人提供一些帮助。如果你是个经常上网的网虫,并对如何建立网站有一定的兴趣,那么请你继续读下去,否则我推荐你使用某些网站推出的傻瓜...

15065467321:怎样注册免费的网站域名
廉单答:5、上传完毕之后,在搜索框中输入你的网站域名后面加admin。6、根据提示填上你的信息。这样你的网站就做好了。以上就是如何建立个人网站的解决步骤。www的全称是什么?WWW是WorldWideWeb(环球信息网)的简称,也称为Web、3W等。它是基于客户机/服务器方式的信息发现技术和超文本技术的综合。从技术角度...

15065467321:如何搭建一个GitHub在自己的服务器上
廉单答:1、要需要购买WEB服务器(正睿服务器等)。2、网站代码备份和数据库备份。 3、在新服务器上搭建运营环境和数据库。 4、进行域名解析(将网址指向本地的IP地址上) 5、将数据库进行还原、代码进行解压并放到根目录下。 6、开启运营环境,应该就 ...

15065467321:怎么样免费建网站怎么创建网站
廉单答:怎样建立一个自己的免费个人网站?新手小白想要搭建自己的网站,可以通过以下方法:1、选择比较知名的域名商购买域名;2、购买适合自己的虚拟空间或服务器;(注意域名和空间尽量在一个平台)3、域名备案;(为了网站的安全和稳定性尽量购买国内空间被备案,时间大概20天)4、选择合适的搭建平台搭建自己的网站...

15065467321:网站免费空间申请方法?在哪建站有免费域名空间?
廉单答:你的网站就瞬间出现在互联网上,便捷高效。总结:寻找免费空间和域名,其实并不难。只需跟随上述步骤,你就能拥有自己的网站。现在就行动起来,让创意无限延伸,成就你的在线品牌。更多建站相关知识,如流行页面设计模板、html搭建工具以及网站制作教程,请持续关注,你的建站之路将不再孤单!

(编辑:本站网友)
相关推荐
关于我们 | 客户服务 | 服务条款 | 联系我们 | 免责声明 | 网站地图
@ 百韵网