Opera Software
  1. Lišty
  2. Menu
  3. Panely
  4. Rychlý přístup
  5. Záložky
  6. Pomůcky
  7. Poznámky
  8. Synchronizační služba Opera Link
  9. Blokování obsahu
  10. Ochrana proti podvodným webům
  11. BitTorrent
  12. Zobrazovací módy
  13. Vývojářské nástroje
  14. Nastavení
  15. Pokročilé volby
  16. Skiny
  17. Nápověda Opery: Práce s klávesnicí
  18. Práce s myší
  19. Hlasový modul
  20. Pošta a diskuze
  21. Novinky
  22. Chat
  23. Dialogy
  24. Zálohování souborů Opery

Vývojářské nástroje

Mezi snímky prezentace se přepínejte klávesami Page Down a Page Up

Opera obsahuje některé nástroje, které Vám pomohou při tvorbě webových stránek. Nejdůležitější z nich je Opera Dragonfly, nástroj umožňující vzdálené ladění webových stránek.

Vývojářská konzole (v orig. Developer console) je nástroj pro analýzu a interaktivní provádění změn webové stránky během jejího vytváření nebo ladění, zatímco prohlížeč zdrojového kódu je jednodušší nástroj pro kontrolu zdrojového kódu webové stránky, který ve zdrojovém kódu umožňuje provádět rychlé úpravy.

Opera Dragonfly

Poznámka: Chcete-li používat Opera Dragonfly, musíte povolit JavaScript.

Opera Dragonfly je aplikace napsaná v JavaScriptu, která je určena k ladění webových stránek z místních i vzdálených umístění. Chcete-li ji otevřít, vyberte z menu položku Nástroje > Pokročilé > Vývojářské nástroje. Uživatelské rozhraní tvoří tři listy:

Opera Dragonfly je stále ve vývoji. Další informace naleznete v následujících článcích:

Vývojářská konzole

Podobně jako další javascriptové aplikace z Dev.Opera, lze i vývojářskou konzoli přetažením umístit na libovolnou lištu Opery. Pokud vývojářskou konzoli otevřete, objeví se malé okénko nad analyzovanou webovou stránkou. Toto okénko obsahuje pět listů: DOM (objektový model dokumentu), JS (JavaScript), CSS (styly), HTTP (protokol pro přenos hypertextů) a About (informace o aplikaci).

Poznámka: Chcete-li používat javascriptové aplikace z Dev.Opera, musíte povolit otevírání vyskakovacích oken.

Okno vývojářské konzole se nejprve otevře na listu DOM, kde naleznete seznam uzlů dokumentu sbalených pod "document". Klepnutím na znaménko plus tento seznam rozbalíte. Klepnete-li v konzoli na určitý uzel, na zobrazené webové stránce bude jemu odpovídající oblast krátce po klepnutí zvýrazněna probliknutím.

A naopak, klepnutí kdekoli na webové stránce otevře seznam uzlů DOM se zvýrazněným uzlem, který odpovídá oblasti webové stránky, na niž jste klepnuli. Chcete-li najít odpovídající oblast, stiskněte a držte klávesu Shift zatímco prohledáváte stránku myší.

Mezi klíčové funkce listu DOM patří:

Vývojářskou konzoli lze použít také pro provádění interaktivních změn webové stránky. Tlačítko "remove" na listu DOM umožňuje odstranění uzlů, lze však upravit i libovolnou vlastnost stylu pomocí listu CSS po stisknutí tlačítka "show rules" pro daný styl. Výsledek provedených změn je zobrazen okamžitě a lze jej vyexportovat pro pozdější použití.

Podrobnější diskuze k vývojářské konzoli můžete najít na Dev.Opera.

Prohlížeč zdrojového kódu

Opera obsahuje i jednodušší nástroj pro analýzu a úpravy webových stránek, prohlížeč zdrojového kódu. Potřebujete-li nahlédnout do zdroje webové stránky, zobrazíte jej použitím klávesové zkratky Ctrl+F3 nebo výběrem Zobrazit > Zobrazit zdrojový kód či volby Zobrazit z kontextového menu vyvolaného klepnutím pravým tlačítkem myši.

Prohlížeč zdrojového kódu otevře zdroj webové stránky jako nový list a barevným zvýrazněním syntaxe Vám usnadní orientaci ve zdrojovém kódu. Chcete-li zdroj stránky upravit, máte dvě možnosti:

  1. Uložit editovanou webovou stránku do cache a bezprostředně zobrazit Vámi provedené změny klepnutím na tlačítko "Použít změny" nebo použitím klávesové zkratky Ctrl+R.
  2. Uložit editovanou webovou stránku do umístění dle Vašeho výběru tlačítkem "Uložit" nebo klávesovou zkratkou Ctrl+S.

Berte na vědomí, že editací lokálně uloženého dokumentu a volbou "Použít změny" do dokumentu trvale uložíte provedené změny.

Chcete-li k prohlížení a editaci zdrojového kódu používat externí program, lze jej vybrat v Nastavení na kartě Pokročilé volby v kategorii Programy.