• Chat s adminkami
• Bleskovky a informace, co na webu nenajdete - sledujte nás na Facebooku!
• Anketa - VIP vs. Pegasus
• Podvodné stránky - nenaleťte!
Howrse
Grafika
Oddechový koutek
V. Nakódování šablony
V dnešním článku si ukážeme, jak nakódovat šablonu z článku č. 2. Předem bych chtěla říct, že můj kód nemusí být „ten nejlepší“ - způsobů, jak šablonu nákodovat, je více. Budu se snažit Vám vše vysvětlit, abyste pochopili princip a byli schopni kódovat i jinak rozložené šablony.
PSPad
Jak jsem psala minule, oblíbila jsem si editor PSPad – screeny jsou tedy z tohoto programu. Vzhledem k tomu, že s ním pracuji již delší dobu, přizpůsobila jsem si ho. Vy máte nejspíše v levém okraji panel nástrojů – já jej nevyužívám, proto jsem ho odstranila (Zobrazit > Panel nástrojů). Abych se lépe orientovala, zapnula jsem si čísla řádků (Zobrazit > Čísla řádků), dále také zalamování řádků (Zobrazit > Zalomení řádků) a pravítko (Zobrazení > Pravítko). Kde se Vám řádky zalomí si můžete nastavit přes Nastavení > Nastavení programu > Editor 2 > Pravý okraj [znaků] – já mám 160. Tyto změny nejsou nutné a je jen na Vás, jak si program přizpůsobíte. Bylo by ale dobré, abyste si zkontrolovali, že ve Formát máte zaškrnuté UTF-8. Zbytek nastavení by měl být stejný.
NÁVOD NAJDETE ZDE
EDIT: Návod "krok za krokem" je stručnější a provede Vás napsáním celého HTML kódu. Pokud by měl někdo nějaké připomínky nebo nápady na vylepšení návodu, prosím ozvěte se do komentářů :).
NÁVOD NAJDETE ZDE
Taktéž jsem pro Vás doplnila návod na zjištění rozměrů ;).
ZJIŠTĚNÍ ROZMĚRŮ
A pro dychtivější z Vás využití vlastností colspan a rowspan a kódování jinak rozložených boxů.
COLSPAN A ROWSPAN
EDIT 2: Jelikož se v komentářích párkrát objevil dotaz, jak se udělají ostré závorky nebo jednoduchá uvozovka, tak tady jsou možnosti:
< pravý Alt Gr + klávesa pro čárku , nebo levý Alt + 060
> pravý Alt Gr + klávesa pro tečku . nebo levý Alt + 062
' Shift + klávesa pro přehlásku ¨ (nad přehláskou je zobrazena taková stříška)
nebo levý Alt + 039
# pravý Alt Gr + klávesa písmene X nebo levý Alt + 035
Přidat komentář
Komentáře
18) Veronika [21. 08. 2012 | 22:11]
Jak děláte,že máte obrázak a u bunky máte třeba květiny vložené.To se dělá ve Photofiltre?
17) Veronika [21. 08. 2012 | 22:09]
Jen ještě,nenašla jsem jak jsou tam ty nadpisy
16) Zaara [21. 08. 2012 | 22:02]
Veronika: Ty šikmé šmouhy? Nvm, v PF ani v PFS neumím, ale určitě jsou tam nějaké filtry nebo rozmazání nebo tak - hledej a zkoušej
15) Veronika [21. 08. 2012 | 21:58]
A jde udělat i to,jak máš ty to modré pozadí a do toho jsi udělala ty čáry??
14) Zaara [21. 08. 2012 | 21:54]
Lenka: Nejspíš máš jinak nastaven Pravý okraj (viz výše nastavení PSPadu), ale je absolutně jedno, na kolik řádků to máš .
Eliška: Bohužel nevím, jak jinak ti pomoct, snažila jsem se to napsat srozumitelně. Někdy je dobré si dát pauzu a nechat nové informace se vstřebat . Prostě netlač na pilu a zkus si to znovu přečíst za pár dní .
aliSSsW: Myslíš tagy a vlastnosti? No ano, to se do češtiny nepřekládá, pokud chceš vědět, co to znamená, tak si to musíš přeložit sama .
anexa1: Jak jsem psala už několikrát během kurzu - dejte tomu taky trochu čas . Mozek musí vstřebat nové informace. Nemusí se Vám to povést hned dnes .
Veronika: Ale však v návodu na PF a PFS je taktéž ukázáno, jak se přidává nápis . I jak se dělají boxy - nadpisky se dělají stejně, jen nejsou průhledné... Trocha improvizace
13) Veronika [21. 08. 2012 | 21:36]
Zaara:No,tam to je,ale jen ve PhotoShopu,já ho němám.Ani nevím kde ho stáhnout
12) anexa1 [21. 08. 2012 | 21:27]
Já to fakt nechápu a čtu to už po několikátý.Nepokusil by se mi s tou prezentací co chci nakódovat pomoc na howrse v soukromých zprávách?
11) imascakova [21. 08. 2012 | 21:04]
Cicinkaochopíš s to když si to přečteš třeba 2x-3x.Nebo když se budeš pozorně koukat na ty znaky atd.
10) aliSSsW [21. 08. 2012 | 21:01]
ahoj ale je to anglicky a ja to mu ne rozumim !!!!!
9) Eliška [21. 08. 2012 | 20:35]
Vůbec tomu nerozumím zkoušela je)sem si přečíst všechny ostatní články a nic asi jsem natvrdlá ale opravdu to ani trochu necháu
8) Lenka [21. 08. 2012 | 19:46]
Ahoj chtěla jsem se tě zeptat v návodu máš toto napsaný:
3)<table style="border-collapse: collapse; color: #1d4a46; text-align: justify; line-height: 135%; font-size: 16px; font-family: ´Georgia´, ´New York CE´, ´
utopia´, serif;><tbody>
4)....
ale když to dělám já tak to mám takhle:
3)<table style="border-collapse: collapse; color: #1d4a46; text-align: justify; line-height: 135%; font-size: 16px; font-family: ´Georgia´, ´New York CE´, ´
4) utopia´, serif;><tbody>
Takže mi to na konci nevýjde abych měla řádků 46 protože tak mám 47
Jak jsto udělala?
Děkuju doufám že pochopíš co tím myslím ahoj
7) Zaara [21. 08. 2012 | 19:00]
*Tuty1*: No, ono se to dá dělat i tak, že si tu danou oblast prostě ořízneš a pak se podíváš, jak je ten oříznutý obrázek velký
Cicinka: Přečti si znovu předchozí článek (IV.) Třeba ti to pomůže
6) Cicinka [21. 08. 2012 | 18:33]
Ahoj, nechápu to. Nevím ani první krok.
5) *Tuty1* [21. 08. 2012 | 18:18]
Aaach ja to robím vo PhotoFiltre čiže neviem aké sú tam tie rozmedzia
zabite maaa.. a hladala som tam niečo také ale okrem mriežky tu nič ié nie je -_-
4) Zaara [21. 08. 2012 | 17:47]
andělka1950: PSPad je zdarma, v předchozím článku je i odkaz na stažení
3) andělka1950 [21. 08. 2012 | 17:35]
lze si ten program stáhnout a nebo ho musím kupovat?
2) Zaara [21. 08. 2012 | 17:24]
Veronika: To je součást graf. podkladu - viz článek II. Výroba grafické šablony prezentace
1) Veronika [21. 08. 2012 | 17:17]
A jak si udělala,že nahoře v té bunce je napsáno třeba informace?
19) Alexis [21. 08. 2012 | 22:39]
No nevím, oběvuje se mi tam jen ten obrázek a nadpisy. Tak to asi nemá být, že?