I’m new to Shotcut (been using it for about a week), so apologies in advance if the answer to this question is already out there.
I’m looking for a simple way to implement scrolling text (e.g., credits). I understand from various help videos and forum postings I’ve found that scrolling text can be implemented using HTML5 and the HTML5 filter. But HTML5 seems to be a very complicated way to do it, especially for someone like me who doesn’t code. So I’m wondering whether anyone has posted a simple video, or can explain in simple terms, how to scroll text using either HTML5 or some other (preferably simpler) approach. Many thanks!
If you’re using the latest version of Shotcut the simplest way to create scrolling text is to use the overlay HTML filter and select the simple scroll template.
Select a clip for the text. Then apply the overlay HTML filter. Then select the simple scroll template. You will be prompted to select a folder for the html file. Once you select a folder the html editor will open. You can enter the text, format it then save. The text will scroll for the length of the clip. You can change the scroll direction using the direction parameter.
Thanks! It’s good to know there are two different and entirely independent ways of doing scrolling credits. I’ll give these approaches a whirl. I really appreciate your help.
Forgot to mention that for video track 2 (V2), the one with the subtitles, select Blend mode “ADD”.
I did that as my credits were a single png file with a black background.
If yours is different, don’t be scared to experiment.
I’m working on a webpage to enable Shotcut users to produce reasonably professional-looking scrolling (or not) credits by providing the cast, location, producer etc as simple text, then clicking a few buttons to provide animation to the text (such as can be seen here: Video Title made with Elusien's Textflow feature and Overlay HTML filter) if desired or choose fonts (including some Google fonts) etc.
The webpage will produce an HTML/CSS file that can then be used as an Overlay HTML Filter. Similar to the way my gl-transition framework functions. I hope to have a version for people to try out by the end of this week.
Hello dear Shotcut friends,
Excuse me for my American but I am French and I asked Mr. Google to help me translate.
It’s quite some time that the HTML overlay filter interests me but being null in this language, I try to learn the fundamentals. However, I still have not understood how the new presets of the latest version worked.
If I’m saying Sauron: _ "Select a clip for the text, then apply the overlay HTML filter Then select the simple scrolling template You will be prompted to select a folder for the html file. have selected a folder, the HTML editor will open.You can enter the text, format it and save it "_
As soon as I select simple scrolling, the HTML editor opens and it is only after the programming that we are invited to save. So, that does not work at home. Can you help me ?
Sincerely from French Provence and thank you in advance.
I’ve attached a zip file containing my html file. But note that my original file featured fancy fonts, and if you have not got these installed on your computer, you won’t get the right effect - so I’ve included an amended version using some very common fonts which should be available on most computers.
Feel free to use my html file and change the content to suit your needs, by changing the text at the bottom portion of the code - or just open it up in a text editor for analysis.
Note, for the scrolling movement to work, you must download Elusien’s Webvfx framework file from his website and place it in the same folder as the html file.
Don’t be daunted - it’s a really simple process, and always ask for help on here if you get stuck!
I just realised the zipped html files I attached in the above post have a line of code which gives the scrolling credits a background colour of blue (“dodger blue”, in fact). To make the credits overlay on top of a video or image, change “dodgerblue” to “transparent”.
Sounds like a really great idea, @elusien , look forward to seeing it
This is normal behavior when you are using a project folder. In that case, Shotcut knows where to save the HTML file and names it automatically for you.
thank you for your patience and your speed. I really want to know more about this HTML language that opens the doors of creativity.
Thank you and see you soon.
Just a little taster to whet your appetites of the new project I’m working on. It isn’t quite ready yet, but once it is it should be relatively simple to produce good looking video credits (see the screenshots below).
You first input your raw data as simple text, with for example the cast and the character they played separated by a vertical bar ‘|’, as shown below.
Then you use the configuration panel to specify the type of credits you want. e.g. on a transparent or colored background, scrolling credits or static ones. The size, colour, weight, style and font of the various parts of the credits. Other parameters, such as “neon-glow” text and “text-flow”. Then the type of animation you want for the credits (over and above just scrolling). You can play around to your hearts content until you are happy with the results.
Once you are happy with the results you then press a button and hey presto, a copy of the Overlay HTML Filter appears that you can save and use in Shotcut.
I’m hoping to get the whole thing packaged up in the next week or so. Once I’ve completed it it will go up on the www.elusien.co.uk/shotcut website and I’ll announce it on the forum.
Tried your credit generator tonight. It took a while to get the hang of it. Managed to make a reasonable scrolling and static credit.
The static generator has a slight bug. When I tried to create a transparent background it would not do it. Had to manually enter it in the generated HTML. Otherwise it’s working pretty well.
@elusien, Great, the credits generator is up and running! Was it announced on the forum? If so, apologies, I missed it. Will have a play with it asap. Thanks @sauron for your demo.
The utility is not quite ready to release. I should have known you would be quick off the mark.
There are a couple of issues that I’m working on that should take at most a day or two to fix, then I’ll put the (hopefully) final verison on the website and announce it, (with a tutorial on how to use it and make the most of it) on the forum.
I fixed the static-transparent bug a couple of days ago, but am waiting for the last (minor) issues to be cleared up before going live.
