Type live text "caption" on the webcam streaming.

XuthusQelami

New Member
I have been searching in the forum trying to find what I need and not able to locate it.

Hello. I am a deaf user. I want to communicate with the viewers while they watch my webcam. I do not want to use the platform chatbox as their text is often too small. Discord is not great with video group chat without the text chatbox. I am hoping there is a way for me to type the live text on the live webcam as if I am interacting with my viewers on various platforms. Like for example as a hypnotist, I want to interact with my client as if I am chatting with them on the webcam with my text.

Thank you so much.
 
You can use a text file as the text source, and just type into that. It will update on the your video. Your chat will be one-way (just you typing, not the viewers).
 
I think it is better to use the Browser source, local file setting, with the next (or similar) code in the .html file that you saved on your PC:
HTML:
<textarea id="my_text" cols="70" rows="3" spellcheck="false" onkeydown="if ( event.keyCode == 27 ) this.value=''">
(Remove this strings from the .html file if you don't need this info)
Default Text is Here!
To change the text live in OBS:
1) click "Right Mouse" over the source,
2) click "Interact" option.
New window will appear where you can type.
"ESC" key to clear all the strings.
That's all!
</textarea>

<style>
textarea#my_text {
  resize: none;
  border: none;
  outline: none;
  background: transparent;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #FFD5D5;
  font-size: 2.3em;
}
</style>

Edit:
Slightly better variant is under the spoiler below (two fields/above under to show text on Enter rather than on typing):
HTML:
<textarea id="my_text" cols="70" rows="3" spellcheck="false" onkeydown="if (event.keyCode == 27) this.value=''">
(Remove this strings from the .html file if you don't need this info)
Default Text is Here!
To change the text live in OBS:
1) click "Right Mouse" over the source,
2) click "Interact" option.
New window will appear where you can type.
"ESC" key to clear all the strings.
That's all!
</textarea>

<textarea id="my_text2" cols="70" rows="3" spellcheck="false" onkeydown="
if (event.keyCode == 27)
 this.value=''
else if (event.keyCode == 13) {
 if (event.ctrlKey) {
  var position = this.selectionEnd;
  this.value = this.value.substring(0, position) + '\n' + this.value.substring(position);
  this.selectionEnd = position + 1;
  return true;
 }
 event.preventDefault();
 document.getElementById('my_text').value=this.value;
 this.value='';
}
">
-- Type Your Text Here! --
Usage:
"ESC" key to clear all the strings
"Ctrl"+"Enter" to newline
"Enter" to copy this text into the area above and auto-clear this
</textarea>

<style>
 textarea#my_text {
  overflow:hidden;
  resize: none;
  border: none;
  outline: none;
  background: transparent;
  width: 100%;
  height: 50%;
  text-align: center;
  color: #FFD5D5;  
  font-size: 2.3em;
 }
</style>

<style>
 textarea#my_text2 {
  resize: none;
  width: 100%;
  height: 50%;
  text-align: center;  
  font-size: 2.3em;
 }
</style>
The bottom of the source better to cutoff with the OBS Transform (Alt + Mouse of via the Filters).
 
Last edited:
Back
Top