# 如何自定义默认 Onebox 音频控件？

**URL:** <https://meta.discourse.org/t/how-to-customise-the-default-onebox-audio-control/104260>\
**Category:** Support\
**Created:** [2018年十二月14日 11:48 UTC](https://meta.discourse.org/t/how-to-customise-the-default-onebox-audio-control/104260 "2018-12-14T11:48:06Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Viki](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/viki/32/131139_2.png) [@Viki](https://meta.discourse.org/u/Viki)\
**Post date:** [2018年十二月14日 11:48 UTC](https://meta.discourse.org/t/how-to-customise-the-default-onebox-audio-control/104260/1 "2018-12-14T11:48:06Z")

</div>

Hello everyone!

**Default OneBox Style**

[http://media.blubrry.com/codepen\_radio/p/codepen-podcast.s3.amazonaws.com/100.mp3](http://media.blubrry.com/codepen_radio/p/codepen-podcast.s3.amazonaws.com/100.mp3)

I would like to customize the default onebox audio control style with this one 👇

https://codepen.io/tomma5o/embed/preview/jAKQYz?default-tabs=css%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=jAKQYz

I tried to customize it with theme customization option but I failed. Can anyone help me?

---

<div class="post-metadata">

**Author:** ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)\
**Post date:** [2021年十月29日 03:00 UTC](https://meta.discourse.org/t/how-to-customise-the-default-onebox-audio-control/104260/5 "2021-10-29T03:00:59Z")

</div>



---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2021年十月29日 04:44 UTC](https://meta.discourse.org/t/how-to-customise-the-default-onebox-audio-control/104260/6 "2021-10-29T04:44:12Z")

</div>

我不想让这个问题再搁置多年 :)，但实现方法是创建一个组件来装饰已渲染的 HTML。然后在屏幕上渲染之前，通过一个函数将帖子的 HTML 传入，该函数会替换播放器。

这是一种相当高级的自定义方式。