deneripr
Well-Known Member
Vou descrever aqui como fazer para integrar a bíblia e ou letras apresentadas com o Holyrics no telão diretamente no OBS como uma espécie de "legenda", veja a forma que estamos usando em nossa igreja:
Essa integração é bem simples e é baseada em uso de html, mesmo que não tenha muito conhecimento do tema, você pode personalizar a exibição desse texto/letra em sua live. Primeiro passo a ser feito é dentro no holyrics habilitar o servidor que irá "hospedar" a página web que você irá inserir no OBS:
Na imagem acima vemos o painel principal do Plugin Holyrics, na parte de cima podemos ver o IP que está configurado a nossa máquina e a porta utilizada pelo servidor para o serviço. Vemos também logo abaixo vários endereços que estão disponíveis para a utilização, o primeiro deles é uma transmissão de imagens, que é mais pesada e não é tão interessante pra nossa proposta, então iremos nos focar nos endereços com final "/text" que apenas transmite dados de texto e formatação html, para começar inicie o servidor e copie o endereço como mostrado abaixo:
Esse será a nossa visualização personalizada para a BIBLIA, como temos mais 2 endereços disponíveis vamos configurar 1 para exibir apenas a bíblia e outro para exibir as letras das músicas, podendo formatar a exibição de maneira totalmente diferente em cada uma.
No OBS iremos adicionar uma nova fonte a cena que deseje, e o tipo da fonte é NAVEGADOR:
Após nomear a sua fonte (aqui coloquei BIBLIA) irá se abrir a caixa acima, onde você irá inserir o endereço que copiou lá no holyrics, além disso irá escolher a largura e altura da página, aqui o recomendado é usar a largura da tela que esteja usando na transmissão (primeiro número da resolução utilizada 1920x1080, 1280x720 etc) e a altura você pode experimentar e verificar quanto é o necessário para se encaixar o padrão estético que lhe agrada, eu utilizo como base 200px.
Após isso é só dar OK e o OBS já deve exibir a página com o texto apresentado:
Veja que aqui a posição da página adicionada ficou no topo, ai é só ajustar para baixo. Agora que o servidor e o OBS já estão se comunicando e já está exibindo a sua Bíblia, vamos personalizar a exibição, começando por tirar essa caixa preta e deixando esse funto transparente, pra isso voltamos ao Holyrics e entramos na tela de configurações de exibição (tanto faz entrar pelo módulo bíblia ou Holyrics):
Iremos para a aba HTML 1 (que é o que estamos configurando) e desmarcamos as outras opções deixanto ativa para exibir apenas a Bíblia, e entramos em "configurações HTML" marcando a opção "Plano de fundo - Transparente" como abaixo::
Após isso no OBS já irá exibir o texto básico sem o fundo preto sobre a imagem, caso necessário atualize o cachê da fonte navegador que ele irá recarregar a página. Com o texto já sendo exibido no OBS de forma limpa, você pode personalizar a exibição (cor do texto, fonte, fundo etc) através da edição do código CSS no Plugin do Holyrics:
Na aba abaixo vemos o código CSS que personaliza a página HTML que integramos no OBS, de padrão o CSS não está fazendo nenhuma alteração, então o que está sendo exibido é o HTML puro, você pode escolher um dos temas sugeridos clicando no link "códigos de exemplo" e selecionar uma das personalizações, ai é só copiar o código e substituir o código na caixa abaixo.
Após colar o código clique em "atualizar páginas" e o estilo escolhido deve ser exibido no OBS.
Como referi, você pode criar personalizações diferentes para Bíblia e Letras (é como usamos aqui na igreja) veja como fica uma na fonte bíblia que fizemos juntos e outro na fonte LETRAS que criei e deixei exclusiva para exibir as músicas:
Lembrando que no OBS você ainda pode redimensionar a exibição, mas lembre-se que para alterar a proporção mude o tamanho da fonte (largura x altura) nas propriedades da fonte.
Depois de estar funcionando corretamente como chegamos aqui, para personalizar a exibição da forma que mais agradar é só ir editando o código CSS e ir ajustando, ou copiar algum código de alguém que editou, você achou que encaixa bem com sua live queira implantar. Vou mandar depois aqui o código que usei na nossa igreja, se você tiver uma edição diferente, mande aqui a print de como ficou e compartilhe o código também.
Essa integração é bem simples e é baseada em uso de html, mesmo que não tenha muito conhecimento do tema, você pode personalizar a exibição desse texto/letra em sua live. Primeiro passo a ser feito é dentro no holyrics habilitar o servidor que irá "hospedar" a página web que você irá inserir no OBS:
Na imagem acima vemos o painel principal do Plugin Holyrics, na parte de cima podemos ver o IP que está configurado a nossa máquina e a porta utilizada pelo servidor para o serviço. Vemos também logo abaixo vários endereços que estão disponíveis para a utilização, o primeiro deles é uma transmissão de imagens, que é mais pesada e não é tão interessante pra nossa proposta, então iremos nos focar nos endereços com final "/text" que apenas transmite dados de texto e formatação html, para começar inicie o servidor e copie o endereço como mostrado abaixo:Esse será a nossa visualização personalizada para a BIBLIA, como temos mais 2 endereços disponíveis vamos configurar 1 para exibir apenas a bíblia e outro para exibir as letras das músicas, podendo formatar a exibição de maneira totalmente diferente em cada uma.No OBS iremos adicionar uma nova fonte a cena que deseje, e o tipo da fonte é NAVEGADOR:
Após nomear a sua fonte (aqui coloquei BIBLIA) irá se abrir a caixa acima, onde você irá inserir o endereço que copiou lá no holyrics, além disso irá escolher a largura e altura da página, aqui o recomendado é usar a largura da tela que esteja usando na transmissão (primeiro número da resolução utilizada 1920x1080, 1280x720 etc) e a altura você pode experimentar e verificar quanto é o necessário para se encaixar o padrão estético que lhe agrada, eu utilizo como base 200px.
Após isso é só dar OK e o OBS já deve exibir a página com o texto apresentado:
Veja que aqui a posição da página adicionada ficou no topo, ai é só ajustar para baixo. Agora que o servidor e o OBS já estão se comunicando e já está exibindo a sua Bíblia, vamos personalizar a exibição, começando por tirar essa caixa preta e deixando esse funto transparente, pra isso voltamos ao Holyrics e entramos na tela de configurações de exibição (tanto faz entrar pelo módulo bíblia ou Holyrics):
Iremos para a aba HTML 1 (que é o que estamos configurando) e desmarcamos as outras opções deixanto ativa para exibir apenas a Bíblia, e entramos em "configurações HTML" marcando a opção "Plano de fundo - Transparente" como abaixo::
Após isso no OBS já irá exibir o texto básico sem o fundo preto sobre a imagem, caso necessário atualize o cachê da fonte navegador que ele irá recarregar a página. Com o texto já sendo exibido no OBS de forma limpa, você pode personalizar a exibição (cor do texto, fonte, fundo etc) através da edição do código CSS no Plugin do Holyrics:
Na aba abaixo vemos o código CSS que personaliza a página HTML que integramos no OBS, de padrão o CSS não está fazendo nenhuma alteração, então o que está sendo exibido é o HTML puro, você pode escolher um dos temas sugeridos clicando no link "códigos de exemplo" e selecionar uma das personalizações, ai é só copiar o código e substituir o código na caixa abaixo.
Após colar o código clique em "atualizar páginas" e o estilo escolhido deve ser exibido no OBS.
Como referi, você pode criar personalizações diferentes para Bíblia e Letras (é como usamos aqui na igreja) veja como fica uma na fonte bíblia que fizemos juntos e outro na fonte LETRAS que criei e deixei exclusiva para exibir as músicas:
Lembrando que no OBS você ainda pode redimensionar a exibição, mas lembre-se que para alterar a proporção mude o tamanho da fonte (largura x altura) nas propriedades da fonte.
Depois de estar funcionando corretamente como chegamos aqui, para personalizar a exibição da forma que mais agradar é só ir editando o código CSS e ir ajustando, ou copiar algum código de alguém que editou, você achou que encaixa bem com sua live queira implantar. Vou mandar depois aqui o código que usei na nossa igreja, se você tiver uma edição diferente, mande aqui a print de como ficou e compartilhe o código também.
Attachments
Última edição: