---
site_name: WPlama
site_description: Internetové stránky na WordPressu snadno a česky
site_url: https://www.wplama.cz
contact_email: tomas@wplama.cz

title: Divi 5: Přizpůsobitelné responzivní breakpointy
url: https://www.wplama.cz/divi-5-prizpusobitelne-responzivni-breakpointy/
date: 2025-06-02
modified: 2025-05-30
author: Tomáš Cirkl
type: post
categories: [Divi šablona a Elegant Themes]
tags: [Divi 5]
---

Divi 5 nově přináší podporu **plně přizpůsobitelných responzivních breakpointů**. K dispozici je sedm předdefinovaných breakpointů, které pokrývají všechny typy zařízení – od mobilů až po velké monitory. Každý z nich si navíc můžete upravit podle vlastních potřeb, a tím získat plnou kontrolu nad vzhledem webu na všech šířkách obrazovky.

Celý systém je rychlý a snadno použitelný. Podívejte se na video níže a zjistěte, jak nová funkce [Divi šablony](https://www.wplama.cz/divi-sablona/) funguje v praxi. 👇

[Introducing Customizable Responsive Breakpoints for Divi 5!](https://www.youtube.com/embed/RfeKQDykPfI?feature=oembed)

Obsah

1. Přizpůsobení breakpointů vašeho webu
2. Nastavení šířek jednotlivých breakpointů
3. Intuitivní úpravy pro responzivní zobrazení
4. Návrh pro libovolné zařízení díky škálování plátna
5. Shrnutí

## Přizpůsobení breakpointů vašeho webu

Ve Visual Builderu můžete mezi jednotlivými breakpointy přepínat pomocí ikon v horní části rozhraní. Kliknutím na ikonu se třemi tečkami otevřete **editor breakpointů**, kde lze libovolné výchozí breakpointy Divi povolit nebo zakázat.

Původní tři breakpointy byly rozšířeny o **čtyři nové**: **Phone Wide**, **Tablet Wide**, **Widescreen** a **Ultra Widescreen**. Tyto nové možnosti pokrývají všechna moderní zařízení, takže můžete přizpůsobit design opravdu pro každý typ obrazovky.

## Nastavení šířek jednotlivých breakpointů

Předdefinované breakpointy by měly pokrýt většinu běžných potřeb, ale pokud chcete cílit na konkrétní zařízení, můžete si jejich šířky přizpůsobit. V **editoru breakpointů** lze pro každý breakpoint nastavit **vlastní šířku** přesně podle vašich požadavků.

## Intuitivní úpravy pro responzivní zobrazení

V Divi 5 **už není potřeba zapínat responzivní úpravy pro jednotlivá nastavení**. Jakákoliv změna provedená v konkrétním breakpointu se automaticky aplikuje jen na daný rozsah šířky.

Stačí přepnout pohled, provést úpravy a optimalizovat design pro vybranou velikost obrazovky. Navíc lze **tažením okraje pracovní plochy** zobrazit náhled webu v libovolné šířce v rámci aktivního breakpointu.

## Návrh pro libovolné zařízení díky škálování plátna

Pokud je šířka aktivního breakpointu větší než šířka vašeho plátna, **návrh se automaticky proporčně zmenší**. Díky tomu je možné navrhovat i pro ultraširoké monitory – třeba i na menším notebooku nebo tabletu.

I při práci na menším zařízení nebo v zúženém okně prohlížeče tak snadno uvidíte, jak bude váš design vypadat na velkých obrazovkách.

## Shrnutí

[Divi 5](https://www.wplama.cz/divi-5) posouvá responzivní design na novou úroveň díky **přizpůsobitelným breakpointům** a intuitivnímu rozhraní pro jejich správu. Nově je k dispozici **sedm předdefinovaných breakpointů**, které lze dle potřeby **zapínat, vypínat a upravovat jejich šířku**, takže je možné cílit na jakékoliv zařízení – od mobilů až po ultraširoké monitory.

Úpravy jsou nyní výrazně jednodušší – není třeba ručně zapínat responzivní režim pro jednotlivé volby. Jakákoli změna provedená v konkrétním breakpointu se automaticky vztahuje pouze na daný rozsah šířky. Navíc lze díky **škálování plátna** pohodlně navrhovat i pro velké obrazovky, i když pracujete na menším zařízení.

Celý systém je rychlý, přehledný a umožňuje přesně optimalizovat vzhled webu pro každou velikost obrazovky.

**Prohlédněte si i další novinky v Divi 5**

- Divi 5: Nový karousel modul – vytvářejte slidery z čehokoliv
- Divi 5: Loop Builder – svoboda při výpisu obsahu
- Divi 5: Flexbox
- Divi 5: Hledat a Nahradit
- Divi 5: Rozšíření atributů
- Divi 5: Pokročilé jednotky (včetně CSS funkcí a proměnných)
- Divi 5: Design založený na presetech
- Divi 5: Proměnné v designu
- Divi 5: Vyhledávání a filtrování nastavení
- Divi 5: Správu atributů
- Divi 5: Skupiny modulů
- Divi 5: Vnořené řádky
- Divi 5 (Public Alpha) k dispozici ke stažení