Vertical video
Written by Benji Weiser
Updated at December 17th, 2024
Table of Contents
What is vertical video?
With the rise in popularity of video content on mobile devices via platforms, such as Tiktok, Youtube (shorts) and Instagram has come an increase in mobile-first videos, videos made for mobile screen dimensions that are portrait rather than landscape.
Traditionally video content in news apps and Bolt apps has been in a landscape format, but as demand grows we've been looking at ways to support portrait formats in our apps.
|
To start with we added the ability to set the orientation of any video card in your app. This will change the aspect ratio of the video in the timeline to appear portrait, rather than show as portrait pillarboxed into a landscape window. The default will remain landscape.
We now also support vertical video carousels. These allow you to present your vertical videos in a horizontally scrollable format for users to browse. You can have as many carousels as you want in a timeline and as many videos as you want in a carousel.
When a user taps on a video in a carousel it will open full screen, as expected for this format.
Note that we do not currently support being able to vertically swipe to the next video, but if you're interested in that behaviour please let us know! |
 |
Who can use it?
Anyone can use the new orientation setting. There's no restriction on our supported video providers, if the provider you use supports vertical videos then you can display them as such in your app.
Our supported providers are:
- Youtube
- Brightcove
- JWplayer
- Vimeo
- MP4
- M3U8
Note that some providers may behave differently than others. MP4s will always play inline rather than opening straight to full screen.
What is needed to get it live?
To be able to change the orientation of a video you need to be on the latest version of Pugpig Express and Bolt Timeline, both of which automatically update server side, so no app update is necessary. Then all you'd need to do is change one field on any video card you want to display with the portrait orientation.
For orientation
- Go to a video card by going to Content > Video Cards.
- Click “Add video card” or edit one of your choice and change the “orientation” field.
- Publish.
If your video cards are added via a feed, you can add a new field to each item to set the orientation. The field can be called anything you like as long as it contains either of:
- landscape
- portrait
Then let our team know and we can map the new field for you.
For carousels
This will depend on your CMS setup and will need a bit of setup so reach out to your Customer Success manager if you're interested. If you'd like carousels to be automatically populated and update regularly we'll need to enable our Timeline Layouts feature for the timeline containing the carousel.
If you want manual control, or just want to test the appearance, then you need to add a carousel card to a timeline, select the ‘video’ style, and put in whichever videos you like. Note that manual carousels can contain both portrait and landscape video cards, but putting a mix of the two into one carousel will look very poor.