Domyślne ustawienia Divi dla WordPress’a nie są doskonałe w każdym calu – niestety. Porównajmy widok wersji desktopowej do wersji mobilnej. W wersji desktopowej logo wygląda bardzo ok, zresztą możemy dostosować jego wygląd w opcjach. Wejdź w menu po lewej stronie w Wygląd > Dostosuj > Nagłówek i nawigacja > Główny pasek menu – i tutaj mamy wiele opcji. Natomiast nie mamy do dyspozycji ustawień dotyczących wyglądu logo w wersji mobilnej. Często logo w wersji mobilnej strony internetowej jest stanowczo za małe, przez co jest nieczytelne. Jak zrobić aby nasze logo było większe? Wystarczy kilka linijek kodu CSS.
Przejdźmy w menu po lewej stronie do Divi > Opcje szablonów graficznych. Na samym dole mamy pole gdzie możemy wpisac customowy kod CSS. Wpiszmy poniższe:
@media only screen and (max-width: 980px) { #logo { height: 90% !important; max-height: 90% !important; width: auto; max-width: 90% !important; } }
Ja dałem tutaj 90% gdyż 100% nie mieściło się w szerokości z menu. Sama/sam musisz zdecydować jaką wartość podasz, żeby Twoje logo wyglądało estetycznie.