Právě je 16 črc 2019 04:16

Všechny časy jsou v UTC + 1 hodina [ Letní čas ]




Odeslat nové téma Odpovědět na téma  [ Příspěvků: 6 ] 
Autor Zpráva
 Předmět příspěvku: WordPress - Jak provést změny v šabloně
PříspěvekNapsal: 29 črc 2011 22:41 

Registrován:
22 črc 2011 21:50
Příspěvky:
11
Dobrý večer,
pracuji se šablonou "Twenty Ten 1.1", celkem mi vyhovuje rozložením, ale potřebovala bych změnit písmo, nějak nemůžu zkousnout kombinaci serifových a sans-serifových fontů. Mohli byste mi poradit, jak změnit písmo na pouze SANS-serifové, stejné, jako je v MENU? Pokud je to možné, šlo by měnit i řezy a velikosti písma?

Dále bych se chtěla zeptat, jestli se dá měnit výška záhlaví, chtěla bych ho trochu zúžit - fotku i bílou plochu nad ní.
Jsem ve tvorbě webů úplný laik, moc Vás prosím o velmi jednoduché řešení, pokud je možné.
Zde je web, na kterém pracuji: http://www.zdenekholy.cz

s pozdravem
Kateřina Holá


Nahoru
 Profil  
 
 Předmět příspěvku: Re: WordPress - jak provést změny v šabloně
PříspěvekNapsal: 30 črc 2011 15:42 

Registrován:
20 črc 2011 12:16
Příspěvky:
31
Dobrý den,
řez písma, velikost apod. se zobrazuje (a tedy i mění) na základě disrektiv kaskádových stylů. Ty jsou u wordpressovských šablon uloženy v souboru style.css. Máte dvě možnosti, jak jej upravit: Buď si jej stáhnete na lokální disk pomocí FTP klienta ze složky /wp-content/themes/twentyten/ a upravíte v textovém editoru (Notepadu, nebo PSPadu), nebo jej budete upravovat online přímo z administračního rozhraní Wordpressu v kategorii Vzhled -> Editor a z rozbalovacího seznamu "Vyberte šablonu, kterou chcete upravit:" vyberete Twenty Ten a kliknete na tlačítko Vybrat a z výpisu souborů pod tímto seznamem vyberete "Kaskádové styly (CSS)" (Úplně dole).

Definice písma je určena direktivou font-family, tedy třeba:
Kód:
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;

Písmo v menu je definováno pomocí řádku:
Kód:
font-family: "Helvetica Neue", "Arial", "Helvetica", "Nimbus Sans L", sans-serif;

Písmo v článcích pomocí řádku:
Kód:
font-family: "Georgia", "Bitstream Charter", serif;

Písmo v nadpisech článků:
Kód:
font-family: "Helvetica Neue", "Arial", "Helvetica", "Nimbus Sans L", sans-serif;

Písmo v šedém informačním textu pomocí:
Kód:
font-family: "Helvetica Neue", "Arial", "Helvetica", "Nimbus Sans L", sans-serif;

Atd. Respetive použité písmo v menu je definováno pomocí direktivy:
Kód:
h3#comments-title,
h3#reply-title,
#access .menu,
#access div.menu ul,
#cancel-comment-reply-link,
.form-allowed-tags,
#site-info,
#site-title,
#wp-calendar,
.comment-meta,
.comment-body tr th,
.comment-body thead th,
.entry-content label,
.entry-content tr th,
.entry-content thead th,
.entry-meta,
.entry-title,
.entry-utility,
#respond label,
.navigation,
.page-title,
.pingback p,
.reply,
.widget-title,
.wp-caption-text {
   font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
}

A písmo v textu:
Kód:
body,
input,
textarea,
.page-title span,
.pingback a.url {
   font-family: Georgia, "Bitstream Charter", serif;
}

Vše v oddělení nadepsaném v soubory style.css jako:
Kód:
/* =Fonts
-------------------------------------------------------------- */

Tam si můžete poměnit všechny fonty tak, aby žádný nebyl serifový.

Co se týče velikosti písma, to je řešeno příkazem font-size:
Kód:
font-size: 12px;

Řez písma pomocí font-style:
Kód:
font-style: italic;

Třeba pro písmo v článku je jeho velikost definována pomocí direktivy:
Kód:
#content,
#content input,
#content textarea {
   color: #333;
   font-size: 16px;
   line-height: 24px;
}

Pro písmo v nadpisech:
Kód:
#content .entry-title {
   color: #000;
   font-size: 21px;
   font-weight: bold;
   line-height: 1.3em;
   margin-bottom: 0;
}

Doporučuji si nejprve trochu něco nastudovat o kaskádových stylech, není to vůbec složité. Zkuste třeba stránku http://www.jakpsatweb.cz/css/

Co se týče výšky záhlaví, budete muset změnit velikost obrázku. Stejným způsobem jako soubor style.css si otevřete soubor functions.php a najděte kód:
Kód:
   // The height and width of your custom header. You can hook into the theme's own filters to change these values.
   // Add a filter to twentyten_header_image_width and twentyten_header_image_height to change these values.
   define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyten_header_image_width', 940 ) );
   define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyten_header_image_height', 198 ) );

A změňte šíslo '198' za požadovanou výšku. Například '50' pro výšku obrázku 50 pixelů. Tímto změníte požadovanou velikost obrázku v šabloně.

Bílou plochu nad obrázkem změníte v souboru style.css v direktivě:
Kód:
#header {
   padding: 30px 0 0 0;
}

Změnou čísla 30 za požadovanou hodnotu.

Pomohl vám návod?

_________________
Jakub Fišer
Webhosting C4
http://www.c4.cz/


Nahoru
 Profil  
 
 Předmět příspěvku: Re: WordPress - jak provést změny v šabloně
PříspěvekNapsal: 31 črc 2011 18:28 

Registrován:
22 črc 2011 21:50
Příspěvky:
11
Dobrý den,
moc Vám děkuji za odpověď. Bohužel mi to zatím moc nejde. Změnila jsem šablonu na Twenty Eleven 1.2, protože na ní mi vadila pouze výška záhlaví, kterou, jak jste mi napsal, lze změnit. Podařilo se mi zúžit fotku, ale nemůžu nikde najít tu část kódu, kde se mění výška bílé plochy nad ní. Poradíte mi znovu?
Fonty budu měnit následně.
děkuji

PS: o kaskádových stylech si určitě přečtu, jak jste mi psal.


Nahoru
 Profil  
 
 Předmět příspěvku: Re: WordPress - jak provést změny v šabloně
PříspěvekNapsal: 01 srp 2011 08:20 

Registrován:
22 črc 2011 21:50
Příspěvky:
11
Teď ráno jsem si otevřela web a písmo bylo změněno, i výška toho záhlaví. Včera večer jsem to upravovala a myslela si, že to dělám nějak blbě, že to nefunguje, jen se nezobrazovaly změny. Takže asi dobrý. bohužel, jak se žádné změny nezobrazovaly, tak jsem poměnila kde co....
katka


Nahoru
 Profil  
 
 Předmět příspěvku: Re: WordPress - jak provést změny v šabloně
PříspěvekNapsal: 01 srp 2011 09:21 

Registrován:
22 črc 2011 21:50
Příspěvky:
11
Mohl byste mi přece jenom ještě jednou ukázat, kde změním tu bílou plochu nad fotkou? Nemůžu to najít... Měla by mít 60px. děkuji. k


Nahoru
 Profil  
 
 Předmět příspěvku: Re: WordPress - Jak provést změny v šabloně
PříspěvekNapsal: 01 srp 2011 15:12 

Registrován:
20 črc 2011 12:16
Příspěvky:
31
Dobrý den,
je možné, že obsah stránek byl uložen v cache prohlížeče, takže jste okamžitě neviděla výsledek změny. A až teprve po nějaké době - jako druhý den ráno - se změna projevila.

V současnosti máte bílou plochu nad textem určenou pomocí pdding-top v direktivě:
Kód:
#site-title {
   margin-right: 270px;
   padding: 50px 0 0;

Když ho změníte na:
Kód:
#site-title {
   margin-right: 270px;
   padding: 60px 0 0 0;
        }

Budete mít odsazení velikosti 60px.

_________________
Jakub Fišer
Webhosting C4
http://www.c4.cz/


Nahoru
 Profil  
 
Zobrazit příspěvky za předchozí:  Seřadit podle  
Odeslat nové téma Odpovědět na téma  [ Příspěvků: 6 ] 

Všechny časy jsou v UTC + 1 hodina [ Letní čas ]


Kdo je online

Uživatelé procházející toto fórum: Žádní registrovaní uživatelé a 0 návštevníků


Nemůžete zakládat nová témata v tomto fóru
Nemůžete odpovídat v tomto fóru
Nemůžete upravovat své příspěvky v tomto fóru
Nemůžete mazat své příspěvky v tomto fóru
Nemůžete přikládat soubory v tomto fóru

Hledat:
Přejít na:  
cron
FTP Uploader
Staňte se naším zákazníkem!
Hledáme kolegy
WordPress partneři

Seznam všech partnerů

WordPress Hosting
Návody pro C4

© 2009-2019 ČESKÝ WEBHOSTING s.r.o. Kontaktní e-mail: forum@c4.cz
Diskuzní fórum využívá technologie: phpBB, phpBB-SEO.com, phpBB.cz