原理

使用iframe标签,更改其中src的aid和cid,使其对应要插入的视频,即可在文章内插入bilibili视频

获取cid

aid即为视频的av号,cid有两种获取方式,一是通过bilibili分享按钮直接可以看到嵌入代码,将代码内的cid复制即可(推荐),二是通过网页源代码查看(之前没有注意到到还能直接从分享按钮里看)。

这里简单介绍一下通过网页源代码看的方法:

  1. 右键,查看网页源代码(不能F12,F12看不到cid)
  2. ctrl+f 搜索cid,即可找到对应的cid。

插入方法

使用tinymce编辑器,选择编辑html原代码,插入以下代码即可

<iframe src="//player.bilibili.com/player.html?aid=对应aid&amp;cid=对应cid&amp;page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="95%" height="450">
</iframe>

注:不建议直接使用bilibili的嵌入代码,样式较丑,当然你会自己调的话也可以

示例

示例使用Umika的“秋山澪与折木奉太郎的爱情故事 // Our Tapes”,非常棒的AMV,绝对的神作

博客内插入bilibili视频的更多相关文章

  1. 使用Scribefire在博客中插入语法高亮

    效果如下, 文字1 int cool void main() { cout<<"hello world!"<<endl } 文字2 经过一番折腾,终于搞定了 ...

  2. hexo博客如何插入图片

    Hexo是一个静态的博客网站生成器,生成一个博客只需要分分钟的时间就能搞定. Hexo的博文是支持Markdown格式的,发表一篇文章只需要简简单单的几个命令. hexo new '文章'就会生成一个 ...

  3. 如何在博客中插入jsfiddle的代码

    1.进入官网:https://jsfiddle.net/ 可以看到如下界面,顶端的控制按钮包括:保存,运行,代码格式化等: 2.将html.css.js分别写在指定的位置当中,最后一个框result是 ...

  4. 使用Markdown在博客里插入代码

    今天尝试了一下在线使用Markdown编辑器写博客,发现想要实现下面这样的效果还真得折腾一会儿. <html> <head> <meta charset="ut ...

  5. 手把手教你在CSDN博客中插入图片之剑走偏锋系列

    1.在博客园注册账号.你没有看错,就是博客园,在图像上传方面博客园比CSDN这个垃圾强太多了. 2.在博客园进入随笔撰写编辑模块,点击上传图像按钮(点最黄的那个,别点错了). 3.弹出如下窗口 ,点击 ...

  6. 使用Scribefire在博客中插入语法高亮 II

    效果如下, 这是我们在Scribefire中添加的code按钮,单击此按钮,则会出现 在codeHere中直接输入代码就可以了. 查看html 可以看到,其中已经添加了<pre>标签. 下 ...

  7. Hexo博客中插入 Chart 动态图表

    该文基本(全部)来自于chatjs中文文档 由于使用pjax,导致页面需要二次刷新才会显示表格,故引入了自动刷新的JS,但这样会导致回退标签失效 背景 今天在谷歌上逛博客时,突然发现shen-yu大佬 ...

  8. myblogplus 第二期 慕舲原创 如何删除官方在你博客内设置的所有广告

    问题描述: 文章下方广告渐多了起来,这也无可厚非,原来只有小小一幅的,毕竟博客园团队很卖力,博客园首页不是在更新吗,博问也在推广(虽然解答者不多,提问者很多) 不过无疑很影响美观,那些可以让他设置,不 ...

  9. 如何在发布博客时插入复杂公式——Open Live Writer

    1.http://latex.codecogs.com/eqneditor/editor.php 2.使用Word发布

随机推荐

  1. javascript HTML静态页面传值的四种方法

    一:JavaScript静态页面值传递之URL篇能过URL进行传值.把要传递的信息接在URL上.Post.htm 代码如下: <input type="text" name= ...

  2. ionic文本颜色

    需添加"ion-text"使"color='light'"生效 <div text-center ion-text color="light&q ...

  3. JS实现正则表达式

    一.创建正则表达式 一共有两种方式: 1.直接量:var re = /[0-9]*/; 2.通过RegExp对象的构造函数:var re = RegExp("[0-9]*",&qu ...

  4. 如何解析比特币中的交易原始数据rawData

    交易数据结构 有关交易的详细信息可以查看比特币的wiki网站:Transaction TxBinaryMap: 原始图片地址 交易的结构表格(Transaction): 示例数据 以一个正式网络的一笔 ...

  5. 【洛谷4287】[SHOI2011] 双倍回文(Manacher算法经典题)

    点此看题面 大致题意: 求一个字符串中有多少个长度为偶数的回文串,它的一半也是回文串. \(Manacher\)算法 这应该是\(Manacher\)算法一道比较好的入门题,强烈建议在做这题之前先去学 ...

  6. 在RichTextBox控件中显示RTF格式文件

    实现效果: 知识运用:    RichTextBox控件的LoadFile方法 //将文件内容加载到RichTextBox控件中 public void LoadFile(string path,Ri ...

  7. Problem L: 搜索基础之马走日

    Problem L: 搜索基础之马走日 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 134  Solved: 91[Submit][Status][W ...

  8. Java 窗体的基本操作语句 JFrame

    package com.swift; import java.awt.Color; import java.awt.GridLayout; import java.util.Random; impor ...

  9. ES6学习(一):数值的扩展

    chapter06 数值的扩展 6.1 二进制和八进制 二进制 前缀 0b 或者 0B 八进制 前缀 0o 或者 0O 6.2 Number.isFinite() Number.isNaN() 原先这 ...

  10. es6中的promise解读

    目录 什么是promise? promise的优点 回调地狱问题  Promise的三种状态 一个简单的promise promise中的then 利用promise解决回调地狱 promise的链式 ...