如何制作项目网页

一、背景

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

二、寻找制作项目网页的方法

1. 进入Nerfies模板网页

网址为:https://github.com/nerfies/nerfies.github.io
在这里插入图片描述
目前已经2.6K的点赞

2. Nerfies网页点击Issues

在这里插入图片描述

然后找到问题How to publish a project website like yours from a markdown content file?

在问题中,找到网站:https://github.com/shunzh/project_website/,特别注意,这个网站很关键,上述一系列的操作均是找到这个网站
在这里插入图片描述
该网站告诉了我们制作项目网页的简单方法:这个存储库对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) 即可下载
在这里插入图片描述

双击下载好的rubyinstaller-devkit-3.3.6-2-x64.exe

点击I accept the License
在这里插入图片描述
随后一路accept,然后进入到命令行界面,选择3
在这里插入图片描述
出现如下画面,表示安装成功,关闭窗口

在这里插入图片描述

需要注意的是我这里失败了两次,猜测是使用了VPN的缘故,总之如果这里报错,则关闭或打开VPN多尝试几次即可。

3.安装Jekyll

进入Ruby的安装目录,我的是E:\Ruby33-x64,然后在空白处,shift+鼠标右键选择:在此处打开 Powershell 窗囗(S)
在这里插入图片描述

执行以下命令安装 bundler 和 jekyll

gem install jekyll bundler

在这里插入图片描述

安装完成后,执行以下命令查看 jekyll 和 bundler 的版本,以确认是否安装成功

jekyll -v
bundler -v

版本信息如下图所示:

在这里插入图片描述

四、下载网页模板

网站为: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

在这里插入图片描述

然后ctrl+鼠标左键打开http://127.0.0.1:4000

修改index.md文档的内容,则可改变网页的内容。需要注意的是,如果插入图片,则需要将图片放到static/image文件夹中。

在这里插入图片描述

大功告成

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/924303.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

圆域函数的傅里叶变换和傅里叶逆变换

空域圆域函数的傅里叶变换 空域圆域函数(也称为空间中的圆形区域函数)通常指的是在二维空间中,以原点为中心、半径为 a a a的圆内取值为1,圆外取值为0的函数。这种函数可以表示为: f ( x , y ) { 1 if x 2 y 2 ≤ …

云技术-docker

声明! 学习视频来自B站up主 **泷羽sec** 有兴趣的师傅可以关注一下,如涉及侵权马上删除文章,笔记只是方便各位师傅的学习和探讨,文章所提到的网站以及内容,只做学习交流,其他均与本人以及泷羽sec团…

win10中使用ffmpeg的filter滤镜

1 给视频加文字水印 1.1 添加播放时间 ffmpeg -i input.mp4 -vf "drawtextfontfileC\\:/Windows/fonts/consola.ttf:fontsize30:fontcolorwhite:timecode00\:00\:00\:00:rate25:textTCR\::boxcolor0x000000AA:box1:x20:y20" -y output.mp4 在视频的x20:y20位置添加t…

MyBatis事务管理-附案例代码

一、MyBatis事务管理 SqlSession对象 getMapper(DAO.class):获取Mapper(DAO接口的实体类)事务管理 1.1 手动提交事务 手动事务管理 当我们获取sqlSession对象时,就默认开启了事务; 当一系列业务操作完成之后,我们需要…

QChart数据可视化

目录 一、QChart基本介绍 1.1 QChart基本概念与用途 1.2 主要类的介绍 1.2.1 QChartView类 1.2.2 QChart类 1.2.3QAbstractSeries类 1.2.4 QAbstractAxis类 1.2.5 QLegendMarker 二、与图表交互 1. 动态绘制数据 2. 深入数据 3. 缩放和滚动 4. 鼠标悬停 三、主题 …

互联网视频推拉流EasyDSS视频直播点播平台视频转码有哪些技术特点和应用?

视频转码本质上是一个先解码再编码的过程。在转码过程中,原始视频码流首先被解码成原始图像数据,然后再根据目标编码标准、分辨率、帧率、码率等参数重新进行编码。这样,转换前后的码流可能遵循相同的视频编码标准,也可能不遵循。…

黑马程序员Java项目实战《苍穹外卖》Day01

苍穹外卖-day01 课程内容 软件开发整体介绍苍穹外卖项目介绍开发环境搭建导入接口文档Swagger 项目整体效果展示: ​ 管理端-外卖商家使用 ​ 用户端-点餐用户使用 当我们完成该项目的学习,可以培养以下能力: 1. 软件开发整体介绍 作为一…

使用phpStudy小皮面板模拟后端服务器,搭建H5网站运行生产环境

一.下载安装小皮 小皮面板官网下载网址:小皮面板(phpstudy) - 让天下没有难配的服务器环境! 安装说明(特别注意) 1. 安装路径不能包含“中文”或者“空格”,否则会报错(例如错误提示:Cant cha…

No.1 杀戮尖塔Godot复刻|项目概述|场景设置

项目概述 含有47个脚本文件,包括1185行代码,最长的脚本有111行 Battle Node——战斗节点 start_battle()——开始战斗turn management——管理回合win/lose conditions——识别输赢条件 EnemyHandler——敌人处理程序 enemy turn management——管理…

化工专业如何转软工

在当今数字化时代,跨考软件工程已经成为许多理工科学子的一个重要选择。化工专业的同学有着扎实的理工科基础,尤其是数学功底,这对于转向计算机领域是一个天然的优势。让我们详细探讨如何规划这段跨考之路。 编程语言的选择是入门的第一步。…

《Opencv》基础操作<1>

目录 一、Opencv简介 主要特点: 应用领域: 二、基础操作 1、模块导入 2、图片的读取和显示 (1)、读取 (2)、显示 3、 图片的保存 4、获取图像的基本属性 5、图像转灰度图 6、图像的截取 7、图…

论文阅读:A Software Platform for Manipulating theCamera Imaging Pipeline

论文代码开源链接: A Software Platform for Manipulating the Camera Imaging Pipelinehttps://karaimer.github.io/camera-pipeline/摘要:论文提出了一个Pipline软件平台,可以方便地访问相机成像Pipline的每个阶段。该软件允许修改单个模块…

ChatGPT的应用场景:开启无限可能的大门

ChatGPT的应用场景:开启无限可能的大门 随着人工智能技术的快速发展,自然语言处理领域迎来了前所未有的突破。其中,ChatGPT作为一款基于Transformer架构的语言模型,凭借其强大的语言理解和生成能力,在多个行业和场景中展现出了广泛的应用潜力。以下是ChatGPT八个最具代表…

音视频-什么是帧,视频为什么要编码

帧就是动画中的一张图片,这相当于电影胶片上的一个镜头,一帧就是一幅静止的画面,连续的帧就形成了我们看到的动画和视频。 但是直接采集后没经过处理的视频,其实是没有办法真正在互联网上进行传输的。以一张1920乘1080的图片为例&…

“蜀道山”高校联合公益赛 Web (部分)

文章目录 奶龙牌WAF海关警察训练平台恶意代码检测器 奶龙牌WAF <?php if ($_SERVER[REQUEST_METHOD] POST && isset($_FILES[upload_file])) {$file $_FILES[upload_file];if ($file[error] UPLOAD_ERR_OK) {$name isset($_GET[name]) ? $_GET[name] : basen…

【JavaEE初阶 — 网络原理】初识网络原理

目录 1. 网络发展史 1.1 独立模式 1.2 网络互连 1.2.1 网络互联的背景 1.2.2 网络互联的定义 1.3 局域网LAN 1.4 广域网WAN 2. 网络通信基础 2.1 IP地址 2.2 端口号 2.3 认识协议 2.4 五元组 2.5 协议分层 2.5.1 分…

Linux的介绍及虚拟机centOS系统的下载与应用

1、什么是Linux Linux 是一种类 Unix 操作系统&#xff0c;它的内核&#xff08;Kernel&#xff09;由 Linus Torvalds 于 1991 年首次发布。作为一个开源、免费的操作系统&#xff0c;Linux 被广泛用于服务器、桌面计算机、嵌入式设备、移动设备等各种场景。 1、操作系统 操…

Leetcode打卡:交替组II

执行结果&#xff1a;通过 题目&#xff1a;3208 交替组II 给你一个整数数组 colors 和一个整数 k &#xff0c;colors表示一个由红色和蓝色瓷砖组成的环&#xff0c;第 i 块瓷砖的颜色为 colors[i] &#xff1a; colors[i] 0 表示第 i 块瓷砖的颜色是 红色 。colors[i] 1 …

【ONE·基础算法 || 动态规划(二)】

总言 主要内容&#xff1a;编程题举例&#xff0c;熟悉理解动态规划类题型&#xff08;子数组、子序列问题&#xff09;。                文章目录 总言5、子数组问题&#xff08;数组中连续的一段&#xff09;5.1、最大子数组和&#xff08;medium&#xff09;5.1.…

Qt程序发布及打包成exe安装包

参考:Qt之程序发布以及打包成exe安装包 目录 一、简述 Qt 项目开发完成之后,需要打包发布程序,而因为用户电脑上没有 Qt 配置环境,所以需要将 release 生成的 exe 文件和所依赖的 dll 文件复制到一个文件夹中,然后再用 Inno Setup 打包工具打包成一个 exe 安装包,就可以…