韦德国际bv1946_www.bv1946com_韦德国际1946手机版
做最好的网站

中添加如下代码

日期:2020-02-08编辑作者:韦德国际bv1946计算机

图片 1标题图

Hexo博客主题优化

themes/*/source/css/_custom/custom.styl 中添加如下代码:

body{ background:url(/images/bg.jpg); background-size:cover; background-repeat:no-repeat; background-attachment:fixed; background-position:center;}

themes/*/source/css/_custom/custom.styl 中添加如下代码:

@font-face { font-family: Zitiming; src: url('/fonts/##.ttf.ttf');}.site-title { font-size: 40px !important; font-family: '##' !important;}

文件在 themes/next/source/fonts 目录下,保留字体文件。

npm install hexo-generator-sitemap --savenpm install hexo-generator-baidu-sitemap --save

站点配置文件_config.yml中添加以下代码

sitemap:path: sitemap.xmlbaidusitemap:path: baidusitemap.xml

站点配置文件_config.yml

## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'url: http://你的网站

图片 2效果

打开themes/next/source/css/_custom 下的 custom.styl 文件

// 黄span#inline-yellow {display:inline;padding:.2em .6em .3em;font-size:80%;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0;background-color: #f0ad4e;}// 绿span#inline-green {display:inline;padding:.2em .6em .3em;font-size:80%;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0;background-color: #5cb85c;}// 蓝span#inline-blue {display:inline;padding:.2em .6em .3em;font-size:80%;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0;background-color: #2780e3;}// 紫span#inline-purple {display:inline;padding:.2em .6em .3em;font-size:80%;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0;background-color: #9954bb;}

编辑的文章地方

 站点配置文件  站点配置文件  主题配置文件  主题配置文件 

themes/next/source/css/_common/components/sidebar/sidebar-author.styl.site-author-image定义

border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;

hexo站点的source文件,在source文件夹中新建文件robots.txt

User-agent: * Allow: /Allow: /archives/Disallow: /vendors/Disallow: /categories/Sitemap: http://www../sitemap.xmlSitemap: http://www../baidusitemap.xml

# hexo robots.txtUser-agent: *Allow: /Allow: /archives/Disallow: /vendors/Disallow: /js/Disallow: /css/Disallow: /fonts/Disallow: /vendors/Disallow: /fancybox/Sitemap: http://www..com/sitemap.xmlSitemap: http://www..com/baidusitemap.xml

source/css/_variables/custom.styl 文件

// 修改成你期望的宽度$content-desktop = 700px// 当视窗超过 1600px 后的宽度$content-desktop-large = 900px

themes/*/layout/_partials/head.swig文件

<script> (function(){ if('{{ page.password }}'){ if (prompt !== '{{ page.password }}'){ alert; history.back();</script>

文章上

---password: 123456---

themes/next下的_config.yml文件

avatar: http://example.com/avatar.png

或者使用本地图片,图片把放入themes/next/source/images

avatar: /images/vator.png

.site-author-image { display: block; margin: 0 auto; padding: $site-author-image-padding; max-width: $site-author-image-width; height: $site-author-image-height; border: $site-author-image-border-width solid $site-author-image-border-color; // 修改头像边框 border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; // 设置旋转 transition: 1.4s all;}// 可旋转的圆形头像.site-author-image:hover { -webkit-transform: rotate; -moz-transform: rotate; -ms-transform: rotate; -transform: rotate;}

/themes/*/source/js/src下新建文件click.js

!function{function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate;-webkit-transform: rotate;-moz-transform: rotate;}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o}function r(){for(var e=0;e<d.length;e  )d[e].alpha<=0?(t.body.removeChild,d.splice:(d[e].y--,d[e].scale =.004,d[e].alpha-=.013,d[e].el.style.cssText="left:" d[e].x "px;top:" d[e].y "px;opacity:" d[e].alpha ";transform:scale(" d[e].scale "," d[e].scale ") rotate;background:" d[e].color ";z-index:99999");requestAnimationFrame}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function{t&&t}}function i{var a=t.createElement;a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s,t.body.appendChild}function c{var a=t.createElement;a.type="text/css";try{a.appendChild(t.createTextNode}catch{a.styleSheet.cssText=e}t.getElementsByTagName[0].appendChild}function s(){return"rgb(" ~~(255*Math.random "," ~~(255*Math.random "," ~~(255*Math.random"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function{setTimeout}}}(window,document);

themes*layout_layout.swig文件末尾添加

<!-- 页面点击小红心 --><script type="text/javascript" src="/js/src/clicklove.js"></script>

Hexo 站点下的 _config.yml 文件

permalink: :category/:title/

$ cd you-site$ hexo new page tags

创建后,打开you-site/source/tagsindex.md

---title: #页面主题date: #当前创建文件时间type: "tags" # 设置页面类型---

$ npm install hexo-generator-feed --save

Hexo 站点下的_config.yml

# feed# Dependencies: https://github.com/hexojs/hexo-generator-feedfeed: type: atom path: atom.xml limit: 20 hub: content:

打开 themes/*/source/css/_custom/custom.styl

// 主页文章添加阴影.post { margin-top: 0px; margin-bottom: 60px; padding: 25px; -webkit-box-shadow: 0 0 5px rgba(202, 203, 203, .5); -moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);}

themes/*/_config.yml

# Back to top in sidebarb2t: true# Scroll percent label in b2t buttonscrollpercent: true

themes/next/source/css/_common/components/post/下的post-eof.styl

.posts-expand { .post-eof { display: block; // margin: $post-eof-margin-top auto $post-eof-margin-bottom; width: 0%; //分割线长度 height: 0px; // 分割线高度 background: $grey-light; text-align: center; }}

主题配置文件下

# Declare license on postspost_copyright: enable: true license: CC BY-NC-SA 3.0 license_url: https://creativecommons.org/licenses/by-nc-sa/3.0/

themes/next/layout/_macro/下的post.swig文件

<div > {% for tag in post.tags %} <a href="{{ url_for }}" rel="tag"><i ></i> {{ tag.name }}</a> {% endfor %}</div>

$ npm i --save hexo-wordcount

themes/next下的_config.yml

# Dependencies: https://github.com/willin/hexo-wordcountpost_wordcount: item_text: true #字数统计 wordcount: true #预览时间 min2read: true #总字数 totalcount: false separated_meta: true

themes/next/source/css/_custom/下的custom.styl

.post-body p a{ color: #0593d3; border-bottom: none; border-bottom: 1px solid #0593d3; &:hover { color: #fc6423; border-bottom: none; border-bottom: 1px solid #fc6423; }}

百度SSP和谷歌Adsense

注册,复制代码,在theme/*/layout/_custom/google_ad.swig, AdSense 上的代码粘贴进去,复制一份theme/*/layout/_custom/head.swig

theme/*/layout/post.swig添加:

{% include '_custom/google_ad.swig' %}

{% block content %} <div > {{ post_template.render }} {% include '_custom/google_ad.swig' %} </div>{% endblock %}

themes/next下的_config.yml

pace: true# Themes list:#pace-theme-big-counter#pace-theme-bounce#pace-theme-barber-shop#pace-theme-center-atom#pace-theme-center-circle#pace-theme-center-radar#pace-theme-center-simple#pace-theme-corner-indicator#pace-theme-fill-left#pace-theme-flash#pace-theme-loading-bar#pace-theme-mac-osx#pace-theme-minimal# For example# pace_theme: pace-theme-center-simplepace_theme: pace-theme-flash

下载插件clipboard.js

themes/next/source/lib/,下新建clipboard文件夹

src文件夹下的文件拖动到clipboard文件夹

themes/next/source/js/src/,建立custom.js

function createCopyBtns() { var $codeArea = $("figure table"); if ($codeArea.length > 0) { //复制成功后将要干的事情 function changeToSuccess { $imgOK = $("#copyBtn").find("#imgSuccess"); if ($imgOK.css("display") == "none") { $imgOK.css({ opacity: 0, display: "block" }); $imgOK.animate({ opacity: 1 }, 1000); setTimeout(function() { $imgOK.animate({ opacity: 0 }, 2000); }, 2000); setTimeout(function() { $imgOK.css("display", "none"); }, 4000); }; }; $(".post-body").before('<div style="opacity: 0; position: absolute;top:0px;display: none;line-height: 1; font-size:1.5em"><i ></i><i aria-hidden="true"></i>'); var clipboard = new Clipboard('#copyBtn', { target: function() { return document.querySelector("[copyFlag]"); }, isSupported: function() { return document.querySelector("[copyFlag]"); } }); clipboard.on('success', function { //清除内容被选择状态 e.clearSelection(); changeToSuccess; clipboard.on('error', function { console.error('Action:', e.action); console.error('Trigger:', e.trigger); }); //鼠标 $("#copyBtn").hover( function() { $.stop(); $.css("opacity", 1); }, function() { $.animate({ opacity: 0 }, 2000); } ); }}$.hover( function() { //移除之前含有复制标志代码块的 copyFlag $("[copyFlag]").removeAttr("copyFlag"); //在新的(当前鼠标所在代码区)代码块插入标志:copyFlag $.find.attr("copyFlag", 1); $copyBtn = $("#copyBtn"); if ($copyBtn.lenght != 0) { $copyBtn.stop(); $copyBtn.css("opacity", 0.8); $copyBtn.css("display", "block"); $copyBtn.css("top", parseInt($copyBtn.css   $.offset().top - $copyBtn.offset().top   3); $copyBtn.css("left", -$copyBtn.width; } }, function() { $("#copyBtn").animate({ opacity: 0 }, 2000); });$.ready(function() { createCopyBtns;

themes/next/layout/_custom/建立custom.swig

<script type="text/javascript" src="/lib/clipboard/clipboard.min.js"></script><script type="text/javascript" src="/js/src/custom.js"></script>

themes/next/layout/_layout.swig,标签在</body>上面

{% include '_custom/custom.swig' %}

或者

  • clipboard.min.js 推荐

保存在下面这个目录.themesnextsourcejssrc目录下,创建clipboard-use.js

/*页面载入完成后,创建复制按钮*/!function  { /* code */ var initCopyCode = function(){ var copyHtml = ''; copyHtml  = '<button data-clipboard-snippet="">'; copyHtml  = ' <i ></i>copy'; copyHtml  = '</button>'; $(".highlight .code pre").before; new ClipboardJS('.btn-copy', { target: function { return trigger.nextElementSibling; } }); } initCopyCode();}(window, document);

.themesnextsourcecss_customcustom.styl样式

//代码块复制按钮.highlight{ //方便copy代码按钮的定位 position: relative;}.btn-copy { display: inline-block; cursor: pointer; background-color: #eee; background-image: linear-gradient(#fcfcfc,#eee); border: 1px solid #d5d5d5; border-radius: 3px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-appearance: none; font-size: 13px; font-weight: 700; line-height: 20px; color: #333; -webkit-transition: opacity .3s ease-in-out; -o-transition: opacity .3s ease-in-out; transition: opacity .3s ease-in-out; padding: 2px 6px; position: absolute; right: 5px; top: 5px; opacity: 0;}.btn-copy span { margin-left: 5px;}.highlight:hover .btn-copy{ opacity: 1;}

.themesnextlayout_layout.swig文件中,添加引用

<!-- 代码块复制功能 --> <script type="text/javascript" src="/js/src/clipboard.min.js"></script> <script type="text/javascript" src="/js/src/clipboard-use.js"></script>

个人博客

本文由韦德国际bv1946手机版发布于韦德国际bv1946计算机,转载请注明出处:中添加如下代码

关键词: 主题 博客 Hexo

实在吐槽新浪的这个博客产品的设计

web前端学习之HTML CSS/javascript之一,cssjavascript 前端编码之路之坎坷,web前端应该一直是个战场吧,各种浏览器的不兼...

详细>>

而常看我博客的朋友应该知道我对python情有独钟

一. 农业时代 创业最重要的就是一个“快”字,所以最开始的时候,所有的架构都以快速出模型为前提。 而常看我博...

详细>>