Resource icon

Free Animated Lower Thirds with Dockable Control Panel v.1.6

WoodcraftByOwen

New Member
I found this thread trying to figure out why my own BrowserSource overlays weren't working - and thought I would take a look at the code in this plugin.

It has the same issue I was having - this plugin uses BroadcastChannels to communicate between an OBS Dock and a BrowserSource on a scene, however OBS27.2 has changed the way it technically implements BrowserSource elements if you select "local file"

Docks are added (as I would expect) using the file:/// scheme - (eg file:///c:/obs/file.html)
In previous versions of OBS, BrowserSource local files were added the same way - nice feature, BroadcastChannel works to communicate between the two windows
In OBS 27.0 - BrowserSources set to Local File add the file using an absolute/ scheme (non-standard afaik) (eg absolute/c:/obs/file.html)

This breaks BroadcastChannels - as they only work using the same scheme and host.

FIX / TLDR:
Change your BrowserSource from a Local Source to a manually entered file:/// uri, changed all windows back slashes in the file path (\) to standard uri forward slashes (/), and replaced any spaces with the uri encoded %20 for good measure.

eg Local Source c:\obs project\file.html becomes standard url file:///c:/obs%20project/file.html
 

DinisRomao

New Member
Having this same issue. I had it working, then the update bricked it. My suggestion is to download an older version of OBS. I just tested 27.1.3 and it works for me!

Hope this helps!
ANyone has the ideia of what might be wrong? How can we help to solve it?
 

havokzzx

New Member
I found this thread trying to figure out why my own BrowserSource overlays weren't working - and thought I would take a look at the code in this plugin.

It has the same issue I was having - this plugin uses BroadcastChannels to communicate between an OBS Dock and a BrowserSource on a scene, however OBS27.2 has changed the way it technically implements BrowserSource elements if you select "local file"

Docks are added (as I would expect) using the file:/// scheme - (eg file:///c:/obs/file.html)
In previous versions of OBS, BrowserSource local files were added the same way - nice feature, BroadcastChannel works to communicate between the two windows
In OBS 27.0 - BrowserSources set to Local File add the file using an absolute/ scheme (non-standard afaik) (eg absolute/c:/obs/file.html)

This breaks BroadcastChannels - as they only work using the same scheme and host.

FIX / TLDR:
Change your BrowserSource from a Local Source to a manually entered file:/// uri, changed all windows back slashes in the file path (\) to standard uri forward slashes (/), and replaced any spaces with the uri encoded %20 for good measure.

eg Local Source c:\obs project\file.html becomes standard url file:///c:/obs%20project/file.html

lowerthirds.png


I can confirm this Method works - Uncheck the Local File Checkbox - open the Browser-Source.html in the Animated-Lower-Thirds Folder Location in your browser and copy the entire URL. and Paste it in the URL location for your Lower Thirds Browser Source in OBS. Click Ok and your Lower Thirds should once again work...

Hope This Help you like it did me :D Thank you WoodCraftbyOwen!
 

simon.sutcliffe

New Member
I found this thread trying to figure out why my own BrowserSource overlays weren't working - and thought I would take a look at the code in this plugin.

It has the same issue I was having - this plugin uses BroadcastChannels to communicate between an OBS Dock and a BrowserSource on a scene, however OBS27.2 has changed the way it technically implements BrowserSource elements if you select "local file"

Docks are added (as I would expect) using the file:/// scheme - (eg file:///c:/obs/file.html)
In previous versions of OBS, BrowserSource local files were added the same way - nice feature, BroadcastChannel works to communicate between the two windows
In OBS 27.0 - BrowserSources set to Local File add the file using an absolute/ scheme (non-standard afaik) (eg absolute/c:/obs/file.html)

This breaks BroadcastChannels - as they only work using the same scheme and host.

FIX / TLDR:
Change your BrowserSource from a Local Source to a manually entered file:/// uri, changed all windows back slashes in the file path (\) to standard uri forward slashes (/), and replaced any spaces with the uri encoded %20 for good measure.

eg Local Source c:\obs project\file.html becomes standard url file:///c:/obs%20project/file.html

Thanks for this I can also confirm it works.
 

boskap

New Member
hi all
I like Lower Thirds Tool but somebody know when a update is released
i think there was the plan to read out textfile for lower thirds
 

FMR101stgi

New Member
Confirmed that this method works as described. Do not hesitate to update your OBS Studio if you are running Automated Lower Thirds, great work team.
 

Imaginewizard

New Member
Hi @NoeAL! Great extension. I just downloaded it but I am finding when I load an image into the logo, I am getting the broken image icon instead of the image. Am I missing something, is there a requirement for the image?
Many thanks!
 

havokzzx

New Member
Hi @NoeAL! Great extension. I just downloaded it but I am finding when I load an image into the logo, I am getting the broken image icon instead of the image. Am I missing something, is there a requirement for the image?
Many thanks!

You have to make sure the Logo Image you created is a *.PNG type file and is stored in the Folder with the Example Logo's in the main obs program folder for example:
C:\Program Files\obs-studio\Animated-Lower-Thirds\logos
 

dwchan69

New Member
I tested this on 2 different laptops with the latest OBS and I can't get the lower third animation to work (nothing happen). Also, my 'Your logo here" icon is no longer displaying on my Lower Third 1 setting. Any though?

1645639815158.png
 

exorsize

New Member
I found this thread trying to figure out why my own BrowserSource overlays weren't working - and thought I would take a look at the code in this plugin.

It has the same issue I was having - this plugin uses BroadcastChannels to communicate between an OBS Dock and a BrowserSource on a scene, however OBS27.2 has changed the way it technically implements BrowserSource elements if you select "local file"

Docks are added (as I would expect) using the file:/// scheme - (eg file:///c:/obs/file.html)
In previous versions of OBS, BrowserSource local files were added the same way - nice feature, BroadcastChannel works to communicate between the two windows
In OBS 27.0 - BrowserSources set to Local File add the file using an absolute/ scheme (non-standard afaik) (eg absolute/c:/obs/file.html)

This breaks BroadcastChannels - as they only work using the same scheme and host.

FIX / TLDR:
Change your BrowserSource from a Local Source to a manually entered file:/// uri, changed all windows back slashes in the file path (\) to standard uri forward slashes (/), and replaced any spaces with the uri encoded %20 for good measure.

eg Local Source c:\obs project\file.html becomes standard url file:///c:/obs%20project/file.html

made account just to say tnx, this was driving me nuts
 

dwchan69

New Member
I found this thread trying to figure out why my own BrowserSource overlays weren't working - and thought I would take a look at the code in this plugin.

It has the same issue I was having - this plugin uses BroadcastChannels to communicate between an OBS Dock and a BrowserSource on a scene, however OBS27.2 has changed the way it technically implements BrowserSource elements if you select "local file"

Docks are added (as I would expect) using the file:/// scheme - (eg file:///c:/obs/file.html)
In previous versions of OBS, BrowserSource local files were added the same way - nice feature, BroadcastChannel works to communicate between the two windows
In OBS 27.0 - BrowserSources set to Local File add the file using an absolute/ scheme (non-standard afaik) (eg absolute/c:/obs/file.html)

This breaks BroadcastChannels - as they only work using the same scheme and host.

FIX / TLDR:
Change your BrowserSource from a Local Source to a manually entered file:/// uri, changed all windows back slashes in the file path (\) to standard uri forward slashes (/), and replaced any spaces with the uri encoded %20 for good measure.

eg Local Source c:\obs project\file.html becomes standard url file:///c:/obs%20project/file.html

Have you experienced a problem with the control panel also? as my "your Logo" icon is no longer presenting on the first setting! I even re-download the zip file with a new install and flush the internet cache and see the same issue. So something is persisting
 

Talonis

Member
This is broken on OBS 27.2.1 (Mac and probably others). Was fine for me on 27.2.

Solution in post #682 does not work.
 
Last edited:

dwchan69

New Member
made account just to say tnx, this was driving me nuts

Just tested this out with no joy

C:\Users\cdominic\Downloads\Animated-Lower-Thirds\lower thirds\browser-source.html"
to

file:///C:/Users/cdominic/Downloads/Animated-Lower-Thirds/lower%20thirds/browser-source.html

I tested the browser source (file) outside of OBS using Edge, will try Chrome next, with no issue. Also my problem control panel issue

1645643812931.png


is working fine outside of OBS (no missing "Your Logo Here" on the first line) So is there a browser cache within OBS?

1645643843581.png
 

dwchan69

New Member
OK Update to all who is running into the issue where the plugin does not work with the latest OBS. the fix posted by "exorsize" I fat finger my update URL earlier ;(. However, I did confirm that %20 is required for all spaces. Also, regarding to my control panel issue or potential problem, not sure where the cache / cookie are kept, but a "reset" from the Main Settings seem to do the trick for me. Thank you again
 
Top