利用HeoMusic和iframe给WordPress添加音乐页面

奥多也网络

前言

HeoMusic是一个基于Aplayer和MetingJS的静态音乐播放器。

教程

1.首先上传程序文件到网站根目录。

2.在WordPress里新建一个页面。

3.经典编辑器选择文本，将以下代码放到里面

1. <iframe src="https://www.xrbk.cn/music.html" width="100%" height="600px" style="border:none;"></iframe>
   
2. <style>
   
3. /* 这里放你的自定义CSS样式 */
   
4. iframe {
   
5.   border-radius: 10px; /* 设置圆角半径为10px，你可以根据需要调整这个值 */
   
6. }
   
7. 
   
8. @media (max-width: 1024px) {
   
9.   iframe {
   
10.     width: 100%;
    
11.     height: 400px;
    
12.   }
    
13. }
    
14. 
    
15. @media (max-width: 600px) {
    
16.   iframe {
    
17.     width: 100%;
    
18.     height: 300px;
    
19.   }
    
20. }
    
21. </style>
    

复制代码

项目地址

Github：https://github.com/zhheo/HeoMusic

张洪Heo：https://blog.zhheo.com/p/45699256.html