# Example of custom layout for recording

**URL:** <https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757>\
**Category:** How to implement?\
**Tags:** v2\
**Created:** [March 2, 2021, 10:25am UTC](https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757 "2021-03-02T10:25:07Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mahesh\_Hadiya](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/mahesh_hadiya/32/1319_2.png) [@Mahesh\_Hadiya](https://openvidu.discourse.group/u/Mahesh_Hadiya)\
**Post date:** [March 2, 2021, 10:25am UTC](https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757/1 "2021-03-02T10:25:07Z")

</div>

Hello team,

I want to set recording layout grid wise like 4\*4 so how can I set it, I have checked doc but I didn’t get proper example there can you please help me to short out this issues ASAP.

Please send me custom layout example in JavaScript.

---

<div class="post-metadata">

**Author:** ![pabloFuente](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/pablofuente/32/2536_2.png) [@pabloFuente](https://openvidu.discourse.group/u/pabloFuente)\
**Post date:** [March 2, 2021, 12:08pm UTC](https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757/2 "2021-03-02T12:08:28Z")

</div>

[https://docs.openvidu.io/en/2.16.0/advanced-features/recording/#sample-custom-layout](https://docs.openvidu.io/en/2.16.0/advanced-features/recording/#sample-custom-layout)

---

<div class="post-metadata">

**Author:** ![Mahesh\_Hadiya](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/mahesh_hadiya/32/1319_2.png) [@Mahesh\_Hadiya](https://openvidu.discourse.group/u/Mahesh_Hadiya)\
**Post date:** [March 2, 2021, 12:11pm UTC](https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757/3 "2021-03-02T12:11:04Z")

</div>

I have use this but return white screen([Screenshot by Lightshot](https://prnt.sc/10b9zme)) only.

---

<div class="post-metadata">

**Author:** ![alvarocda](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/alvarocda/32/2203_2.png) [@alvarocda](https://openvidu.discourse.group/u/alvarocda)\
**Post date:** [April 20, 2023, 8:23pm UTC](https://openvidu.discourse.group/t/example-of-custom-layout-for-recording/2757/4 "2023-04-20T20:23:40Z")

</div>

Hi, i know this is an old question, but i have the same problem, everything is working fine, but when i try to debug my custom layout, i get only a blank page, if i inspect the page, i can see it created some video tags but they are not showing anything.

In my console i get the following message:  
`StreamManager of Stream str_CAM_LRM2_con_GPUammRCDm (Subscriber) did not trigger "streamPlaying" event in 4000 ms`

`SreamManager of Stream str_CAM_U2Ge_con_FRxxtQzW50 (Subscriber) did not trigger "streamPlaying" event in 4000 ms`

My code is an exact copy of the example model that is in the documentation

[https://docs.openvidu.io/en/stable/advanced-features/recording/#sample-custom-layout](https://docs.openvidu.io/en/stable/advanced-features/recording/#sample-custom-layout)