Publii和GitHub:搭建个人网站的完美组合

在数字时代,拥有一个个人网站已经非常普遍了,但是,很多人因为技术难题而望而却步。现在,有了Publii,这一切都将变得简单。Publii是一个静态网站生成器,它允许你在本地计算机上创建和管理内容,然后将其发布到任何Web服务器。它不仅支持丰富的主题和插件,还能与GitHub无缝集成,让网站维护和版本控制变得轻而易举。在本文中,我将详细介绍如何结合使用GitHub和Publii,即使你不是技术专家,也能快速搭建和部署个人网站。继续阅读,开启你的网站建设之旅!

2964b5ca29f6c698fda86f37eeb7ecf5.jpeg

步骤一:安装和汉化Publii

首先访问Publii官网(https://getpublii.com/)下载安装包,Win、macOS和Linux都支持。安装完成后,打开应用后界面如下,需要先创建一个网站,设置网站名称和作者名称。

77c2ef31a8f4ac9a2a9471fffd7a6c0f.jpeg

点击“Create website”按钮后,进入应用主界面,如下图所示,由于是国外应用,整个界面是英文的。这个应用也支持安装语言包,接下来告诉大家如何进行汉化操作。

a429fef49f333c31ab9e6601adc5b030.jpeg

访问这个网页:https://github.com/GetPublii/Publii-ui-locales,下载中文语言包:zh-CN。

d127111a960a931548f688e80d37a6b3.png

然后点击主界面右上角三个点的设置图标,选择“Languages”选项。

f73d4d4d3c0a8fba9ef898625350c626.jpeg

在Languages页面上选择右上角的“Install language”按钮,在弹出的文件管理器中选择前面下载好的zh-CN的语言包文件,双击进行安装。

be899a5e6a33eae433bd7c48f98376ac.jpeg

语言包安装成功后,在界面上会显示“Chinese-Simplified”语言包,选择该语言包,界面上的英文就变为中文啦,至此汉化结束。

4ffd3e0dd0d3d26963674620160520a8.jpeg

步骤二:创建github存储仓库

参考之前的文章,在GitHub上创建一个以<用户名>.github.io命名的仓库,用于存储网站代码,注意设置为Public。

b6393cffd11662f1538528b608b0e5f7.jpeg

点击“Create repository”创建仓库,拷贝如下如所示的git文件的访问地址,后续在配置Publii时需要用到。

cdb577b2dcc85235b3a73a0989b24925.png

接下来创建一个token,并授予相关仓库repo权限,用于publii使用该token链接GitHub进行数据同步。

cb55c4cc57e68dcbc35a36e684ab1304.jpeg

步骤三:配置Publii

接下来我们回到Publii主界面,选择左下脚的“配置服务器”选项。

b88fee52bea8f07642732631cfd57468.jpeg

在服务器类型中选择“Git Repository”。

c8a7f7a8402d6c81be474b0345cb754f.jpeg

如下图所示进行相关字段设置,设置完成后记得点击“保存设置”进行保存,还可以点击“测试连接”来测试相关信息的正确性,是否有顺利连接到GitHub网站,这里提醒大家注意网络的连通性,你的网络环境需要能够正常访问GitHub网站。

  • 网址:和我们在GitHub上创建的仓库名是一致的
  • sync.repositoryUrl:这里填写上面复制的git文件的访问地址
  • 用户名:添加GitHub账号的邮箱地址
  • sync.gitPassword:填写在GitHub上面创建的token信息
  • sync.commitAuthor:GitHub账号的用户名称
  • sync.commitEmail:GitHub账号的邮箱地址

9845aca52ff16c4a40a40d89be3d82b3.jpeg

接下来你就可以在Publii上写文章啦,写完后还可以直接点击主界面左下角的“预览您的更改”在本地预览网页效果。

3fffca424e80ef9ef49928aed895ab50.jpeg

步骤四:安装网站主题

如果你对Publii自带的网站主题不满意,还可以手动安装主题。可以去Publii主题商店上下载主题:https://marketplace.getpublii.com/themes/,有免费的,也有收费的,对于我们个人用户来说,免费的已经够用了。

14abbe6b16e459372d53c48edcc331b0.jpeg

选择你喜欢的主题,在详情页点击“Download”下载主题文件到本地。

efb22bc707c93d19421aeb8a969ff942.jpeg

点击客户端主界面右上角的设置按钮,选择“主题”选项。

f3be0126ae5e2a5d03b3b2e071effbe2.jpeg

点击右上角的“安装主题”按钮,选择下载到本地的主题文件进行安装,安装完成后选择主题进行应用就可以啦。

a30d1119b198becbbc05c58ff98d8fbe.jpeg

步骤五:写文章并发布网站

在客户端本地写好文章,并对网站效果进行预览,一切OK后可以点击主界面左下角的“同步您的网站”按钮将数据同步到远程的GitHub仓库中,选择同步界面上的按钮进行同步。

a17ce8878aa706cf1a6b8a404652c0ec.jpeg

同步完成后的界面如下图所示。

ddcb4c42dcdb290878f563592cc2dea7.jpeg

同步完成后,你还可以去GitHub上查看仓库下的文件,都是Publii客户端本地生成的网页文件。

0c87658977d2c79c3e1eae80c09304bb.jpeg

稍等一小会儿,等待GitHub部署完成后,就可以使用GitHub仓库名作为网站域名来访问我们的个人网站啦,效果如下图所示。

290314cdd95e22bbde5b38898d56bd76.jpeg

至此,借助Publii和GitHub的力量,我们没有写一行代码就完成了网站搭建工作,非常高效和省心!如果你也心动了,就快快行动起来吧~

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

实战|环信 Vue2 uniapp Demo重构焕新!经典再升级!

项目背景 当前环信 uni-app vue2 Demo 地址升级版本 Github 地址&#xff08;临时&#xff09; 原版本功能实现方式较混乱&#xff0c;代码逻辑晦涩难懂&#xff0c;不利于开发者参考或复用。此实战项目在确保原项目功能保留的情况下进行完全重写并新增大量功能&#xff0c;以…

JavaWeb - 3 - JavaScript(JS)

JavaScript(JS)官方参考文档&#xff1a;JavaScript 教程 JavaScript&#xff08;简称&#xff1a;JS&#xff09;是一门跨平台、面向对象的脚本语言&#xff0c;是用来控制网页行为的&#xff0c;它能使网页可交互&#xff08;脚本语言就不需要编译&#xff0c;直接通过浏览器…

简介:基于 OpenTiny 组件库的 rendereless 无渲染组件架构

在 HAE 自研阶段&#xff0c;我们实现的数据双向绑定、面向对象的 JS 库、配置式开发的注册表等特性&#xff0c;随着前端技术的高速发展现在已经失去存在的意义&#xff0c;但是在 AUI 阶段探索的新思路新架构&#xff0c;经过大量的业务落地验证&#xff0c;再次推动前端领域…

【网络层】IP多播技术的相关基本概念(湖科大慕课自学笔记)

IP多播 1&#xff1a;IP多播技术的相关基本概念 我们简单举例&#xff0c;如下图所示&#xff1a; 一共有60个主机要接受来自视频服务器的同一个节目&#xff0c;如果采用单播方式&#xff0c;则视频服务器要发送60份&#xff0c;这些视频节目通过路由器的转发&#xff0c;最…

IOS覆盖率报告info文件解读

一&#xff0c;IOS覆盖率报告的生成 在做前端精准测试的时候&#xff0c;对于iOS端&#xff0c;通常会做如下操作&#xff1a; &#xff08;1&#xff09;合并覆盖率数据 如下操作&#xff1a; xcrun llvm-profdata merge coverage_file1657885040728.profraw coverage_fil…

C语言第三十七弹---文件操作(下)

✨个人主页&#xff1a; 熬夜学编程的小林 &#x1f497;系列专栏&#xff1a; 【C语言详解】 【数据结构详解】 文件操作 1、文件的随机读写 1.1、fseek 1.2、ftell 1.3、rewind 2、文件读取结束的判定 2.1、被错误使用的 feof 3、文件缓冲区 总结 1、文件的随机读写…

typescript学习(更新中)

目录 开发环境搭建类型如何声明有哪些类型编译配置文件 开发环境搭建 npm i -g typescripttsc检查是否安装成功 类型如何声明 // 先声明再赋值 let a: number a 1// 直接赋值 let b 1function sum(a: number, b: number): number {return a b } console.log(sum(1, 2))有…

VSCode搭建ARM开发环境

为了构建Cortex M系列单片机免费开源的开发环境&#xff0c;网络上了解来看VSCODEGCCJLINK是一套比较高效的组合方式&#xff0c;下面记录环境搭建的流程。 我这边的PC环境为 WIN7专业版64bit。 需要用到的工具 Visual Studio CodeSTM32CubemxARM GCC 交叉编译工具链&#x…

【刷题记录】详谈设计循环队列

下题目为个人的刷题记录&#xff0c;在本节博客中我将详细谈论设计循环队列的思路&#xff0c;并给出代码&#xff0c;有需要借鉴即可。 题目&#xff1a;LINK 循环队列是线性表吗&#xff1f;或者说循环队列是线性结构吗&#xff1f; 对于这个问题&#xff0c;我们来看一下线…

Vue 项目性能优化指南:提升应用速度与效率

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

Qt插件之输入法插件的构建和使用(二)

文章目录 主键盘搭建Google开源引擎音节分割工具类参考项目下载搭建好各个基础控件之后,就可以开发输入法的主界面和引擎了,这也是输入法的核心。 主键盘搭建 输入法的主界面本质上是一个QStackedWidget容器,将各个类型的输入键盘插入到容器中,然后根据业务需要切换不同的…

图机器学习(4)-面向连接层面的人工特征工程

0 问题定义 通过已经连接去猜未知连接&#xff1a; 有两个思路&#xff1a; &#xff08;1&#xff09;直接提取link的特征&#xff0c;把link变成D维向量&#xff1b; &#xff08;2&#xff09;把link两端节点的D维向量拼在一起&#xff0c;缺点&#xff1a;丢失了link本身…

蓝桥省赛倒计时 35 天-线性 dp 练习

文章目录 数学三角形最长上升子序列 数学三角形 思路&#xff1a;就是下一层通过上一层的条件转移过来&#xff0c;注意数可以是负数&#xff0c;所以边界得取-INF&#xff0c;这样求上层 max 的时候不会被初始化的数如 0 影响。 #include<bits/stdc.h> using namespace…

md5绕过

文章目录 \\和\\\md5数组绕过科学计数法绕过双md加密md5碰撞Hash长度攻击 下面会以同一道题给大家演示&#xff1a; (题目来源与nssctf) 和 在php代码中我们会看到和&#xff0c;虽然两个都是表示相等&#xff0c;但是在细节上会有所部区别 &#xff1a;是弱比较&#xff0c;只…

美团春招编程第一场第三题

美团春招编程第一场第三题 题目 解答 思路-暴力解法 pair中存储从原点到包含当前元素的0,1数量&#xff0c;得到二维数组mat; 从头到尾遍历尺寸为i*i的矩形&#xff0c;计算完美矩形数量 #include <iostream> #include <vector> using namespace std;int main()…

【项目】Boost 搜索引擎

文章目录 1.背景2.宏观原理3.相关技术与开发环境4. 实现原理1.下载2.加载与解析文件2.1获取指定目录下的所有网页文件2.2. 获取网页文件中的关键信息2.3. 对读取文件进行保存 3.索引3.1正排与倒排3.2获取正排和倒排索引3.3建立索引3.3.1正排索引3.3.2倒排索引 4.搜索4.1 初始化…

Linux Docker安装redis缓存数据库

文章目录 一、查找Redis镜像二、拉取redis镜像三、创建数据目录和配置文件四、创建redis容器 一、查找Redis镜像 首先到docker镜像仓库下载redis镜像。地址&#xff1a;https://hub.docker.com/搜索redis&#xff0c;如下&#xff1a;找到对应想要下载的版本&#xff1a; 二、…

Win11 没有网络bug

1.问题描述 没有网络&#xff0c;dns一直是固定的&#xff0c;但是dns已经是自动获取了(MAC地址随机) 2.解决办法 1.首先&#xff0c;删除所有网络的手动dns配置,控制中心那个dns管理没有用,在设置中删除网络,不然问题还会出现 - 2.然后&#xff0c;进入注册表\HKEY_LOCAL_MACH…

产品推荐 - 基于6U VPX的双TMS320C6678+Xilinx FPGA K7 XC7K420T的图像信号处理板

综合图像处理硬件平台包括图像信号处理板2块&#xff0c;视频处理板1块&#xff0c;主控板1块&#xff0c;电源板1块&#xff0c;VPX背板1块。 一、板卡概述 图像信号处理板包括2片TI 多核DSP处理器-TMS320C6678&#xff0c;1片Xilinx FPGA XC7K420T-1FFG1156&#xff0c;1片…

kafka(三)springboot集成kafka(1)介绍

基于kafka新版本 <dependencies><dependency><groupId>org.apache.kafka</groupId><artifactId>kafka-clients</artifactId><version>3.0.0</version></dependency> </dependencies> 一、kafkaProducer 1、介绍…