Vytvořte si web maynka.com
Fotíte, vystavujete nebo se chcete pochlubit se svou zálibou? Inspirujte se a podívejte se na web maynka.com, který je plný krásných fotografií. Přinášíme Vám návod na to, jak si tento web vytvořit.
Maynka.jpg
Nejdříve si v sekci „Vzhled“ vybereme šablonu s názvem 161a.
vzhledy_maynka.png

Nastavení levého sloupce

Začneme důležitou částí webu a to je „Menu“. Funguje jako navigace a návštěvníka stránek ihned informuje o tom, co vše se na webu nachází.
1. rozmístění prvků v levém sloupci

V záložce „Obsah“ klikneme na „Levý sloupec“.

016.png
Klikneme na žluté ozubené kolečko a počet buněk levého sloupce nastavíme na hodnotu 1.
040.png
001.png
Nyní přidáme obrázek, který chceme, aby se na stránkách zobrazoval vždy vlevo nahoře.

Klikneme na zelené kolečko a zvolíme „Obrázek“. Jeho šířku nastavíme na hodnotu 1, zarovnáme „Na střed“ a pro „Styl zobrazení“ zvolíme „Původní velikost“.

U „Zvýraznění“ nastavíme „Vlastní“ a napíšeme zde logo (s tímto zvýrazněním budeme dále pracovat).
obrázek.png
002.png
Do kolonky pro odkaz vložíme lomítko „/“, díky kterému nás tento obrázek bude vracet vždy na úvodní stránku webu. Pokud lomítko nevložíme, obrázek se nám po kliknutí myší rozbalí.
Pokud jsme vše správně nastavili, zobrazí se nám následující rozmístění prvků:
017.png
Klikneme na zelené plus pod obrázkem a vložíme „Menu“. Pro „Styl“ zobrazení menu nastavíme „Vertikální - rozbalit po najetí“.

V záložce „Rozšířené“ nastavíme „Šířku“ na hodnotu 1.
031.png
003.png
Nyní bychom měli vidět následující rozložení prvků:
032.png
2. zarovnání prvků v levém sloupci
Nyní si upravíme levý sloupec tak, abychom obrázek zafixovalo na tomto místě tak, jako je to na webu maynka.com.
V záložce „Vzhled“ klikneme na „Editor vzhledu“.
004.png
Klikneme na obrázek tak, aby se nám zobrazilo následující okno:
005.png
Klikneme na group userdesgin logo a nastavíme jeho dolní a horní vnější okraj na 50px a jako vždy uložíme.
006.png
Výborně, levý sloupec máme nastavený.
Levý sloupec.png

Nastavení hlavní stránky

Nyní si nastavíme hlavní stránku, tedy to, co na našem webu uvidí naši návštěvníci jako první.
Abychom si mohli vytvořit obrazovou galerii tak, jak je to na webu maynka.com, musíme si nejprve připravit fotografie s poměrem stran 4:3 (na výšku v poměru 2:3).
Klikneme na „Obsah“ a poté na rubriku „O nás“.
obsah-onás.png
1. vymazání přednastavených prvků
Nejprve si smažeme všechny přednastavené prvky. Vždy klikneme na červený koš a stiskneme „OK“.
smazání_onás.png
2. rozvržení prvků na hlavní stránce
Pomocí žlutého ozubeného kolečka nastavíme počet buněk na hodnotu 1 a zvýrazníme „Vzorem 1“.
032.png
018.png
Klikneme na zelené plus a přidáme „Sloupec“ s šířkou 4 a počet buněk nastavíme na hodnotu 3. U „Zvýraznění“ zvolíme „Vlastní“ a napíšeme zde nocell (s tímto prvkem budeme dále pracovat).
002.png
009.png
019.png
Klikneme na zelené plus a vložíme „Obrázek“.
020.png
obrázek.png
Počet buněk u obrázku nastavíme na 1 a pro „Styl zobrazení“ zvolíme „V plném rozlišení“.
 
021.png
Pomocí zeleného plus přidáme napravo vedle obrázku „Sloupec“. Šířku nastavíme na hodnotu 2 a počet buněk na 2.
002.png
Pokud jsme vše správně nastavili, zobrazí se nám následující rozmístění prvků:
010.png
3. vkládání dalších obrázků
Pokud chceme mít obrázky poskládané tak, jako je tomu na webu maynka.com, klikneme na zelené plus a vložíme „Obrázek“ v poměru 2:3 na šířku.
030.png
Šířku obrázku nastavíme na hodnotu 2 a pro „Styl zobrazení“ zvolíme „V plném rozlišení“.
022.png
Pod tento obrázek vložíme stejným způsobem další dva opět s šířkou 2 a „V plném rozlišení“. Vznikne nám následující galerie obrázků:
011.png
Nyní přidáme pod obrázky „Odstavec textu“ s šířkou 2.

U „Zvýraznění“ zvolíme „Vlastní“ a napíšeme pod něj mytext, aby se nám text zobrazoval tak, jako na webu maynka.com.
024.png
012.png
Vedle textu vložíme další obrázek. klikneme na vyznačené zelené plus a přidáme „Obrázek“.

Šířku nastavíme na opět na hodnotu 1 a pro „Styl zobrazení“ zvolíme opět „V plném rozlišení“.
027.png
033.png
Pod text přidáme „Sloupec“ s šířkou 1 a počtem buněk 1.
034.png
Klikneme na označená zelená plus a vložíme dva obrázky vždy s šířkou 1 a „V plném rozlišení“.
026.png
035.png
Vedle těchto dvou obrázků nám vznikl prostor ještě pro další fotografii. Klikneme na zelené plus a přidáme „Obrázek“ s šířkou 2 a „V plném rozlišení“.
025.png
013.png
Hlavní stránku máme nyní nastavenou. Pod tyto obrázky si můžete vložit další fotografie podle svého.

Nastavení zápatí

Na konec nás čeká nastavení dolní části webu, která se nazývá „Zápatí“. V záložce „Obsah“ klikneme na „Zápatí“.
zápatí.png
Nejprve si smažeme všechny přednastavené prvky. Vždy klikneme na červený koš a stiskneme „OK“.
smazání_zápatí.png
Klikneme na vyznačené žluté ozubené kolečko a počet buněk nastavíme na 3. Pro šířku zvolíme hodnotu 1.
028.png
014.png
Nyní klikneme na zelené plus a přidáme „Obrázek“ s šířkou 3 a „Styl zobrazení“ nastavte na „Původní velikost“.

Zarovnáme ho „Na střed“ a vložíme odkaz, na který chceme, aby obrázek odkazoval. zde například „http://maynka.com/“.
037.png
015.png
029.png
Gratulujeme, nyní máte nastavený vzhled přesně podle stránky maynka.com.
28.01.2016 11:23:52
Tým Webgarden
Name
Email
Comment
Or visit this link or this one