为wp博客添加html网页,WP——在博客(wordpress)中嵌入jupyter notebook

安装raw-html插件,通过iframe标签,嵌入jupyter notebook

步骤:

1.在wordpress中安装raw_html插件,并在设置中启用(raw可防止wordpress干扰代码)。

28b464b6a11748d8b7652a69264deb14.png

2.1将jupyter notebook 下载为html格式的文件。

a5232a5f9402d8a5a393b2573337d3d9.png

2.2 上传到服务器中,要求能用域名直接访问。(最好放在wordpress相同区域的文件件夹中)

2c0b36d82480b09118a55fb057858065.png

3.1 在wordpress页面中,插入Html标签,并写入如下代码:

将URL_OF_NOTEBOOK替换为2.2的网址https://www.dotomui.com/***.html

[raw]

function resizeIframe(ifrm) {

ifrm.style.height = ifrm.contentWindow.document.body.scrollHeight + 'px';

// Setting the width here, or setting overflowX to "hidden" as above both

// work for this page. It may be that one turns out to be better.

ifrm.style.width = ifrm.contentWindow.document.body.scrollWidth + 'px';

}

function onLoad() {

var ifrm = document.getElementById('ipython_notebook_frame');

setTimeout(resizeIframe, 0, ifrm);

}

// By deleting and reinstating the iframe src, and by using setTimeout

// rather than resizing directly we convince Safari to render the

// page. See http://www.bitsofbits.com/wp-content/uploads/2015/01/custom.css

var iframe = document.getElementById('ipython_notebook_frame');

iframe.onload = onLoad;

var iSrc = iframe.src;

iframe.src = '';

iframe.src = iSrc;

[/raw]

93b0dad439660e7821d8de6469b58649.png

4.最后效果如下所示:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值