Jdi na obsah Jdi na menu

Změna pozadí

Checete si dát nějaký svůj obrázek na pozadí vaší stránky nebo jen nějakou barvu? Postupujte podle tohoto návodu:

 

Kompatibilita

Současná verze eStránek:  ANO  
Nová verze eStránek:  NE - Jiná struktura CSS šablon. Návod pro novou verzi eStránek zde.

Testováno 26. srpna 2009

 

Barva na pozadí

Šablona A

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Arial, sans-serif;
    color: black;
    text-align: center;
   font-size: small;
    fo\nt-size: middle;
    background-color: white;
}

2. Změň na:

body {
    font-family: Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background-color: barva;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona B

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #A4D5FF url("<!-- cssimgroot -->02background.png") repeat-x;
}

2. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: barva;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona C

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #F5FDD9 url("<!-- cssimgroot -->03background.png") repeat-x;
    padding-bottom: 20px;
}

2. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: barva;
    padding-bottom: 20px;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona D

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#bgobsah {
    background: #653808 url("<!-- cssimgroot -->04h_background.gif") 50% 0 repeat-y;
}

2. Změň na:

#bgobsah {
    background: barva;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona E

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: #9EE5EB;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #223034 url("<!-- cssimgroot -->05background.gif") repeat-x;
}

2. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: #9EE5EB;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: barva;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona F

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #c7d9a5 url("<!-- cssimgroot -->06g_body.gif");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

2. Změň na:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: barva;
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

barva - Místo toho vložte HTML kód barvy.

3. Najdi

#page {
    padding-top: 15px;
    height: 100%;
    background:  url("<!-- cssimgroot -->06g_back.gif") repeat-x;
}

fialově - Toto smažte

4. Uložte a máte hotovo

 

Šablona G

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('<!-- cssimgroot -->g/body.gif') repeat-x; }

2. Změň na:

body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: barva; }

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona H

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #B49E75 url("<!-- cssimgroot -->h/bg.png");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

2. Změň na:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: barva;
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona I

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#page {
    background: #d2ebf2;
    padding-top: 15px;
    height: 100%;
    font-size: 90%;
}

2. Změň na:

#page {
    background: barva;
    padding-top: 15px;
    height: 100%;
    font-size: 90%;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Šablona J

1. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#text {
    clear: both;
    margin-top: 20px;
    background: #18436b url('<!-- cssimgroot -->j/5/content_wrap.jpg') top left repeat-x;
}

2. Změň na:

#text {
    clear: both;
    margin-top: 20px;
    background: barva;
}

barva - Místo toho vložte HTML kód barvy.

3. Uložte a máte hotovo

 

Obrázek na pozadí

Šablona A

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background-color: white;
}

3. Změň na:

body {
    font-family: Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: white url("urlobrazku");
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona B

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #A4D5FF url("<!-- cssimgroot -->02background.png") repeat-x;
}

3. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #A4D5FF url("urlobrazku");
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona C

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #F5FDD9 url("<!-- cssimgroot -->03background.png") repeat-x;
    padding-bottom: 20px;
}

3. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #F5FDD9 url("urlobrazku");
    padding-bottom: 20px;
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona D

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#bgobsah {
    background: #653808 url("<!-- cssimgroot -->04h_background.gif") 50% 0 repeat-y;
}

3. Změň na:

#bgobsah {
   background: #653808url("urlobrazku");
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona E

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: #9EE5EB;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #223034 url("<!-- cssimgroot -->05background.gif") repeat-x;
}

3. Změň na:

body {
    font-family: Tahoma, Arial, sans-serif;
    color: #9EE5EB;
    text-align: center;
    font-size: small;
    fo\nt-size: middle;
    background: #223034 url("urlobrazku");
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona F

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #c7d9a5 url("<!-- cssimgroot -->06g_body.gif");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

3. Změň na:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #c7d9a5 url("urlobrazku");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

urlobrazku - Změň na URL vašeho obrázku

4. Najdi

#page {
    padding-top: 15px;
    height: 100%;
    background:  url("<!-- cssimgroot -->06g_back.gif") repeat-x;
}

fialově - Toto smažte

5. Uložte a máte hotovo

 

Šablona G

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('<!-- cssimgroot -->g/body.gif') repeat-x; }

3. Změň na:

body { font: small/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: black; text-align: center; background: #393b3d url('urlobrazku'); }

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona H

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #B49E75 url("<!-- cssimgroot -->h/bg.png");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

3. Změň na:

body {
    font-family: Tahoma, Verdana, Arial, lucida, sans-serif;
    background: #B49E75 url("urlobrazku");
    color: #000;
    font-size: x-small;
    text-align: center;
    min-width: 760px;
    line-height: 1.5;
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona I

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#page {
    background: #d2ebf2;
    padding-top: 15px;
    height: 100%;
    font-size: 90%;
}

3. Změň na:

#page {
    background: #d2ebf2 url('urlobrazku');
    padding-top: 15px;
    height: 100%;
    font-size: 90%;
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Šablona J

1. Nahraj na stránky svůj obrázek

2. V CSS (Nastavení - Vzhled - Design - Upravit CSS šablony) najdi toto:

#text {
    clear: both;
    margin-top: 20px;
    background: #18436b url('<!-- cssimgroot -->j/5/content_wrap.jpg') top left repeat-x;
}

3. Změň na:

#text {
    clear: both;
    margin-top: 20px;
    background: #18436b url('urlobrazku');
}

urlobrazku - Změň na URL vašeho obrázku

4. Uložte a máte hotovo

 

Nepohyblivé pozadí

Pokud chcete mít nepohyblivé pozadí, jako je na těchto stránkách.

Za url ('urlobrazku'); vložte background-attachment: fixed;

 

Komentáře

Přidat komentář

Přehled komentářů

Georgia - Dík-nepohyblivé pozadí

18. 8. 2010 9:27

Funguje to-Díky!

Pepa - dotaz

2. 5. 2010 21:50

Ahoj Tome, zkus vložit na nějaké nové šabloně do fotoalba video z YouTube, při slideshow je video nad fotkou ... :-( Dalo by se s tím něco udělat? Existují kody html či CCS aby srovnali zobrazování vrstev či tak něco? Už jsem to psal na podporu eStránek, anyd s tím něco udělají. Blbne to IE a Opeře ...

Pepa - poděkování

1. 5. 2010 12:31

Moc díky :-)

Tomáš Hypeš - Re: pomoc pozadá

1. 5. 2010 11:25

body { text-align: center; font: 80%/1.5 Tahoma, \"Lucida Grande CE\", lucida, sans-serif; color: #000; background:#FCFE9A url(\'/img/picture/4/pozadi.jpg\') center top repeat-y; background-attachment: fixed; }
hr { display: none; }

Pepa - pomoc pozadá

1. 5. 2010 10:42

Ahoj Tome,
pleas help,
zkoušel jsem dle Tvé rady udělat nepohyblivé pozadí, zastavilo se mi ale zrušilom mi příkaz top center. Posílám kus kodu viz níže, jak tam správně vepsat kod pro fixní pozadí? Předem díky

body { text-align: center; font: 80%/1.5 Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #000; background:#FCFE9A url('/img/picture/4/pozadi.jpg') center top repeat-y; }
hr { display: none; }

Tomáš Hypeš - Re: nepohyblivé pozadie

8. 4. 2010 21:38

Musíte si stáhnout novější IE, ono několik let starý prohlížeč není dobré používat. Je snad jasné, že vám toho tam hodně fungovat nebude.

zajo - nepohyblivé pozadie

8. 4. 2010 19:43

tak máte pravdu, tento problem je len pri IE pri opere je to ok, v tomto prípade si asi nepomôžem , alebo áno ?

zajo - nepohyblivé pozadí

8. 4. 2010 19:37

to pozadie nie je nepohyblivé ale zložené z viacerých textúr , vidno medzi nimi prechody

Mám operu i IE

Tomáš Hypeš - Re: nepohyblivé pozadí

8. 4. 2010 15:48

Mě to funguje, jaký máte prohlížeč?

zajo - nepohyblivé pozadí

8. 4. 2010 1:11

www.detemzvilsan.cz

Tomáš Hypeš - Re: nepohyblivé pozadí

7. 4. 2010 6:25

Dej mi adresu tvých stránek.

zajo - nepohyblivé pozadí

6. 4. 2010 22:31

Zdravím použil som vaš návod na zmenu v šablóne I som zmenil textúru a následne som chcel znehybniť pozadie ako u vás ale veta background-attachment: fixed;nefunguje . Viete mi poradiť ? Ďakujem

pardon - pardon

5. 3. 2010 22:47

v sablone A je chyba fo/nt
inak celkom fajn

Tomáš Hypeš - Re: Změna barvy pozadí

31. 10. 2009 7:10

Co je odborného na "Jméno již existuje."??? Řešení se samo nabízí - přece ho změním!!! Mě udivuje, že na to nepříjdete sami. Promiň, ale si miliontá, kdo s tím má problém.

Přichystalová Mila - Změna barvy pozadí

31. 10. 2009 0:41

Postupuji podle návodu a změna pozadí prostě nejde.Vždy se mě ukáže nad tabulkou s kódy,že název již existuje.Kde je prosím chyba.
Ještě mám dotaz,zda se dá změnit šablona,dříve jsem to bez úspěchu zkoušela,také se mě ukazovalo,že název již existuje.Měla bych dodat,že jsem samouk,takže neznám některé odborné názvy.Chtěla bych nějaká vylepšení na mých stránkách a potřebuji poradit,bylo by to možné emailem?
Děkuji za odpověď.

Tomáš Hypeš - Re: fotka na pozadie

28. 10. 2009 14:44

Protože to CSS neumí. Na pozadí by měli být textury a ne fotky.

Martin - fotka na pozadie

28. 10. 2009 14:19

ked si vlozim fotku na pozadie tak cela nezkryje pluchu co by mala....preco?

Tomáš Hypeš - RE:www.denko94.estranky.sk

12. 8. 2009 21:13

Nebo na VIP proram jako mám já. Na zdarma to jde taky, ale je to ZBYTEČNĚ SLOŽITÉ.

Denko94 - www.denko94.estranky.sk

12. 8. 2009 21:03

Ahoj,vložiť svoj obrázok na pozadie tak ako máš ty tie lebky sa dá iba tomu,kto má estranky platené???

Tomáš Hypeš - RE:www.lenocka.estranky.sk

18. 6. 2009 17:10

Smůla