# Adding a video play button option

**URL:** <https://community.hubspot.com/t/adding-a-video-play-button-option/17157>\
**Category:** CMS Development\
**Created:** [November 12, 2019, 10:26am UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157 "2019-11-12T10:26:05Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![andrew19](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/andrew19/32/78108_2.png) [@andrew19](https://community.hubspot.com/u/andrew19)\
**Post date:** [November 12, 2019, 10:26am UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/1 "2019-11-12T10:26:05Z")

</div>

Hi

We have successfully added a video module to our website, which for 99% of the time works without any issues as it auto plays and scales to the device

We have found that if a mobile user has dissabled autoplay on video’s, then there is no option to play the video.

At one level this is not an issue but I would like to see if there is an option to add a play button.

Does anyone have an option to add a video play button?

Thanks

---

<div class="post-metadata">

**Author:** ![sharonlicari](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/sharonlicari/32/101479_2.png) [@sharonlicari](https://community.hubspot.com/u/sharonlicari)\
**Post date:** [November 25, 2019, 12:19pm UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/2 "2019-11-25T12:19:17Z")

</div>

Hey @andrew19

I will tag a few of our experts  
 ![16x16_smiley-happy.png.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/2/22d5e40d253def47f5f4ea7f0e3e70be19010689.png)

Hey @stefen @Kevin-C @Stephanie-OG could you please share your knowledge with @andrew19 ?

Thank you,

Sharon

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [November 25, 2019, 1:09pm UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/3 "2019-11-25T13:09:09Z")

</div>

@andrew19 if you’re using a vanilla HTML5 Video tag then you just need to add the “controls” attribute to it like so:

`<video controls autoplay>`

That’s the simplest solution. Otherwise you would need to use your own button element, CSS to style it/position it, and JS to play/pause the video on click.

---

<div class="post-metadata">

**Author:** ![andrew19](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/andrew19/32/78108_2.png) [@andrew19](https://community.hubspot.com/u/andrew19)\
**Post date:** [December 19, 2019, 4:31pm UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/4 "2019-12-19T16:31:45Z")

</div>

Hi Stefan

Soory for the slow response but have been working on other key sales issues.

Thank you for suggestion

Perfect

Cheers

Andrew

---

<div class="post-metadata">

**Author:** ![JAxtell7](https://avatars.discourse-cdn.com/v4/letter/j/b4bc9f/32.png) [@JAxtell7](https://community.hubspot.com/u/JAxtell7)\
**Post date:** [June 14, 2024, 8:55pm UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/5 "2024-06-14T20:55:00Z")

</div>

Do you know if there’s a way to customize the black gradient behind the controls? I’ve been trying to do that with CSS but can’t seem to change anything.

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [June 15, 2024, 2:34pm UTC](https://community.hubspot.com/t/adding-a-video-play-button-option/17157/6 "2024-06-15T14:34:22Z")

</div>

I’m afraid not. You could create your own video controls and style them however you like and disable the default browser controls. But that would require a bit more work than just a couple CSS styles.