Olá amados!

O !s2 é o comando que chama a overlay personalizada da Streamando, caso queira divulgar um amigo streamer. Nós sugerimos configurar também um comando de bot, assim aparece a overlay na tela e aparece no chat!

Requisitos
Instalação
Personalização da Overlay
Comando do Chat
Soluções de Problemas
Migrando Configurações
Código Fonte

Requisitos

Ter uma conta na StreamElements, para tal, acesse https://streamelements.com/

A Overlay foi programada para funcionar apenas na StreamElements, mas não se preocupe pois mesmo que você use StreamLabs ou qualquer outro programa ou versão do OBS, ele vai funcionar normalmente contanto que seu programa permita adicionar fontes de navegador.

Instalação

1º Passo: Para instalar sua overlay na sua galeria de overlays da StreamElements, basta clicar em uma das opções abaixo:

!s2 Twitch
!s2 Trovo

2º Passo: Na sua galeria de overlays ainda no site da StreamElements, clique no botão “Editar/Edit” da overlay e então na tela que abrir, no canto superior direito, ao lado esquerdo dos botões “Preview” e “Save”, clique no botão de corrente para copiar a URL da overlay.

3º Passo: Com a URL copiada, no OBS, adicione uma nova Fonte/Source Navegador/Browser. Na opção URL cole a que você copiou seguindo o passo anterior no StreamElements. Na largura você coloca 920 e na altura coloca 920, assim o que aparecer no OBS será exatamente igual ao do site da Streamelements.

4º Passo: Teste a overlay! Para isso, basta digitar no chat do seu canal !s2 @seunome e veja a magia acontecer 💜.

Personalização da Overlay

Você pode, e deve personalizar sua overlay! Para isso na barra lateral a esquerda, clicar sobre a layer !s2 ShoutOut by Nyokeon, então clicar em settings e então várias grupos de personalizações serão exibidas.

Configurações

Aqui você pode testar a overlay, inverter o balão e alterar o idioma.

Permissões

Aqui você configura quem pode usar sua overlay, por padrão apenas você pode utilizar, porém você pode permitir que Moderadores, VIPs e usuários do chat (Common User / Usuário Comum) possam utilizar o comando.

Efeitos Sonoros

Aqui você pode configurar os sons que tocarão na overlay, é possível adicionar até 3 sons em momentos diferentes.

Cores dos Elementos

Aqui você altera as cores de fundo dos elementos em sí da overlay, lembrando que a cor de fundo do balão com o logo da Streamando é o mesmo para a cor do fundo do balão exibindo o usuário.

Cores dos Textos

Aqui você altera as cores dos elementos textuais da overlay

onRaid

Aqui você pode configurar a overlay para executar automaticamente após receber uma Raid.

Comando do Chat

Agora vamos pro comando do chat! É legal colocar pois assim a overlay aparece na tela e o bot faz aparecer no chat.

STREAMELEMENTS

Vá em “comandos do chat” e depois “custom commands”. (Devido a uma limitação do StreamElements, é retornado o usuário correto somente quando a pessoa já falou no canal anteriormente).

Command name: !s2

Response:

/me Conheça o canal de ${channel ${touser}} que estava streAMAndo ${game ${touser}}! 💜 Acesse: https://twitch.tv/${channel ${touser}}
STREAMLABS CLOUDBOT

Vá em “Cloudbot”, “Commands” e “Add Command”.

Command: !s2

Response: 

/me Conheça o canal de {touser.name} que estava streAMAndo {touser.game}! 💜 Acesse: https://twitch.tv/{touser.name}
STREAMLABS CHATBOT

Vá em “Commands”, e clique no + no canto superior direito.

Command: !s2

Response: 

/me Conheça o canal de $touser que estava streAMAndo $game! 💜 Acesse: https://twitch.tv/$touser
NIGHTBOT

Vá em “Commands” e depois “Custom”.

Clique em “+Add Command”, e na janela que abre:

Command: !s2

Message:

/me $(twitch $(touser) "Conheça o canal de {{displayName}} que estava streAMAndo {{game}}! 💜 Acesse: {{url}}")
MIXITUP

Clicar em “New Command”.

Clicar em “Action”, na parte inferior.

Clicar em “Chat Message”.

Clicar em no botão de “+” do lado de “Chat Message”, embaixo.

Clicar na barra onde está escrito “Chat Message”.

Escrever o comando correspondente no “Chat Message”.

/me Conheça o canal de $arg1username que estava streAMAndo $targetuserstreamgame! 💜 Acesse: $targetuserurl

Agora você está prontinho com os comandos da Streamando!

Soluções de Problemas

Minha overlay parou de funcionar ou não exibe as alterações que fiz recentemente

Caso a sua overlay pare de funcionar por algum motivo, tente atualizar o cache. Clique nas propriedades da fonte da overlay, role a página para baixo e clique no “Atualizar o cache da página atual” ou em inglês “Refresh cache of current page”

Migrando as Configurações

Sempre que lançamos uma atualização, a menos que você prefira copiar e colar o código da nova versão para a antiga. Porém existe uma quinta aba chamada “DATA”, que contém todas suas configurações salvas da overlay.

Na aba “Settings” aberta, no menu a esquerda, clique na layer da overlay e em “Open Editor” para abrir um retângulo escuro com as opções “HTML”, “CSS”, “JS”, “FIELDS” e “DATA” .

Copie o conteúdo da aba DATA da versão antiga da sua overlay para a nova e clique em done.

Código Fonte

Bom pessoal, o código fonte da overlay tá todo disponível pra quem quiser estudar, entender como foi feito ou se inteirar de como programar overlay para a StreamElements, está todo comentado (em inglês) para quem quiser fuçar.

PS: o código fonte está no editor de elementos

Bom, é isto 😉!

Qualquer dúvida entre em nosso discord: bit.ly/discords2