光之使者 发表于 2024-11-28 02:23:45

如何制作项目网页

一、背景

许多论文里经常会有如许一句话Supplementary material can be found at https://hri-eu.github.io/Lami/,这个就是将论文中的内容大概增补视频放到一个网页上,以更好的展示他们的工作。因此,这里先容下如何使用前人提供的模板制作我们自己的项目网页。
二、探求制作项目网页的方法

1. 进入Nerfies模板网页

网址为:https://github.com/nerfies/nerfies.github.io
https://i-blog.csdnimg.cn/direct/b10a5a9b420049538f5f6d29a87642b1.png
目前已经2.6K的点赞
2. Nerfies网页点击Issues

https://i-blog.csdnimg.cn/direct/f5902d81d0f94d0aa79d42a7607c818e.png
然后找到题目How to publish a project website like yours from a markdown content file?
在题目中,找到网站:https://github.com/shunzh/project_website/,特别注意,这个网站很关键,上述一系列的操纵均是找到这个网站
https://i-blog.csdnimg.cn/direct/7ac5fbad384d44e2afd299e48408f7f2.png
该网站告诉了我们制作项目网页的简朴方法:这个存储库对Nerfies网站的源代码举行了jekyll化,我们只需要更改index.md的内容,便可编辑网页。可以只在markdown中编写,当然也可以使用HTML来实现更丰富的效果。
由于将Nerfies网站的源代码举行了jekyll化,所以接下来我们就是要安装Jekyll环境
三、安装Jekyll环境

Jekyll 是一个基于 Ruby 的静态网站天生器。它可以将用 Markdown、Liquid 模板语言和 HTML 编写的内容,天生静态的 HTML 网站。由于静态网站具有高性能、安全性强、摆设简朴等优势,Jekyll 常被用于博客、文档站点等用途。
安装方式参考链接为:https://zhuanlan.zhihu.com/p/672713591,我这里记录一下自己的安装过程。
1.安装git,我之前已经装过了,大家可自行检索方法

2.安装Ruby

正如前面所先容的,Jekyll 是一个基于 Ruby 的静态网站天生器,所以需要安装Ruby,Ruby官网为:https://jekyllrb.com/docs/installation/,上述网址只是Ruby官网,具体安装网址为:https://rubyinstaller.org/downloads/,然后点击Ruby+Devkit 3.3.6-2 (x64) 即可下载
https://i-blog.csdnimg.cn/direct/dd91a33c51144f2e9f298353cd135469.png
双击下载好的rubyinstaller-devkit-3.3.6-2-x64.exe
点击I accept the License
https://i-blog.csdnimg.cn/direct/3c03554f31c9437b90b17114f90d103f.png
随后一起accept,然后进入到下令行界面,选择3
https://i-blog.csdnimg.cn/direct/35a859aafe9646d48ed6280bbc74e62a.png
出现如下画面,表现安装成功,关闭窗口
https://i-blog.csdnimg.cn/direct/cd4fcf78d64d458f8f587b7d8e437a56.png
需要注意的是我这里失败了两次,猜测是使用了VPN的缘故,总之如果这里报错,则关闭或打开VPN多尝试几次即可。
3.安装Jekyll

进入Ruby的安装目次,我的是E:\Ruby33-x64,然后在空白处,shift+鼠标右键选择:在此处打开 Powershell 窗囗(S)
https://i-blog.csdnimg.cn/direct/1a50fd46c79c4ad6a85939ff105dd5af.png
实行以下下令安装 bundler 和 jekyll
gem install jekyll bundler
https://i-blog.csdnimg.cn/direct/60ac35caa197406a95b2582ae0c8262d.png
安装完成后,实行以下下令检察 jekyll 和 bundler 的版本,以确认是否安装成功
jekyll -v
bundler -v
版本信息如下图所示:
https://i-blog.csdnimg.cn/direct/530fd20f405d4d5e9834e3ae5daeb572.png
四、下载网页模板

网站为:https://github.com/shunzh/project_website
下载压缩包project_website-main.zip
我放在了E:\My github repositories/
然后进入到文件夹E:\My github repositories\project_website-main
shift+鼠标右键选择:在此处打开 Powershell 窗囗(S)打开下令行,输入以下指令:
jekyll serve
https://i-blog.csdnimg.cn/direct/4131cb527f9d4cabbf6d7dd5b60e16af.png
然后ctrl+鼠标左键打开http://127.0.0.1:4000
修改index.md文档的内容,则可改变网页的内容。需要注意的是,如果插入图片,则需要将图片放到static/image文件夹中。
https://i-blog.csdnimg.cn/direct/88076f3dccbc403bb98a03648c6f90b4.png
大功告成

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 如何制作项目网页