oracle-move-data

注意看标题是在hexo博客内自定义html页面，不是md文件。

需求

hexo博客内支持添加自定义html网页，网页内容是实现商品条码解析功能

任务解析

• 在hexo的框架下能自定义html吗？能，hexo虽然是写markdown文档，但最后还是编译成html了。
• 怎么手写html网页呢，用什么技术？
• 商品条码能解析出什么？

实战

• hexo框架下如何自定义html直接度娘后方法如下：

1. 首先在博客根目录的source文件夹下，新建一个文件夹用于存放要部署的html文件

2. 然后在博客根目录的配置文件_config.yml文件里，设置跳过渲染

   skip_render: 
     # 跳过单个文件
     "xxxx.html"
     # 跳过文件夹下所有文件
     "文件夹名/*"
     # 跳过子文件夹
     "文件夹名/子文件夹名/*"
     # 跳过文件夹下所有子文件夹和文件
     "文件夹名/**" 
   

3. 最后处理css、js文件 因为hexo部署的是静态文件，所有文章的md文件会被渲染成html文件， hexo会帮我们把所有css、js文件都加到文章里，我们之前跳过了渲染，所以就需要手动把css、js整合到html文件里，找到添加的html文件的首页，找到添加的html文件的首页直接引入css,js即可

   <link rel="stylesheet" href="css/xxx.css">
   <script src="js/xxx.js"></script>
   

4. 如果想将这些html的界面放到导航菜单栏上，那找到导航栏的位置，添加链接即

   menu:
      主页: / || fas fa-home
      标签: /tags/ || fas fa-tags
      Demo||fas fa-file-code:
        - myhtml-1 || /html/myhtml1.html || fas fa-code
        - myhtml-2 || /html/myhtml-2.html || fas fa-code
   

• html网页技术

  1. html+css用皮肤的页面布局框架和bootstrap框架https://www.bootcss.com/
  2. js+jquery简易人机交互
  

• 解析商品条码

  1. 条码可以解析出自身的商品信息，比如超市里扫码收银
  2. 有一种医疗商品条码自身还携带一些出厂的生产信息，比如生产日期，失效日期，生产批号，序列码等等

• 视频介绍地址：https://www.bilibili.com/video/BV1fN4y147r6

---

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 2459501893@qq.com