---
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: Jak ve WordPress po načtení stránky zobrazit vyskakovací okno s vlastním obsahem
url: https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/
date: 2016-08-25
modified: 2016-08-24
author: Tomáš Cirkl
type: post
categories: [WordPress návody]
---

![okno navrh](https://www.wplama.cz/wp-content/uploads/2016/08/okno-navrh-1-1024x683.jpg "okno navrh")

# Jak ve WordPress po načtení stránky zobrazit vyskakovací okno s vlastním obsahem

25.8.2016

Někdy je třeba předat návštěvníkovi stránek důležité informace. Lze k tomu použít třeba i automatické vyskakovací okno, které se zobrazí po načtení stránky. V tomto návodu si ukážeme jak to udělat ve WordPress.

Nejprve si nainstalujte plugin [Popping Content Light](https://wordpress.org/plugins/popping-content-light/). Plugin je umístěný ve WordPress.org repozitáři a je možné jej nainstalovat přímo z administrace.

[![Popping Content Light](https://www.wplama.cz/wp-content/uploads/2016/08/popping-content-light.jpg "Popping Content Light")](https://www.wplama.cz/wp-content/uploads/2016/08 / popping-content-light.jpg)Popping Content Light

Po aktivaci pluginu se ve WordPress administraci objeví nová položka Popping Content Light. Klikněte na ni a z jejího podmenu vyberte *Add Overlay*.

Dostanete se na stránku sloužící k tvorbě vyskakovacího okna.

[![Manage Overlay](https://www.wplama.cz/wp-content/uploads/2016/08/manage-overlay.png "Manage Overlay")](https://www.wplama.cz/wp-content/uploads/2016/08 / manage-overlay.png)Manage Overlay

Vytvoření vyskakovacího okna má následující položky:

**Overlay Title** – název vyskakovacího okna, zobrazuje se pouze v administraci.

**Status** – okno můžete mít aktivní (zobrazuje na stránce) nebo neaktivní (nezobrazuje se).

**Overlay Type** – typy zobrazení okna.

[![Typy zobrazení](https://www.wplama.cz/wp-content/uploads/2016/08/typy-zobrazeni.png "Typy zobrazení")](https://www.wplama.cz/wp-content/uploads/2016/08 / typy-zobrazeni.png)Typy zobrazení

**Overlay Options** – vychází z nastavení Overlay Type a je zde možné drobně ovlivnit zobrazení okna.

**Custom Styling Options** – k vyskakovacímu oknu si zde můžete přidat vlastní třídu a tu využít pro vlastní styly.

**OTW Grid Manager Light** – nejdůležitější část pluginu, kde tvoříte zobrazovaný obsah.

## Tvorba zobrazeného obsahu

Tvorba obsahu vyskakovacího okna probíhá v OTW Grid Manager Light. Tvorba obsahu je velmi intuitivní a funguje jako klasický page builder, kde si vytváříte strukturu (pomocí řádek a sloupců) a obsah pomocí předpřipravených modulů.

[![OTW Grid Manager Light](https://www.wplama.cz/wp-content/uploads/2016/08/otw-00000349-1024x600.png "OTW Grid Manager Light")](https://www.wplama.cz/wp-content/uploads/2016/08 / otw-00000349.png)OTW Grid Manager Light

Jak tedy vytvořit obsah.

### 1. Vytvoření řádky

Nejprve klikněte na tlačítko **Add Row** a vytvořte řádek.

[![Add row](https://www.wplama.cz/wp-content/uploads/2016/08/add-row.jpg "Add row")](https://www.wplama.cz/wp-content/uploads/2016/08 / add-row.jpg)Add row

### 2. Výběr sloupců

Poté klikněte na **+ Add column** a vyberte rozložení řádky.

[![Výběr rozložení](https://www.wplama.cz/wp-content/uploads/2016/08/vyber-rozlozeni.jpg "Výběr rozložení")](https://www.wplama.cz/wp-content/uploads/2016/08 / vyber-rozlozeni.jpg)Výběr rozložení

### 3. Vložení modulu

Nakonec klikněte na **+ Add item** a vložte vybraný modul.

[![Vložení modulu](https://www.wplama.cz/wp-content/uploads/2016/08/vlozeni-modulu.jpg "Vložení modulu")](https://www.wplama.cz/wp-content/uploads/2016/08 / vlozeni-modulu.jpg)Vložení modulu

Na výběr máte z těchto modulů:

- Button(Tlačítko)
- Info Box(Informační box)
- Dropcaps
- Quote(Citace)
- Tabs Layout(Tabulka)
- Content toggle(Přepínací obsah)
- Unordered list(Seznam)
- Ordered list(Číselný seznam)
- Divider(Oddělovač)
- HTML Editor

Vždy když si nějaký modul vyberete, zobrazí se jeho okno, kde do něj můžete vložit obsah. Dobré je také to, že napravo ihned vidíte náhled modulu a budete vědět, jak to bude vypadat. Jakmile máte obsah hotový, klikněte na tlačítko **Insert**.

Až dokončíte tvorbu vyskakovacího okna, nezapomeňte vše uložit kliknutím na tlačítko **Save Overlay**.

*Já jsem na ukázku použil modul Info box, kam jsem napsal informace o otevírací době.*

[![Info box](https://www.wplama.cz/wp-content/uploads/2016/08/info-box.jpg "Info box")](https://www.wplama.cz/wp-content/uploads/2016/08 / info-box.jpg)Info box

Na webu pak takového vyskakovací okno vypadá následovně.

[![Vyskakovací okno](https://www.wplama.cz/wp-content/uploads/2016/08/vyskakovaci-okno..jpg "Vyskakovací okno")](https://www.wplama.cz/wp-content/uploads/2016/08 / vyskakovaci-okno..jpg)Vyskakovací okno

### Správa WordPress webu

Nemusíte na to být sami. Pomůžeme vám s pravidelnou údržbou i&nbspnovými vylepšeními.

[Více informací](https://www.wplama.cz/sprava-wordpress-webu/)

### O autorovi

![579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892](https://secure.gravatar.com/avatar/579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892?s=100&d=monsterid&r=g "579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892")

[#### Tomáš Cirkl](https://www.wplama.cz/author/tomas/)

Baví mě Internet a zvláště pak redakční systém WordPress. Jsem pravidelným účastníkem a přednášejícím na Word Camp Praha a WordPress konferencích.

## Mohlo by vás také zajímat

[![Výběr doménového jména](https://www.wplama.cz/wp-content/uploads/2014/05/Chossing-a-Domain-Name-1024x632.jpg "Výběr doménového jména")](https://www.wplama.cz/tipy-a-nastroje-pomoci-kterych-vyberete-tu-nejlepsi-domenu-pro-vas-blog/)

### [Tipy a nástroje pro výběr vhodné domény webu/blogu](https://www.wplama.cz/tipy-a-nastroje-pomoci-kterych-vyberete-tu-nejlepsi-domenu-pro-vas-blog/)

[WordPress návody](https://www.wplama.cz/wordpress/navody/)[![Hosting](https://www.wplama.cz/wp-content/uploads/2014/05/Hosting-1024x768.jpg "Hosting")](https://www.wplama.cz/jak-vybrat-spravny-hosting-pro-wordpress/)

### [Jak vybrat správný hosting pro WordPress](https://www.wplama.cz/jak-vybrat-spravny-hosting-pro-wordpress/)

[WordPress návody](https://www.wplama.cz/wordpress/navody/)[![Tipy kde vybrat kvalitní WordPress šablonu](https://www.wplama.cz/wp-content/uploads/2014/05/WordPress-Premium-Themes-Themes4all.com_-1024x506.png "Tipy kde vybrat kvalitní WordPress šablonu")](https://www.wplama.cz/tipy-kde-vybrat-kvalitni-wordpress-sablonu/)

### [Tipy kde vybrat kvalitní WordPress šablonu](https://www.wplama.cz/tipy-kde-vybrat-kvalitni-wordpress-sablonu/)

[WordPress návody](https://www.wplama.cz/wordpress/navody/)

### 7 názorů na “Jak ve WordPress po načtení stránky zobrazit vyskakovací okno s vlastním obsahem”

![8f5f1499f68ab996df1bf70980725b3632acdce7720b6c282b60bd3aa14a4108](https://secure.gravatar.com/avatar/8f5f1499f68ab996df1bf70980725b3632acdce7720b6c282b60bd3aa14a4108?s=50&d=monsterid&r=g "8f5f1499f68ab996df1bf70980725b3632acdce7720b6c282b60bd3aa14a4108")

**Václav**

[25.8.2016 v 8:30](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-44489)

Zrovna včera jsem narazil na zmínku, že Google se chystá weby s obtěžujícími pop-upy penalizovat. Nevím podrobnosti, tak nechci zbytečně plašit. Ale doporučil bych to téma sledovat.

[Odepsat](https://www.wplama.cz/#comment-44489)

![579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892](https://secure.gravatar.com/avatar/579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892?s=50&d=monsterid&r=g "579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892")

**Tomáš Cirkl**

[25.8.2016 v 8:31](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-44490)

Díky za upozornění, odkaz bys na ten zdroj nenašel?

[Odepsat](https://www.wplama.cz/#comment-44490)

---

![cc162520ce48b41ad7bac78143d515f5f8a1cc1255e76c481f6ddb8b61b5d588](https://secure.gravatar.com/avatar/cc162520ce48b41ad7bac78143d515f5f8a1cc1255e76c481f6ddb8b61b5d588?s=50&d=monsterid&r=g "cc162520ce48b41ad7bac78143d515f5f8a1cc1255e76c481f6ddb8b61b5d588")

**Petr**

[25.8.2016 v 17:53](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-44500)

To je jedině dobře. Už mě ty neustálá otravující, vyskakující okna štvou. Člověk je zavře a jsou tu na další stránce zase.

Pokud něco chci vědět, tak si to na daném webu dokážu dohledat. Nepotřebuji na to vyskakující okno, které se často na mobilu ani korektně nezobrazí a pak je tedy web na mobilu nepoužitelný, jelikož jej nemohu ani zavřít.

[Odepsat](https://www.wplama.cz/#comment-44500)

---

---

![c6394ded5c03d6f7ff5a43d6987dfe76d0aaba625bc196b6ed58249b8f19ee8b](https://secure.gravatar.com/avatar/c6394ded5c03d6f7ff5a43d6987dfe76d0aaba625bc196b6ed58249b8f19ee8b?s=50&d=monsterid&r=g "c6394ded5c03d6f7ff5a43d6987dfe76d0aaba625bc196b6ed58249b8f19ee8b")

**Pavel**

[25.8.2016 v 18:40](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-44501)

Jaký plugin prosím používate jako vyskakovací okno k přihlášení k odběru novinek z tohoto webu? Děkuji

[Odepsat](https://www.wplama.cz/#comment-44501)

![579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892](https://secure.gravatar.com/avatar/579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892?s=50&d=monsterid&r=g "579c70f93c868ab0086f8d13a2143605f2e29b7a7ba30c5e7a4d1163a5b37892")

**Tomáš Cirkl**

[25.8.2016 v 19:47](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-44506)

Jedná se o [Monarch](https://www.wplama.cz/monarch).

[Odepsat](https://www.wplama.cz/#comment-44506)

---

---

![b4ff44ff6a1423d08b9821cdc5b72a0494752873ad70843aed730d5ff9178841](https://secure.gravatar.com/avatar/b4ff44ff6a1423d08b9821cdc5b72a0494752873ad70843aed730d5ff9178841?s=50&d=monsterid&r=g "b4ff44ff6a1423d08b9821cdc5b72a0494752873ad70843aed730d5ff9178841")

**Pavol**

[12.9.2017 v 21:24](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-57288)

Zdravim Tomas,

impelemntoval som popisane vyskakovacie okno a vobec to nefunguje.

veryia wp je 4.8.1

[Odepsat](https://www.wplama.cz/#comment-57288)

---

![f0ce971de790e27b5ef25cd205df119abc57e5fb9495d3efb6e9db7939e12aaa](https://secure.gravatar.com/avatar/f0ce971de790e27b5ef25cd205df119abc57e5fb9495d3efb6e9db7939e12aaa?s=50&d=monsterid&r=g "f0ce971de790e27b5ef25cd205df119abc57e5fb9495d3efb6e9db7939e12aaa")

**MP**

[7.3.2023 v 18:05](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/#comment-302819)

Výborné informácie, vďaka. Škoda, len že free plugin nezvláda ani farby, hoci ich má v ponuke.

[Odepsat](https://www.wplama.cz/#comment-302819)

---

### Diskuze [Zruš odpověď](https://www.wplama.cz/jak-zobrazit-vyskakovaci-okno-s-textem-po-nacteni-stranky/?_tmcb=1772964204#respond)