-- 下面这两行本来是在和之间的， 但是我喜欢把图片展示在右边，所以把这两行代码移了下来...解决冲突 为什么会说有冲突呢，因为上面对文章封面图片进行了调整，会影响到文章里面顶部的图片展示，所以我给出的解决方案是： ① 定位到目录 layouts/partials/cover.html，在相同目录下创建一个名字为..."IsHome" false "isHidden" 这样文章封面调用的是经过修改的图片，而文章里面顶部的图片调用的是未经修改的图片 4....效果 修改前的样子，一个页面几乎只能展示 1~3 篇文章 image.png 修改后的样子，现在一个页面可以展示更多的文章 image.png image.png …如果遇到问题，欢迎大家提问…
当开始一个博客时，许多WordPress初学者发现很难在他们的网站上更改或自定义页面布局。...它有几个基本和高级模块，几乎涵盖了您可能想要添加的任何内容。有许多模块可以添加图片、幻灯片、旋转、背景、内容块、按钮等等。 最重要的是，Beaver Builder对于初学者非常容易使用。...它速度超快，使用起来非常简单，并附带大量模块和模板。 ## Divi Divi是一个拖放主题和WordPress页面构建器。...这是一个非常容易使用和快速的WordPress主题，以及20 +为不同类型的网站布局/模板。 您可以创建并保存自己的Divi布局。您也可以将布局从一个Divi安装导出到另一个。...页面构建器功能非常棒，它允许您使用其他WordPress主题。但是，Divi使用了很多简码，这使您很难在将来切换主题或使用其他页面构建器。
0、Divi主题 Divi主题是一款非常流行的可视化编辑主题，尤其是它的可视化编辑器Divi Builder，可以用来编辑网页，今天我们就教大家如何购买Divi主题以及安装Divi主题。...Divi主题是elegantthemes的一款主题，而Elegant的付费方式为会员制，也就是说只要我们加入了Elegant的会员，就可以使用Divi主题以及Divi Builder等等许多主题和插件，...而且关键是这个主题也是免费开放给大家使用的wordpress主题，cms内容站点非常适合，个人博客也可以的。这款主题也算是良心主题吧。...5、yusi欲思博客主题 yusi2.0 这个是付费主题，同git主题差不多的，据说git主题是基于yusi修改的。 ?...6、JustNews主题 JustNews主题专为博客、自媒体、资讯类的网站设计开发，自适应兼容手机、平板设备，支持前端用户中心，可以前端发布/投稿文章，同时主题支持专题功能，可以添加文章专题。
他们还包括“页面构建器”的“空白”，“盒装”和“全角”模板，如果您选择使用诸如Visual Composer或Divi Builder的页面构建器，这是理想的选择。...选择您希望如何利用基本主题内的主要窗口小部件区域。 有一个主边栏，一个博客边栏，单个帖子边栏和页面边栏。...SitePoint Base Theme supports all of the major page builders, including Visual Composer, Beaver Builder, Divi...SitePoint基本主题支持所有主要的页面构建器，包括Visual Composer，Beaver构建器，Divi构建器和SiteOrigin。...我们有一篇很棒的文章，解释了WordPress页面构建器的功能 ，其中还包括了一些利弊。
分享几个实用的HEXO博客功能插件 2017-05-16 by Liuqingwen | Tags: Hexo | Hits 一、前言 即使是作为一名前端完全新手，也不希望自己的博客页面功能过于简单...，虽然花哨的功能不需要，但是一些最基本的大众化模块还是要有吧，我的 Hexo 博客使用的主题 Phantom （下文中提到的主题文件夹也就是这个文件名，但是我会写成 ${theme_dir} ）就是属于功能模块比较简单的那种主题...二、功能模块 我这里主要使用也是推荐应用的功能模块主要就以下几个： Markdown 中自定义 CSS 样式 添加博客 RSS 订阅功能 文章添加 emoji 表情符 文章里图片的懒加载功能 强大的静态搜索功能插件...其实表情符都是一些小图片，如果直接在写文章的时候像插入图片一样插入表情符，那会比较痛苦，所以我们需要安装一个表情符简写渲染的插件： hexo-filter-github-emojis ： $ cnpm...： :your_emoji_1: :your_emoji_2: ，最后文章渲染显示就是类似这样的表情图片了： ?
评论表情 本主题自带评论表情功能，无需插件在后台即可设置 瀑布流 文章列表可选择卡片或列表排序，其中卡片又可设置为普通或瀑布流形式 不刷新加载 全局提供ajax加载文章 打赏 允许通过多种途径打赏，如...niRvana主题是一款轻拟物风格的wordpress主题，该博客主题设计上不再趋从于现有的扁平风，我认为是时候从极致的扁平稍微向拟物致敬了。...UI样式 您可以轻松的在文章中插入小标题样式、模态框、提示框、折叠内容、内容回复可见、下载按钮、下拉菜单、站内文章链接等，例如： 图片 图片 未标题 显示下拉菜单 左眼会配右眼哭の博客...2、新增：输入框打字特效 v3.0.0 1、新增：检测当前文章页面百度是否收录，收录状态仅管理员可见 2、新增：文章图片自动添加alt属性和title属性 3、新增：博客文章添加版权提醒功能 4、新增...v1.3.1 1、新增一种首页图片的显示模式：不需要3D显示，而是扁平化显示。此模式下，安卓手机渲染首页会非常快。 2、安卓手机显示coverflow会比较卡，所以强制使用了上述的扁平化显示。
关于 hexo:Hexo是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。...本地的代码如果没有其他用，可以不上传Github仓库。...关于Amazing主题中,评论模块和碎碎念等issue需要申请Gitub客户端授权，这里可以参考使用说明系列（部署中有问题此issue讨论）:https://github.com/removeif/hexo-theme-amazing...关于搭建好博客系统如何写文章，其实特别方便，需要指定文件夹新建一个markdown文件，内容如下： title: 标题 top: 1 toc: 是否显示目录 recommend: 文章推荐权值 keywords.../blog PC端 首页 归档 博客阅读 ---- 平板 首页 博客阅读(主题跟换) ---- 留言墙 手机端 图片 具体的搭建教程 默认小伙伴已经安装了Node.js 、Git
Getting Started with Hexo 本篇文章记录Hexo 安装,部署以及日常使用的流程,最终实现: 通过cmd输入4行命令将本地md文件更新到网络上的个人博客 文章分为4大部分,包含:...hexo s 此时进入 localhost:4000 查看本地博客显示 安装主题 在网络上找到需要主题的链接, hexo根目录下使用git clone git clone https://github.com...--save 根目录_config.yml新增相关配置 search: path: search.xml field: post Hexo博客中无法显示图片 Typora中使用相对路径显示正常的图片...,Hexo编译后无法显示,安装hexo-renderer-marked插件进行解决,缺点是Typora里面会显示错误 参考博客 : hexo博客如何插入图片 - 知乎 (zhihu.com) 插件安装配置...,可以通过修改js代码修改访问次数达到效果 参照博客: JQuery实现“不蒜子”初始化首次数据 - 国际哥的独立博客 (shaoguoji.cn) 文章链接转静态短地址 Hexo 默认生成的永久链接也会有中文
图片 注意二 如果出现如图错误网络报错，再次尝试，多次尝试，直到更换WiFi~~~~ 图片 访问GitHub博客 图片 访问博客，开始的页面是初始化页面，没有做美化和增加内容。...例如：在更换主题后，如果发现站点更改不生效，可以运行该命令。...--unset https.proxy 再次安装主题即可成功 应用主题 theme: butterfly 图片 安装插件 如果你没有 pug 以及 stylus 的渲染器，请下载安装： npm...install hexo-renderer-pug hexo-renderer-stylus --save 图片 Butterfly 主题美化 生成文章唯一链接 Hexo的默认文章链接格式是年，月，...npm i hexo-deployer-git hexo new post "新建博客文章名" hexo cl && hexo g && hexo s hexo更换背景图片 背景图片参考网址： https
但是用得不太顺手，原因有很多，比如：老是花时间在怎么改网页主题上，而不是专注在写作上；markdown（md）文件中的图片迁移很麻烦，网上的图片老是会丢失；github page 在国内打开很慢而且SEO...此外，md文档中的图片用图床解决移动问题，然后托管到git自动渲染成网页。这样只要图床不挂，分享或上传到其它平台就很方便，因为只要复制md文档就行。为什么不直接用有道云笔记中的md呢？...把远程的静态网页文件进行渲染，形成让大家可根据网址直接阅览的网页。可用github page和Netlify. 找到有道云笔记的md文件，用typora进行编辑，并用图床解决图片容易丢失问题。...但是可一点也不cool啊，客官别急，请看下面进阶教程。 四、进阶 1、添加主题 首先我们可以到hugo主题库中找一个自己喜欢的主题。...我比较喜欢的一个主题是academic，B站上还有人介绍Academic视频。 由于大部分主题都已经有站点所需要的各种文件夹，所以不用自己再建站点。直接clone下来，把主题换成子模块的就行。
Hexo是一个静态博客框架，基于Node.js，将Markdown文章通过渲染引擎，生成一个静态网页，再结合Git命令（ssh），Hexo 是一个快速、简洁且高效的博客框架。...Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。...主题特性 简单漂亮，文章内容美观易读 Material Design 设计 响应式设计，博客在桌面端、平板、手机等设备上均能很好的展现 首页轮播文章及每天动态切换 Banner 图片 瀑布流式的博客文章列表...支持 MathJax TOC 目录 可设置复制文章内容时追加版权信息 可设置阅读文章时做密码验证 Gitalk、Gitment、Valine 和 Disqus 评论模块（推荐使用 Gitalk） 集成了不蒜子统计...，然后选取主题中对应的特色图片，从而达到让所有文章都的特色图各有特色。
如果你用 Markdown 写博客，Hexo 可以在几秒内生成带有精美主题的静态文件。...node_modules：node 模块文件夹。包含可执行文件和依赖的资源。 package-lock.json：node_modules 文件中所有模块的版本信息，模块来源。...，适配桌面端、平板、手机等各种设备 前端性能优化，加载快速，眨眼之间即可加载完成 图片懒加载，应用懒加载技术加快页面的生成速度 资源压缩，提升本地资源请求速度 精简设计，不包含 Jquery 等额外库...参数 Front-matter banner_img 设置文章与首页头图 banner_img_set 在图片加载时预先加载的图片，可以设置为 loading 图或缩略图等 excerpt 为文章设置在首页显示的简介...，在主题配置文件中设置 wordcount: enable: true 开启（默认开启） 图片画廊 图片画廊功能基于 fslightbox[28]，在主题配置文件中设置 fslightbox:
/LoveIt 或者, 初始化项目目录为 git 仓库, 并且把主题仓库作为网站目录的子模块: 1 2 git init git submodule -b master add https://github.com...2.4 创建博客 创建第一篇博客 1 hugo new posts/first_blog.md Hugo 允许在文章内容前面添加 yaml, toml 或者 json 格式的前置参数。...如果想要渲染这些页面, 请从元数据中删除属性 draft: true, 或者设置属性 draft: false. 2.5 在本地启动网站 1 hugo server 也可以在启动server时应用主题...我使用的是Git Page，可以参考我的另一篇文章Hugo+Github Pages搭建博客 3 配置相关问题（常见坑总结） 3.1 图片路径 如下面的config.toml文件，截取了部分 1 2 3...3.2 本地和站点图片路径不一致 在 Typora 中编辑文章插入图片能够显示，而发布后网页中的图片不能正常显示（路径错误）。
，当博客更新后需要hexo algolia重新提交索引，而indigo是本地生成json数据，部署上更加方便一些 本次还探索了使用本地图片来完成markdown的方法 切换主题 在github上的主题切换用的是修改配置文件...切换主题基本没什么大的问题，直接把主题放入theme文件夹，而后在——config.yml进行配置即可，这个过程倒是很顺利，但在完成后会发现，所有的文章都没有缩略介绍，查看了说明才发现针对缩略介绍的文字这块是下放到主题上的...样式微调 针对indigo这个博客主题，感觉文章显示宽度比较小，通过研究less样式表，把一个变量从绝对像素变成了百分比，从而顺利解决了适配问题 另外在使用indigo博客主题时，发现最新版本的toc渲染不对头...博客折腾体会 虽然瞎费了不少功夫，不过对前端静态博客的架构有了一定的认识，对自己用的东西最起码有个了解的底气~ 通过引入了hexo-asset-image,从而可以本地使用图片，相信这个对于写博客有很大的用途...最初看到的主题样例都是有丰富的图片展示，下一步就是增加一些博客图片，从而让博客有些灵气~ PS:附上两个博客的地址 tranquilpeak indigo
首先需要明白的是，Hexo 的博客内容（静态内容）均由 generate 生成，其核心是一个 node 应用，提供了一系列帮助函数，或者说调用接口；而各种主题，只不过是在其规定的框架内，以一种特定的模板...原页面修改 由上面可知，对博客进行的任何修改，这里特指简单的、在已有界面上的修改，均需要找到渲染/生成该 HTML 页面（浏览器中我们可见的部分）的模板文件，在模板文件中进行我们想要的修改。...-- 下面的模块，第一个是左右导航栏，第二个是咱们的相关文章模块，第三个是评论 最后，还包括了打赏图标（reward）在文章最底部 --> <%- partial('post...假象模块： 单一维度：分类及标签的名称及数量（柱状图） 两个维度：文章发布的频率：日历图（类似github贡献图） 复杂分析：以文章类别为一组，标签为一组，出现在同一文章中则算作有关联，分析全部文章，将分类和标签的关系用...其实有以下几种方式实现： 直接将该文件放在博客文件中一起发布，这对于单个小文件来说并无大碍，比如自己的头像完全可以这样放，但（以图片举例）图片过大，或者数量过多，就一定不能将其和其他文件放在一起，原因是
如果你是 WordPress 的初学者，请从使用起来非常灵活的主题开始。由于主题的选择，某些选项可能会出现或消失。还有其他可用的主题，例如电子商务、博客等。...WordPress 网站上有许多可用的主题，但最常用的主题是 Astra Theme、Divi By ElegantThemes、Ultra、Spencer 等等。...主题和插件之间的区别 在主题和插件中发现的功能之间存在交叉是很常见的。但是，最佳做法是： 主题 主题控制内容的呈现。主题基本上是关于网站的整体外观。你的主题决定了你的网站的外观。...WordPress 中安装了一个默认主题。此外，主题可根据你的用途使用。有些主题被称为“多用途”，有些被称为“利基”主题。要记住的一点是，我们一次只能使用一个主题。...使用你的功能构建其作品集的用户在更改主题时将丢失它。 插件 插件用于控制 WordPress 网站的行为和功能。你可以在单个网站上使用尽可能多的插件。在上面的文章中，区别很明显。
主题的安装以及配置 hexo框架可以选用多种主题渲染，主题主页为：https://hexo.io/themes/ ， 用户可以在该网站下载任意主题并进行个性化配置。...我喜欢next这个主题，该小节以next主题为例。 （1） 下载主题：将next主题下载到博客目录下的themes里面的next文件夹中。...插入图片技巧 因为hexo渲染是根据markdown文档渲染，在处理图片的时候会直接引用地址，需要做一些修改。...主页显示摘要 默认情况下hexo博客(如本站)的首页显示的是完整的文章 – 而文章比较长的时候这无疑会带来很多不方便的地方。...通过在每篇博客中添加： 做到主页仅仅显示摘要的效果，在 之前为主页显示的内容。之后为文章剩下的内容。复制该段代码一定选择粘贴文本。 ? 4.
Hexo 搭建个人博客 Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。 0....，当然你也可以选择不更换域名。...Hexo + Fluid 美化 本博客的主题已由 Fluid 改为 Butterfly, 部分功能可能失效，请注意！...Hexo 有很多好看的主题，大家可以在 Hexo 主题 中寻找自己喜欢的主题，我自己主要使用过 Fluid、Butterfly 这个主题，下面是我美化折腾的过程。...Hexo 优化 图床 本博客图床已迁移到 OSS, 部分功能可能失效，请注意！ 随着博客内容的增加，文章图片的数量也不断增长，如何引用存储图片就成了一个问题。
新型肺炎肆虐，只能呆在家里，闲来无事，自己撸个博客，别人的再好也是别人的，自己的再不好也是自己的。 1....关于 这新型肺炎搞得，又出不去，又不想学习，就随便写个博客玩玩，还有好多 BUG 先上线了再说。...:tw-1f30d: :tw-1f30e: :tw-1f30f: 支持 标准makedown，Twemoji, Fontawemore, 科学公式，TOC目录，html渲染。...管理模块需要登录 :fa-times: 根据时间归档 :fa-times: 图片上传，图床 :fa-times: 搜索文章 :fa-times: 关于页面 :fa-times: 提示框美化 :fa-times...） 3.感谢 前端首页和详情页模仿 hexo 主题 前端 makedown 渲染和编辑使用 Editor.md 前端框架使用 DiQuick 前端 MVVM 实现使用 Vue 部分图标来自 iconfont
领取专属 10元无门槛券
手把手带您无忧上云
