How to add a video?

I want to add an MP4 video in a box. I tried to import into Design > Images, but nothing happened, and the default file list was indeed images only.

You can only include youtube videos using the video component or by providing urls to videos hosted on a domain.

You can’t drag in video files like you would images.

HTH

Search the forums. This issue has been discussed to death. The only media objects you can import directly into BSS are images. Because of how Bootstrap Studio saves its project file (your website) it cannot incorporate videos (which can be many megs to many gigs in size.) The same goes for any files other than images... PDFs, Word files, exe files. Anything other than images you have to upload yourself and create the paths in the BSS links.

If you want video on your site, you must either use the Responsive Embed component to link to an externally hosted video on a website like YouTube that allows you to embed videos, or you can use the HTML5 Video component, which will allow you to enter absolute paths to videos which you would typically host on your web server. There are other less direct methods as well (videos in sliders, javascript, etc.) but the two methods above are the most common.

upload to your hosting and embed it. See https://getbootstrap.com/docs/4.5/utilities/embed/

I tried to add a video and got an error message ("No video with supported format and MIME type found.").

The generated HTML for the video was:

<source src="C:\Users\david\Desktop\Bootstrap\downstream.mp4" type="video/mp4">

and downstream.mp4 was a valid file. There seems to be no Help for the HTML5 video component.

====

Success! I had to change the absolute pathname to an Apache address: http://localhost/Tests/BStudio/downstream.mp4, then it worked! I wish there were examples for such stuff. It's sometimes very hard to guess at what BStudio wants.

that's not a BSS issue.

BTW, you can always add a custom code component, so you're free to use whatever HTML piece of code you like. BSS is just a program to speed up website building. Mostly used by pros. To build the website for your own no-profit company maybe you can ask so studio to help you, or use Wix.

There seems to be no Help for the HTML5 video component.

HTML and Bootstrap are not documented inside BSS. You can start learning https://getbootstrap.com/docs/4.1/getting-started/introduction/ and https://www.w3schools.com/html/

I finally got success. See my edited post above.

Also keep in mind that unless that video will not be online, it will not work on the web. You cannot use local directories or paths for online links. What you actually need to do is what was mentioned prior to your success. Upload the video and use an Absolute link to that video, not a local one which won't work once the site is uploaded. That will only work when viewed locally. There is an embed setup already built into Bootstrap I believe (haven't put a video in for a while so ... ) which should give you all the settings needed for it, you shouldn't need to use external setups, but I've done so quite often due to the need for more features on it. Anyways, use absolute links that point to the online location and it will show up in your BSS app as well as the Browser Preview.

What I do, similar to adding photo galleries, is use those Absolute links until I have the site ready to upload and then I change those to Relative links as I know they are working and don't care after that if I see the video in the BSS preview or browser preview. Since you're doing some kind of PHP thing, you'll have to work out what's best for your situation, but you just need to know that local paths cannot be used for online use.

Jo, Thank you very much for your comments. I will look into embed, or just use relative addressing when I am serving the website myself using Apache.

YW, and the local paths are great when you are doing local testing, many do things that way so it's all good. Good Luck!