Gå til hovedinnhold

Overlays

Overlays er grafikklag du legger oppå videoinnholdet ditt i OBS. StreamAdmin leverer ferdige overlays som nettleserkilder – du trenger ikke designe noe fra bunnen av, men alt kan tilpasses med egendefinert CSS og HTML.

Legge til overlay i OBS

Uansett hvilken overlay-type du velger, er fremgangsmåten den samme:

  1. Gå til Overlays i StreamAdmin-dashbordet
  2. Velg eller opprett en overlay
  3. Klikk Kopier nettleser-URL
  4. Åpne OBS og legg til en ny kilde: Nettleser
  5. Lim inn URL-en i feltet URL
  6. Sett bredde til 1920 og høyde til 1080 (eller din outputoppløsning)
  7. Huk av Oppdater nettleserkilde når scenen blir aktiv
  8. Klikk OK
Gjennomsiktig bakgrunn

Overlays er designet med gjennomsiktig bakgrunn. For at dette skal fungere korrekt i OBS, la innstillingen Tilpasset CSS i nettleserkilden stå tom, og ikke huk av «Sett bakgrunn som gjennomsiktig» med mindre overlayens CSS krever det.

Overlay-typer

Arrangementsinformasjon

Viser informasjon om pågående arrangement – arrangementsnavn, logo, dato og tilpasset tekst. Ideell som permanent overlay øverst eller nederst på skjermen under LAN-partyer og turneringer.

Konfigurering:

  • Legg inn arrangementsnavn, beskrivelse og logo-URL
  • Velg skrifttype og fargeskjema fra de tilgjengelige temaene
  • Posisjoner: topp, bunn, hjørner

Lower third

En «lower third» er en grafikkremse som typisk viser navn og tittel på en person som snakker. Perfekt for intervjuer, podkaster og nyhetsformat.

Konfigurering:

  • Navn og undertittel (kan oppdateres live fra dashbordet)
  • Inn- og ut-animasjon (gli inn fra venstre, fade, etc.)
  • Varighet (vises i N sekunder og forsvinner automatisk)

Scoreboard

Viser poengstilling for to lag. Kan oppdateres i sanntid direkte fra StreamAdmin-dashbordet uten å endre overlayinnstillingene.

Innstillinger:

  • Lagnavn og lagsfarger
  • Nåværende poengstilling
  • Kampnummer / runde
  • Valg av sportstype-ikon (fotball, esports, generisk)

Nedtelling

En visuell nedtellingskjerm med tid til neste kamp, pause eller start av arrangement.

Innstillinger:

  • Mål-tidspunkt (dato og klokkeslett) eller varighet i minutter
  • Bakgrunnsbilde eller video
  • Tekstmelding under nedtellingen

Sosiale medier

Viser Twitch-følger-varsler, YouTube-abonnentmål og lenker til sosiale profiler.

Tilpassbare elementer:

  • Plattformikoner (Twitch, YouTube, Kick, Twitter/X, Instagram)
  • Følger- eller abonnentmål med fremdriftslinje
  • Siste følger-visning

Chat-overlay

Kombinerer chat fra Twitch og YouTube til én samlet chat-visning som legges over videoen.

Innstillinger:

  • Velg hvilke plattformer som inkluderes
  • Maks antall meldinger som vises
  • Skriftstørrelse og gjennomsiktighet
  • Filtrer ut bot-meldinger og kommandoer (f.eks. meldinger som starter med !)

Egendefinert overlay

Full frihet med egendefinert HTML og CSS. Overlayene kjøres i en Chromium-basert nettleser (samme motor som OBS-nettleserkilder), slik at du kan bruke moderne CSS og JavaScript.

Tilgjengelig informasjon via JavaScript-variabler:

  • Stream-status (live/offline)
  • Gjeldende seertall
  • Siste hendelse (ny følger, abonnent, donasjon)
  • Scoreboard-data

Temaer

StreamAdmin leverer følgende forhåndsbygde temaer:

TemaBeskrivelse
KlassiskMørk bakgrunn, hvit tekst – tidløst og profesjonelt
GamingNeon-aksenter, gaming-estetikk
MinimalistiskRent design, liten visuell profil
NyheterAvis-/TV-inspirert layout
LANOptimalisert for LAN-party og esports-turnering

Hvert tema kan tilpasses med egendefinerte farger, fonter og logo.

Egendefinert CSS

Alle overlays kan tilpasses med egendefinert CSS. Redigeringsvinduet har syntaksfarging og sanntidsforhåndsvisning.

Eksempel – endre bakgrunnsfarge på lower third:

.lower-third-container {
background-color: rgba(18, 121, 255, 0.85);
border-left: 4px solid #00d4ff;
}

.lower-third-name {
font-family: 'Rajdhani', sans-serif;
font-size: 28px;
font-weight: 700;
color: #ffffff;
}

Stream-mål på overlay

Du kan vise fremgang mot et mål (følgere, abonnenter, donasjoner) som en fremdriftslinje i en overlay.

  1. Gå til Mål i StreamAdmin
  2. Opprett et nytt mål med type, startnivå og målnivå
  3. Aktiver overlay-visning og kopier overlaylenken

Fremdriftslinjen oppdateres automatisk i sanntid når nye hendelser kommer inn.