Webové zákusky

Povolit zoomování stránky v DIVI

13. 8. 2022

Všimli jste si, že weby udělané v DIVI mají standardně zakázané zoomování? V některých případech se to hodí povolit, např. pro weby, kde je spoustu obrázků a návštěvník webu by si je rád zazoomoval. A také na webech, kde vám záleží extra na dodržování pravidel přístupnosti – některé části webu si uživatelé prostě zvětšit chtějí.

Jak to nastavit

Je třeba upravit meta tag „viewport, který nastavuje, jak se zařízení na mobilech bude chovat:

  • user-scalable=no je defaultní nastavení DIVI, které zoomování zakazuje – což je někdy problém,
  • user-scalable=yes zoomování povolí.

Můžete ještě přidat další upřesnění, jak moc velké zoomování uživateli dovolíte:

  • initial-scale=1.0 – počáteční zoom, ideálně nechat na 100%, tj. 1.0,
  • minimum-scale=0.1 – jaké maximální oddálení půjde udělat, 0.1 je 100%,
  • maximum-scale=3.0 – jaké maximální přiblížení dovolíte, 3.0 je 300%.

Stačí vložit kód do child theme a budete mít vystaráno:

/*************** Enable zooming on DIVI site *****************/

//remove previnous 'viewport' meta tag
function db_remove_et_viewport_meta() {
	remove_action('wp_head', 'et_add_viewport_meta');
}
add_action('after_setup_theme', 'db_remove_et_viewport_meta');

//add new one to allow zooming
function db_enable_pinch_zoom() {
	echo '<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0, minimum-scale=0.1, maximum-scale=3.0">';
}
add_action('wp_head', 'db_enable_pinch_zoom');

A nezapomeňte vysypat cache.

Zdroje

Další články

Jak přidat fonty do DIVI

V článku o lokálních fontech v DIVI jsem popisovala, jak je možné přidat do DIVI vlastní font a co dělat, pokud DIVI daný formát fontu nepodporuje (tedy jiný formát než TFF nebo OTF). Někdy je...