# YouTube Gallery
**URL:** https://community.elfsight.com/c/css-codes/youtube-gallery/181.md
[Latest](https://community.elfsight.com/latest.md) · [Categories](https://community.elfsight.com/categories.md) · [Tags](https://community.elfsight.com/tags.md)
---
## [Display video description on more than 2 lines](https://community.elfsight.com/t/display-video-description-on-more-than-2-lines/25448)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:31pm UTC](https://community.elfsight.com/t/display-video-description-on-more-than-2-lines/25448 "2023-11-13T18:31:45Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: div.yottie-widget-video-info-caption{ height: 90px !important; }
---
## [Place arrows higher](https://community.elfsight.com/t/place-arrows-higher/76447)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 3\
**Last updated:** [May 21, 2025, 9:46am UTC](https://community.elfsight.com/t/place-arrows-higher/76447 "2025-05-21T09:46:10Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: div.yottie-widget-feed-section-arrow { top: 110px !important; margin-top: 0 !important; }
---
## [Increase size of the navigation arrows](https://community.elfsight.com/t/increase-size-of-the-navigation-arrows/76445)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:17am UTC](https://community.elfsight.com/t/increase-size-of-the-navigation-arrows/76445 "2024-10-18T07:17:46Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-feed-section-arrow { scale: 1.5 !important; } .yottie-widget-feed-section-arrow-prev { top: 10px !im…
---
## [Change z-index for the widget's popup](https://community.elfsight.com/t/change-z-index-for-the-widgets-popup/76461)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:39am UTC](https://community.elfsight.com/t/change-z-index-for-the-widgets-popup/76461 "2024-10-18T07:39:07Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-popup { z-index: 99999 !important; }
---
## [RTL mode](https://community.elfsight.com/t/rtl-mode/76460)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:38am UTC](https://community.elfsight.com/t/rtl-mode/76460 "2024-10-18T07:38:06Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-widget-header-info \*, .yottie-widget-feed-section-search \*, .yottie-widget-video \*, .yottie-…
---
## [Change video border radius](https://community.elfsight.com/t/change-video-border-radius/76459)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:36am UTC](https://community.elfsight.com/t/change-video-border-radius/76459 "2024-10-18T07:36:16Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video .yottie-widget-video-preview { border-radius: 20px; overflow: hidden; }
---
## [Change pagination color](https://community.elfsight.com/t/change-pagination-color/76458)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:32am UTC](https://community.elfsight.com/t/change-pagination-color/76458 "2024-10-18T07:32:17Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-feed-section-pagination-bullet { color: #fff; background: rgba(175, 175, 175, 0.5); } .yottie-widget…
---
## [Add border](https://community.elfsight.com/t/add-border/76455)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:25am UTC](https://community.elfsight.com/t/add-border/76455 "2024-10-18T07:25:47Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-widget { border: 2px solid #b50000 !important; }
---
## [Vertical video display (like Shorts)](https://community.elfsight.com/t/vertical-video-display-like-shorts/76450)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:23am UTC](https://community.elfsight.com/t/vertical-video-display-like-shorts/76450 "2024-10-18T07:23:42Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-widget-video, .yottie { margin: 0 auto !important; } .yottie-widget-video, .yottie-widget-v…
---
## [Center the widget](https://community.elfsight.com/t/center-the-widget/76446)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 7:18am UTC](https://community.elfsight.com/t/center-the-widget/76446 "2024-10-18T07:18:52Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-widget { margin: 0 auto; }
---
## [Increase size of Play icon](https://community.elfsight.com/t/increase-size-of-play-icon/76439)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 6:56am UTC](https://community.elfsight.com/t/increase-size-of-play-icon/76439 "2024-10-18T06:56:21Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video-preview-play { width: 100px; }
---
## [Increase pagination icons](https://community.elfsight.com/t/increase-pagination-icons/76438)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [October 18, 2024, 6:54am UTC](https://community.elfsight.com/t/increase-pagination-icons/76438 "2024-10-18T06:54:23Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: span.yottie-widget-feed-section-pagination-bullet{ padding: 10px 14px; font-size: 14px; } span.yottie-widget-feed-s…
---
## [Change font for all elements (YouTube Gallery)](https://community.elfsight.com/t/change-font-for-all-elements-youtube-gallery/25556)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 6\
**Last updated:** [April 18, 2024, 10:17am UTC](https://community.elfsight.com/t/change-font-for-all-elements-youtube-gallery/25556 "2024-04-18T10:17:57Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-widget-inner { font-family: sans-serif !important; } You’re welcome to set any other font…
---
## [Change color of the video borders](https://community.elfsight.com/t/change-color-of-the-video-borders/25442)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:17pm UTC](https://community.elfsight.com/t/change-color-of-the-video-borders/25442 "2023-11-13T18:17:49Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video { border: 5px solid white; padding: 10px; }
---
## [Change size of the video container](https://community.elfsight.com/t/change-size-of-the-video-container/25443)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:19pm UTC](https://community.elfsight.com/t/change-size-of-the-video-container/25443 "2023-11-13T18:19:17Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video, .yottie-widget-video-preview-thumbnail { height: 393px !important; width: 700px !importan…
---
## [Align Search Bar to the center](https://community.elfsight.com/t/align-search-bar-to-the-center/25444)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:20pm UTC](https://community.elfsight.com/t/align-search-bar-to-the-center/25444 "2023-11-13T18:20:13Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-feed-section-search { justify-content: center; }
---
## [Display full video title](https://community.elfsight.com/t/display-full-video-title/25446)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:24pm UTC](https://community.elfsight.com/t/display-full-video-title/25446 "2023-11-13T18:24:43Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video-info-title { white-space: normal !important; }
---
## [Make Search Bar darker](https://community.elfsight.com/t/make-search-bar-darker/25447)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:26pm UTC](https://community.elfsight.com/t/make-search-bar-darker/25447 "2023-11-13T18:26:23Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-feed-section-search-form-input{ color: #000; border: 1px solid #000; }
---
## [Change font size of the video title](https://community.elfsight.com/t/change-font-size-of-the-video-title/25450)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 13, 2023, 6:34pm UTC](https://community.elfsight.com/t/change-font-size-of-the-video-title/25450 "2023-11-13T18:34:16Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video-info-title{ font-size: 18px !important; }
---
## [Make names of the Source Groups larger and bold (for screens wider than 480px)](https://community.elfsight.com/t/make-names-of-the-source-groups-larger-and-bold-for-screens-wider-than-480px/25558)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 14, 2023, 3:40pm UTC](https://community.elfsight.com/t/make-names-of-the-source-groups-larger-and-bold-for-screens-wider-than-480px/25558 "2023-11-14T15:40:06Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: @media screen and (min-width: 480px) { li.yottie-widget-nav-list-item a { padding: 18px 16px 22px; …
---
## [Change video description font size](https://community.elfsight.com/t/change-video-description-font-size/25559)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 14, 2023, 3:47pm UTC](https://community.elfsight.com/t/change-video-description-font-size/25559 "2023-11-14T15:47:06Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video-info-caption{ font-size: 16px !important; height: auto !important; }
---
## [Change font in popup](https://community.elfsight.com/t/change-font-in-popup/25842)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 16, 2023, 12:00pm UTC](https://community.elfsight.com/t/change-font-in-popup/25842 "2023-11-16T12:00:18Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .global-styles, .yottie-popup .yottie-popup-inner { font-family: sans-serif !important; } You’re welcome to set an…
---
## [Change background color of the video description](https://community.elfsight.com/t/change-background-color-of-the-video-description/25560)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 14, 2023, 3:49pm UTC](https://community.elfsight.com/t/change-background-color-of-the-video-description/25560 "2023-11-14T15:49:58Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-video-info { background: red; }
---
## [Change border radius of the widget](https://community.elfsight.com/t/change-border-radius-of-the-widget/25561)
**Author:** [@Max](https://community.elfsight.com/u/Max)\
**Replies:** 0\
**Last updated:** [November 14, 2023, 3:51pm UTC](https://community.elfsight.com/t/change-border-radius-of-the-widget/25561 "2023-11-14T15:51:59Z")
Add this code to the Custom CSS field on the Appearance tab of your YouTube Gallery widget’s settings: .yottie-widget-inner{ border-radius: 10px; }