Branding BigBlueButton może oznaczać trzy różne rzeczy: zmianę logo na domyślnej stronie internetowej serwera, wyświetlanie logo w trakcie spotkania lub przeprojektowanie samego klienta spotkań. Wybierz najmniejszą zmianę, która spełni Twój cel. Pierwsze dwie to udokumentowane zmiany konfiguracji lub zasobów; przeprojektowanie schematu kolorów, sformułowań lub układu klienta zazwyczaj wymaga stworzenia spersonalizowanego klienta HTML5.
Niniejszy przewodnik jest zgodny z dokumentacją administracyjną BigBlueButton 4.0, dostępną od 6 października 2026 r. Ścieżki i pakiety wdrożeniowe mogą się różnić w zależności od wersji lub dostawcy hostingu. Przed zmianą plików sprawdź wersję zainstalowaną na serwerze i najpierw wykonaj kopię zapasową.
Wybierz potrzebną Ci zmianę marki
| Bramka | Udokumentowane podejście | Jak sprawdzić |
| Zastąp logo na domyślnej stronie internetowej BigBlueButton | Zastąp logo.pngw domyślnym katalogu zasobów | Otwórz publiczną stronę główną serwera w prywatnym oknie przeglądarki |
| Pokaż logo na spotkaniu | Włącz obszar brandingu w konfiguracji klienta HTML5 i podaj logoadres URL obrazu podczas tworzenia spotkania | Dołącz do nowo utworzonego spotkania testowego i sprawdź obszar nad listą uczestników |
| Zmień kolory, tekst interfejsu lub inny projekt klienta | Zbuduj i wdróż dostosowanego klienta HTML5 ze źródła BigBlueButton | Przetestuj cały przebieg spotkania w obsługiwanych przeglądarkach na komputerach stacjonarnych i urządzeniach mobilnych |
Logo strony docelowej serwera i logo spotkania są oddzielne. Zastąpienie jednego nie powoduje automatycznego zastąpienia drugiego.
Przed edycją serwera
Potrzebujesz dostępu do powłoki z uprawnieniami, aby zmienić serwer BigBlueButton. Powinieneś również wiedzieć, czy host jest utrzymywany przez Ciebie, czy przez usługę zarządzaną. Jeśli serwer jest zarządzany przez dostawcę, zapytaj, czy obsługuje on niestandardowe brandingowanie i czy zachowa zmiany podczas konserwacji.
- Sprawdź zainstalowaną wersję i porównaj ją z odpowiadającym jej przewodnikiem dostosowywania serwera BigBlueButton .
- Zapisz kopię bieżącego logo i każdego pliku konfiguracyjnego, który chcesz edytować.
- Przygotuj czysty plik logo, który będzie rozpoznawalny w rozmiarze wyświetlanym na Twojej stronie lub spotkaniu. Dokumentacja nie określa uniwersalnego rozmiaru w pikselach, dlatego sprawdź rzeczywisty obszar wyświetlania, zamiast polegać na domniemanym wymiarze.
- Użyj adresu URL obrazu, do którego uczestnicy spotkania będą mogli uzyskać dostęp bez konieczności logowania. Preferuj protokół HTTPS i zweryfikuj adres URL poza serwerem przed jego użyciem.
Zmień domyślne logo strony internetowej
W przypadku BigBlueButton 4.0, przewodnik administracyjny identyfikuje domyślne logo pod adresem /var/www/bigbluebutton-default/assets/images/logo.png. Dotyczy to domyślnej witryny obsługiwanej przez serwer. Nie ustawia logo wyświetlanego w kliencie spotkań HTML5.
- Połącz się z serwerem i sprawdź, czy plik znajduje się w udokumentowanej ścieżce. Jeśli ścieżka jest inna, wstrzymaj się i sprawdź dokumentację zainstalowanej wersji, zamiast kopiować plik do podejrzanego katalogu.
- Utwórz kopię zapasową istniejącego zasobu. Na przykład, administrator może skopiować go do pliku kopii zapasowej z datą w tym samym katalogu przed jego wymianą. Podczas instalowania nowego zasobu należy pamiętać o pierwotnych uprawnieniach i prawach własności.
- Umieść nowe logo w udokumentowanej lokalizacji, używając nazwy pliku
logo.png. Sprawdź, czy plik obrazu jest rzeczywiście w formacie PNG i czy ma wystarczający kontrast z tłem strony.
- Otwórz publiczną stronę docelową BigBlueButton w prywatnym oknie przeglądarki lub wyczyść pamięć podręczną przeglądarki. Sprawdź, czy nowy znacznik jest widoczny bez rozciągania, przycinania ani rozmycia.
Oficjalny przewodnik podaje lokalizację zasobu, ale nie gwarantuje, że lokalny zamiennik będzie zachowywany po każdej aktualizacji pakietu. Zachowaj pliki oryginalne i zastępcze w dokumentach wdrożeniowych i sprawdź ponownie stronę docelową po aktualizacjach. Jeśli logo zniknie po aktualizacji, porównaj zainstalowany plik z zapisanym zasobem i ponownie zastosuj zmianę dopiero po sprawdzeniu instrukcji dotyczących bieżącej wersji.
Pokaż logo na spotkaniach
Udokumentowana opcja brandingu dla każdego spotkania w BigBlueButton umieszcza logo w obszarze brandingu nad listą uczestników. Muszą być spełnione dwa warunki: displayBrandingAreaustawienie klienta HTML5 musi być włączone, a spotkanie musi zostać utworzone z logoadresem URL obrazu. Sam parametr logo nie spowoduje wyświetlenia ukrytego obszaru brandingu.
- W konfiguracji klienta HTML5 należy włączyć opcję
displayBrandingArea. W obecnych udokumentowanych instalacjach /etc/bigbluebutton/bbb-html5.ymlzalecany jest lokalny plik nadpisywania; zawarte w nim wpisy konfiguracyjne zastępują odpowiednie spakowane ustawienia klienta. Zachowaj inne istniejące wartości YAML podczas edycji pliku.
- Uruchom ponownie BigBlueButton, aby zmiany konfiguracji zostały wprowadzone:
sudo bbb-conf --restart. Zaplanuj to na odpowiedni czas konserwacji, ponieważ ponowne uruchomienie może przerwać aktywne spotkania.
- Gdy Twoja aplikacja lub klient API utworzy spotkanie, uwzględnij w formularzu parametr niestandardowy
logo=https://your-domain.example/brand.png. Dokładne miejsce wprowadzenia parametru niestandardowego zależy od integracji wysyłającej /createżądanie BigBlueButton. Postępuj zgodnie z instrukcjami dotyczącymi tej integracji i nie ujawniaj współdzielonego klucza tajnego serwera w kodzie po stronie klienta.
- Utwórz nowe spotkanie testowe i dołącz do niego. Sprawdź, czy logo wyświetla się nad listą uczestników i czy obraz wczytuje się dla uczestnika, który nie jest zalogowany do hosta obrazu.
Zapoznaj się z oficjalnymi informacjami o plikach konfiguracyjnych, aby poznać zalecane lokalizacje nadpisywania oraz informacjami o API dotyczącymi spełniania parametrów tworzenia. Skorzystaj z dokumentacji odpowiadającej wersji serwera, jeśli jest ona inna niż 4.0.
Kiedy potrzebujesz pełnego rebrandingu interfejsu
Logo w obszarze brandingu spotkania to nie to samo, co aplikacja konferencyjna typu white-label. Jeśli chcesz zmienić kolory interfejsu, etykiety lub inne wbudowane elementy klienta, sekcja FAQ BigBlueButton instruuje administratorów, jak skonfigurować środowisko programistyczne i stworzyć własną wersję klienta HTML5. Punktem wyjścia są FAQ dotyczące brandingu i przewodnik programistyczny projektu.
Ta ścieżka wymaga prac rozwojowych i wdrożeniowych. Nie jest to szybkie ustawienie serwera, a zmiany mogą wymagać konserwacji w miarę rozwoju BigBlueButton. Przed zainwestowaniem w niestandardową wersję, dokładnie zapisz, które ekrany lub elementy wymagają zmian i sprawdź, czy wbudowane opcje landing page'a lub logo spotkania są wystarczające. Jeśli zdecydujesz się na kontynuację, zachowaj dostosowanie w systemie kontroli wersji, udokumentuj sposób jego przebudowy i przetestuj aktualizacje w środowisku testowym przed aktualizacją produkcyjną.
Sprawdź wynik i rozwiąż problem na podstawie objawów
- Logo strony docelowej nie uległo zmianie: sprawdź, czy plik został zastąpiony w
bigbluebutton-defaultkatalogu zasobów aktywnego serwera, a następnie pomiń buforowanie przeglądarki. Jeśli strona publiczna jest obsługiwana przez serwer proxy lub oddzielny portal, sprawdź, który system jest jej właścicielem.
- Logo spotkania nie jest wyświetlane: sprawdź, czy ustawienie obszaru marki jest włączone, serwer został uruchomiony ponownie, nowe spotkanie zostało utworzone przy użyciu
logoparametru i adres URL obrazu działa w przypadku przeglądarki bez uwierzytelniania.
- Logo pojawia się, ale wygląda nieprawidłowo: sprawdź proporcje, obszary przezroczyste i kontrast obrazu źródłowego. Dostosuj grafikę źródłową zamiast rozciągać ją w interfejsie.
- Niektórzy uczestnicy widzą pusty obszar: sprawdź adres URL obrazu z innej sieci i urządzenia. Zapora sieciowa, ograniczenie dostępu, nieprawidłowy certyfikat TLS lub wygasający adres URL mogą uniemożliwić załadowanie go w przeglądarkach uczestników.
- Kolory i napisy pozostają niezmienione: wymiana logo serwera nie powoduje zmiany wyglądu klienta konferencyjnego. Jeśli te elementy interfejsu wymagają zmiany, skorzystaj z opcji tworzenia klienta niestandardowego.
Oceniaj sukces na podstawie lokalizacji i spójności rezultatu: strona docelowa wyświetla znak zastępczy; nowo utworzone spotkanie testowe wyświetla logo spotkania w udokumentowanym obszarze brandingu; a jeśli stworzyłeś niestandardowego klienta, żądane zmiany interfejsu pozostają widoczne przez cały proces dołączania i spotkania. Małe spotkanie testowe jest bezpieczniejszym punktem walidacji niż sprawdzanie tylko jednej zapisanej w pamięci podręcznej karty przeglądarki.
Opcje brandingu BigBlueButton są celowo ograniczone na poziomie konfiguracji. Wbudowane ścieżki logo zaspokajają typowe potrzeby identyfikacji wizualnej, natomiast pełna przebudowa interfejsu wymaga posiadania własnego klienta i jego bieżącej obsługi.