Gyakori kérdés, hogyan kell az OsCommerce rendszerben a webáruház alap stílusát megváltoztatni,
ami valljuk be nem éppen szívderítő látvány legalábbis alapértelmezett telepítés után.
Az itt közölt leírás szándékosan általános jellegű, hogy ne csak itt, hanem bárhol másutt is kamatoztatni tudjuk a megszerzett tudást, de természetesen konkrét dolgokat is leírok.

Az Oscommerce rendszerben a stíluslap egy külön fájlban helyezkedik el ami a webshop főkönyvtárában a stylesheet.css fájl.
Csak megjegyzem, hogy lehet még belső stíluslap (vagyis a stíluslap kódja a html vagy php fájl kódjában van) vagy lehet még magát az elemet közvetlenül formázni (inline), de mindkettő módszer ellenjavallott, tehát kerülendő.

Az egyes oldalaknál ezt a fájlt az alábbi utasítás hívja meg:

Szabvány szerint ennek a kódsornak kötelezően a weblap és tagjai között kell lennie.

Hogyan és mit formázzunk CSS kódok segítségével ?

Először is magukat a HTML tag-eket közvetlen kijelölöléssel a css fájlból. Néhány példa:

body {color:#330099}

A fenti utasítás a HTML tag-et ruházza fel az általunk kívánt tulajdonságokkal, ami ebben a példában azt jelenti, hogy a betűk színe sötétkék lesz a weboldalon. Természetesen sokkal több tulajdonságot is felsorolhatunk, de válasszuk el őket pontosvesszővel egymástól:

body {
color:#330099;
background-color:#dadada;
font-family: tahoma;
font-size : 10px;
}

Így kibővítve beállítottunk egy szürke háttérszínt, egy tahoma betűtípust és 10pixel méretű betűméretet.

Néhány jótanács:
Ha valaminek a méretét CSS segítségével beállítjuk (magasság, szélesség, betűméret, pozíció, stb.) akkor nagyon ügyeljünk az alábbiakra:

• olyan, hogy 0px NINCS ! csak 0 van magában
• olyan sincs, hogy 10 px !!! ha szóközt írsz a 0 és a px közé, nem fog működni a kód Firefoxban és Opera böngészőben sem.
• van több fajta "mértékegység" de ne keverjük ezeket (főleg ha nem értünk hozzá).
• tehát nem mindegy, hogy px, pt, pc, em vagy más mértékegységet használunk

Osztály kiválasztók:

Onnan lehet megismerni, hogy ponttal kezdődik pl: .stilusom vagy a HTML elem neve után egy pont és úgy következik a stílus neve, pl: td.stilusom

Mi a különbség a kettő között ? Sok.

.stilusom {color:#330099;}

Ez azt jelenti, hogy bármelyik elem, aminek az osztály kiválasztója a stilusom szöveg, ott a betű színe sötétkék lesz.

pl ha van egy ilyen a weblapomon:

<p class="stilusom">Na ez most kék lesz</p>

Az ugyanúgy kék lesz, mintha egy td vagy span, div, vagy bármilyen HTML tag esetén írtam volna be a class="stilusom" kiegészítést ami az osztálykiválasztó.

De ha én ezt veszem fel a stíluslapba:

td.stilusom {color:#330099;}

Akkor kizárólag azon táblázat cella szövege lesz sötétkék, amelyiket így adtam meg:

<td class="stilusom">Csak táblázat cella szövege lehet kék !</td>

A cikk folytatása következik hamarosan :)