此项目fork自gaohaoyang.github.io,原项目README-zh-cn.md
此操作只是为了能够本地预览博客效果,GitHub-page上已有环境
- ruby: 语言,有不同版本
- RVM: 安装管理Ruby环境各类斯三方插件
- RubyGems
RubyGems是一个方便而强大的Ruby程序包管理器( package manager),类似RedHat的RPM.它将一个Ruby应用程序打包到一个gem里,作为一个安装单元。无需安装,最新的Ruby版本已经包含RubyGems了。 -Gem Gem是封装起来的Ruby应用程序或代码库。 注:在终端使用的gem命令,是指通过RubyGems管理Gem包。
- Gemfile
定义你的应用依赖哪些第三方包,bundle根据该配置去寻找这些包。
docker run --name ubuntu_page -it -p 4000:4000 -p 1022:22 -v /mnt/mmc0-4/data:/data ubuntu:22.04
apt update
#ruby apt流程
按照官方安装
https://jekyllrb.com/docs/installation/ubuntu/
#echo "gem 'webrick'" >> Gemfile
rm Gemfile.lock
bundle install
bundle exec jekyll s --host=0.0.0.0
Ubuntu卸载系统的Ruby,mac协助brew安装的Ruby,清除环境变量设置,安装gpg公钥
sudo apt install gnupg #linux
brew install gnupg #mac
#下面非root
gpg --keyserver hkp://pool.sks-keyservers.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
#如果报错,则换个服务器
gpg --keyserver hkp://keyserver.ubuntu.com --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
安装rvm
curl -sSL https://get.rvm.io | bash -s stable
#mac/Linux
#需要登陆的shell,执行 /bin/bash --login
source $HOME/.rvm/scripts/rvm
export PATH="$PATH:$HOME/.rvm/bin"
#如果是root账户
source /usr/local/rvm/scripts/rvm
export PATH="$PATH:/usr/local/rvm/bin"
rvm install "ruby-3.0.0"
#新版本的ubuntu可能会出问题,这样安装:
#rvm pkg install openssl; rvm install "ruby-3.0.0" --with-openssl-dir=$HOME/.rvm/usr
rvm use "ruby-3.0.0" --default
#设置源
gem sources --add https://mirrors.tuna.tsinghua.edu.cn/rubygems/ --remove https://rubygems.org/
#还需要安装,不然安装jekyll会报错
gem install nokogiri -v '1.10.9' --source 'https://mirrors.tuna.tsinghua.edu.cn/rubygems/'
#bunder源。非必须
bundle config mirror.https://rubygems.org https://mirrors.tuna.tsinghua.edu.cn/rubygems
gem update
#在blog目录
rm Gemfile.lock
bundle install
进入网站目录
jekyll s [--port 端口号(不设置默认端口4000)]
浏览器访问http://127.0.0.1:4000
局域网访问
jekyll s --host=0.0.0.0
参考目录结构
主要结构
/_config.yml 网站主要配置
/page 导航栏指向的界面(只要按照下面的格式去创建文件,放在任意目录都是可以的)
里面的文本内容的格式
---
layout: default #会根据这个关键词跳用layouts里面的模版
title: 标题 #显示在导航上的内容
permalink: 链接 #页面的固定链接
icon: 图标 #导航栏上的图标
type: page #页面类型,选择page页面
---
/_inclouds 页脚footer,页头head,评论系统等html模块化元素,用于引用组成一个html网页
/_layouts 主要页面的html内容,引用_incloud,_post等文件内容组成网页
/_site 自已生成不需操作
/_post 博客文章内容
/web/Adsense 广告资源
修改,jekyll s 本地预览,git push推送
主要修改参考参考README-zh-cn.md
disqus的shortname,不是用户名,一个网站一个,setting里有
摘要由_config.yml
中的excerpt_separator: "摘要内容分隔符"
决定,此项目设置为excerpt_separator: "\n\n\n\n"
即文章中连续四个回车前的内容显示在主页
windows下的换行是^M\n
,windows版的GitBash好像提交代码时或自动修改为Unix的\n
,但是之前在windows下的文件在linux下提交就不会了,所以,主页一整篇文章就是一个摘要
比较好的解决方案是替换_config.yml
中的excerpt_separator: "摘要内容分隔符"
的摘要内容分隔符
为非换行符,然后替换掉文章中的摘要内容分隔符
也可以
sudo apt install dos2unix
dos2unix *.md
使用图标如简书 iconfont 参考http://www.jianshu.com/p/5d4a39cdf96d 在head.html添加 //at.alicdn.com/t/font_461356_6dhj8mgwisozjjor.css 在footer.html里修改 照着修改,在_config.yml 里添加用户名
简书发布/保存成草稿
转发到github-page 解决图片缓存问题
在_includes/head.html
中加入
1、国内推荐 CDN:
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
2、海外推荐 CDN
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
在需要图标的地方,比如_includes/footer.html
中加入
<i class="fa fa-github" aria-hidden="true">
更多使用方法见Font Awesome 图标
可使用的图标有fontawesome
处于好奇的目的,在网站上投放广告的目的,为了不影响阅读,放在了文章的最下面
投放方式很简单
在GoogleAdsense注册账户,大约一天后获得通过
选择适当的广告类型,生产JavaScript脚本,复制粘贴到网页的相关内容处即可,也可以直接全局广告放入head元素内,谷歌会根据网页的内容,自动加入广告
此次更新,在index.html
的侧边栏,和_layouts\post.html
的评论区后,加入广告
参考towdium,加入中英文介绍
添加好友链接,增加了_layouts/about.html
关于页模板
disqus国内被墙,改用来必力
在此页面livere安装
获得id后填入_config.yml
中的City_uid
修改中_includes\footer.html
busuanzi的域名为busuanzi.ibruce.info
git config core.ignorecase false
添加到_layout
里面的模板文件中,源码来自github-buttons
<iframe src="/https/github.com/html_script/github-btn.html?user=cndaqiang&repo=cndaqiang.github.io&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
<iframe src="/https/github.com/html_script/github-btn.html?user=cndaqiang&type=follow&count=true&size=large" frameborder="0" scrolling="0" width="220px" height="30px"></iframe>
把之前的github的star和follow替换为
<div class="label-card">
<a href="https://github.com/cndaqiang/cndaqiang.github.io" title="RSS"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i>Star</a>
</div>
添加到
_layouts/post.html
_layouts/about.html
源代码来自revolvermaps
<!-- 其他div框放到这里 ,添加br 使不粘连--><br>
<div class="side">
<div>
<i class="fa fa-database"></i>
访客数据
</div>
<script type="text/javascript" src="//rf.revolvermaps.com/0/0/7.js?i=537vyn60ia7&m=0&c=007eff&cr1=ff0000&sx=0" async="async"></script>
</div>
添加到_layouts/default.html
<html style="filter:grayscale(100%);">
修改无黑白0%-完全黑白100%
_includes/header.html
添加
<a href= http://www.gov.cn/zhengce/content/2020-04/03/content_5498472.htm>
<h1>深切哀悼</h1><b>抗击新冠肺炎疫情斗争牺牲烈士和逝世同胞</b>
</a>
添加到_includes/header.html
<a href="http://cndaqiang.gitee.io/{{ page.url }}">gitee:http://cndaqiang.gitee.io</a>,
<a href="https://cndaqiang.github.io/{{ page.url }}">Github:https://cndaqiang.github.io/</a>.
博客更新 2020-04-18使用Bundler配置环境
配置方法使用Bunlder搭建Jekyll(Github-pages)服务
sudo gem install bundler
bundle install
bundle exec jekyll serve [-P port]
全面迁移gitee, Now only for me.
使用web分支作为所有内容,master分支为公开内容.
通过修改_config.yml
和相关页面, 本地搭建时关闭在线js, 如讨论,广告,联系方式等.
更换Twikoo评论系统.
使用Vercel 部署部署,并添加前端代码到_includes/comments.html
.在_config.yml
中定义
twikooID: https://vercel-comment2-jhck1hsa5-cndaqiang.vercel.app/
生效
仓库名用cndaqiang.gitlab.io
建立.gitlab-ci.yml
, 里面的环境和本地搭建的环境一样,注意ruby用2.7.0
image: ruby:2.7.0
variables:
JEKYLL_ENV: production
LC_ALL: C.UTF-8
before_script:
- gem install bundler
- bundle install
test:
stage: test
script:
- bundle exec jekyll build -d test
artifacts:
paths:
- test
except:
- master
pages:
stage: deploy
script:
- bundle exec jekyll build -d public
artifacts:
paths:
- public
only:
- master
后续push会自动在CI更新,如更新失败可去CI查看详情
# html
<div id="cse" style="width: 100%;" class="xxx">Loading</div>
# css
#class -> .xxx
.xxx {
}
# id -> #xxx
#xxx {
}
- 谷歌广告收入达到$10,需要添加收款地址设置PIN否则停止展示广告,
等待验证中,验证通过,恢复展示 -
- 通用最好: 文章内嵌
-
- 广告代码有一段通用代码,放在head内即可
审核中: http://union.2345.com/union_e2345.php- 百度联盟不过审
- 通过图片和链接的方式给云服务器商推广,如腾讯和西部数码
<a href="https://curl.qcloud.com/ph2YL72r" target=_blank><img src="/https/github.com/web/Adsense/tengxun.345x200.jpg" border=0></a>
- 阿里联盟只能手动选择商品,然后添加文案到网页,且商品有推广时限,也不定向,小流量不适合
- 京东联盟,大多数都是商品活动的固定链接. 自定义推广中橱窗推广是js脚本
jekyll启动后,打包_site
目录,上传至群晖,新增虚拟主机,后端Apache,根目录即_site
目录
public.sh
部署到../cndaqiang
用于发布到gitee.sh,要删除违规内容public.sh github.cndaqiang
部署到../github.cndaqiang
用于发布到githubpublic.west.sh
发布到west虚拟空间,自动删除多媒体文件,替换相对链接为绝对链接public.txt
public.sh
会发布的文章public.west.txt
public.west.sh
会发布的文章public.hexie.txt
public.west.sh
要删除的违禁文章
- 修改博客的rss订阅,
cp feed.xml sitemap.xml
,修改链接href="{{ "/sitemap.xml"
和去掉限制limit:10
,会自动生成本网站的sitemap,也是,https://cndaqiang.github.io/sitemap.xml
- 使用第三方网站制作
https://www.xml-sitemaps.com/