Vytváření jednoduchých motivů

Princip

Je možné vytvořit motivy pro všechny mapy úložiště nebo pro jednu mapu v rámci úložiště.

Princip je následující:

• adresář media obsahuje adresář s názvem themes

• adresář themes obsahuje adresář default pro téma všech map úložiště.

• adresář themes může obsahovat pouze jeden adresář pro každý projekt, a to pro témata specifická pro každý projekt.

-- media
  |-- themes
    |-- default
    |-- map_project_file_name1
    |-- map_project_file_name2
    |-- etc

Předpoklady

• Tuto funkci musí aktivovat správce instance Lizmap.

• Adresář media. Přečtěte si, jak používat adresář Media v Lizmap.

Konfigurace nástroje

Varování

Webový prohlížeč má určitý mechanismus ukládání do mezipaměti. Nezapomeňte obnovit a vynutit mezipaměť pomocí Ctrl+F5.

Pro zjednodušení tvorby motivu pro úložiště nebo mapu umožňuje Lizmap získat výchozí motiv z aplikace prostřednictvím požadavku: index.php/view/media/getDefaultTheme.

Požadavek vrátí soubor zip obsahující výchozí téma s následující strukturou:

-- lizmapWebClient_default_theme.zip
  |-- default
    |-- css
      |-- main.css
      |-- map.css
      |-- media.css
      |-- img
        |-- loading.gif
        |-- etc
      |-- images
        |-- sprite_20.png
        |-- etc

Po stažení souboru zip můžete:

• nahradit obrázky

• upravit soubory CSS

Varování

Soubory a adresáře musí být čitelné (755:644)

Tip

Chcete-li si prohlédnout výsledky bez nasazení do produkce, můžete přidat své téma do lizmap/www/themes. Na konec adresy URL přidejte &theme=yourtheme (např. https://your.lizmap.instance/index.php/view/map/?repository=montpellier&project=montpellier&theme=yourtheme).

Jakmile je motiv hotový, můžete jej publikovat a zkopírovat do adresáře media.

Příklad

Chceme změnit logo a barvu pozadí navigačního panelu (např. modrou) pouze v konkrétním projektu s názvem roads a chceme zachovat výchozí motiv z instance Lizmap:

• Složku media/themes/default nepotřebujeme.

• Vytvořte media/themes/roads.

• Rozbalte adresář css/ z vnitřního souboru zip.

• Změna souboru css/img/logo.png

To by mohlo fungovat. Ale stále máte spoustu CSS, které je stejné z hlavní instance Lizmap. Můžeme tedy náš styl zmenšit:

• Odstraňte všechny obrázky, které jsou stejné jako instance Lizmap

• Hledejte ve složce css, kde se používá logo.png.

• Odstraňte všechny soubory *.css kromě css/main.css a css/map.css a ponechte pouze tyto:

#logo {
  background : url(img/logo.png) no-repeat;
  background-size:contain;
}

pro css/main.css a:

#navbar button.btn {
  background-color : blue;
}

pro css/map.css

Díky těmto krokům udržujeme naše vlastní téma co nejmenší.

Další CSS

V Panel správy serveru -> Téma je možné přidat některé CSS bez vytváření souborů jako v předchozím kroku. Například rychlý tip na odstranění názvu Projekty z hlavičky na vstupní stránce :

#title h1 {
    text-indent: -9999px;
    display: block;
}

#title h1::before{
   content: 'Your new title';
    position: absolute;
    left: 9999px;
}