Kaip pritaikyti dizainą?

Taigi, pirmiausia susirandam norimą HTML dizainą. Aš pasirinkau šį: http://templates.arcsin.se/demo/colorvoid-website-template/ 
Parsisiuntę dizainą, išarchyvuojame jį stiliai/dizaino pavadinimas direktorijoje, tada pervadiname dizaino direktorijoje esantį index.html (gali būti ir kitoks pagrindinio dizaino failo pavadinimas) į index.php. Į naujojo dizaino bylą nukopijuojame sfunkcijos.php failą, esantį default dizaino byloje. 
Dizainai dažniausiai naudoja CSS technologiją, taigi jei ir jūsiškis dizainas ją naudoja, suraskite failą su .css galūne (mano atveju failas vadinosi style.css ir pervadinkite jį į default.css . 
Baigę su failų pavadinimais, atsidarykite stiliai/dizaino pavadinimas/index.php failą ir suradę  po juo trinkite viską iki . Viską tarp jų ištrynę 
vietoj buvusio kodo parašykite 
 
Taip pat jei dizainas reikalauja, arba jums reikia dar ką nors esantį dizainodirektorijoje įterpti tarp  pvz. mano atveju reikėjo įterpti ie_fixes.css failą, nes internet explorer ne visada atvaizduoja puslapį teisingai, terpkime jį taip: 

nurodo direktoriją, kurioje yra dizaino failai. 

po to suraskite kodo atkarpą, kurioje suformuojami blokai (meniu, reklama, šaukykla ir pan.). Mano atveju kodas buvo toks: 

Textbox


A box with some text.



Nukopijuokite tą bloko formavimo kodą ir visus suformuotus html blokus ištrinkite. Tada atsidarykite failą sfunkcijos.php , suraskitę funkciją lentele_l ir išvalykite ją, palikdami tik 
function lentele_l($pavadinimas,$tekstas,$label=false) {		
echo '';
}
Tada tarp kabučių, esančių po echo įklijuokite nukopijuotąjį kodą. 
Mano atveju dabar funkcija atrodo taip: 
function lentele_l($pavadinimas,$tekstas,$label=false) {	
echo '

Textbox


A box with some text.




';
}

Bloko pavadinimo vietoje (pas mane Textbox) įrašome 
'.$pavadinimas.'
o turinio vietoje (pas mane A box with some text.) įrašome 
'.$tekstas.'
Taip pat galite keisti funkcijas klaida(); ir msg();
Galutinė funkcija (mano atveju) atrodys taip: 
function lentele_l($pavadinimas,$tekstas,$label=false) {	
echo '

'.$pavadinimas.'

'.$tekstas.'


';
}

Baigę šį etapą grįžtame į index.php failą ir toje vietoje įrašome: 
Jei dešinės pusės blokai - 
Jei kairės - 

Dabar surandame vietą, kurioje formuojamas puslapio turinys. 
Mano atveju ji atrodo taip: 

Adipiscing



 





Aliquam risus justo, mollis in, laoreet a, consectetuer nec,risus. Nunc blandit sodales lacus. Nam luctus semper mi.






  • Tristique


  • Aenean


  • Pretium




In hac habitasse platea dictumst. Duis porttitor.

Sedvulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. Nullamposuere tristique tortor. In bibendum.

Aenean ornare, nunc eget pretiumporttitor, sem est pretium leo, non euismod nulla dui non diam.

Pellentesque dictum faucibus leo. Vestibulum ac ante. Sed inest.





Ištrinam nereikalingus dalykus (datas ir pan.) ir vėl einame į sfunkcijos.php failą. Ten surandam funkciją lentele() ir pasielgiam su ja taip pat kaip su blokų funkcija lentele_l()
Mano atveju funkcija palieka tokia: 
function lentele($pavadinimas,$tekstas,$label=false) {	
echo '


'.$pavadinimas.'


 



'.$tekstas.'


';
}





Patobulinę funkciją vėl grįžtam į index.php failą ir toje vietoje, kur formuojamas turinys parašote kodą: 

	
if (isset($strError) && !empty($strError)) {

klaida("Klaida", $strError);

}

include ($page . ".php");

?>

Tada pakeičiam navigaciją (ne visuose dizainuose ji būna) 
index.php faile ji būna dažniausiai tarp
    ir
surandam ta vietą ir viską tarp jų ištrynę įrašome 


	
$sql1 = mysql_query1("SELECT SQL_CACHE * FROM `" . LENTELES_PRIESAGA . "page` WHERE `show`='Y' ORDER BY `place` ASC");

$text = '';

foreach($sql1 as $row1) {

if ($row1['show'] == "Y" ) {

$text .= '
  • ' . input($row1['pavadinimas']) . '
  • ';

    }

    }

    echo $text;

    ?>

    Tada jei kur nors yra vieta, kurioje turi būti nurodytas puslapio pavadinimas pvz." Muzikos portalas" ar dar kasnors (pavadinimas nustatomas administravime), toje vietoje įdedame kodą: 
    Jei kur nors norite įterpti puslapio aprašymą tada įdedate šį kodą: 
    Vietoje, kurioje turi būti autoriaus vardas naudojame 
    belieka sukurti lentelių (forumo, vartotojo profilio ir kt. ) ir balionų, kurie atsiranda užvedus ant nuorodų stilius. Tai darome default.css faile 
    balionų stiliui failo apačioje įrašome: 
    .tooltip{

    padding: 3px;

    border: 1px solid #666;

    display: none;

    background: #DDEBF4; /*fono spalvos kodas*/

    color: #666;

    font: bold 9px Verdana, Arial, Helvetica, sans-serif;

    text-align: left;

    position: absolute;

    z-index: 1000;

    -moz-border-radius:5px;

    }

    background ir border spalvas galite keisti. 
    Lentelių stiliui galite pasiimti stilių iš default dizaino (pasikeiskite spalvų kodus):
    /* Lentelems */

    .table {

    border-bottom: 1px solid black;

    border-right: 1px solid black;

    }


    .th {

    text-align:center;

    color: white;

    border-left: 1px solid gray;

    background-color: #E4C9BB;

    height: 20px;

    font-weight: normal;

    }


    .th a {

    color: white;

    }


    .tr:hover, .tr2:hover {

    background-color: #FAECAB;

    cursor:pointer;

    }

    .tr2 {

    background-color: #FBF8F4;

    }

    .td {

    padding-left:5px;

    border-left:1px solid gray

    }

    .td2 {

    padding-left: 5px;

    border-left: 1px solid gray;

    }
    Spalvas ir rėmelius galite pasikeisti pagal save. 
    Aš susiderinau taip: 
    /* Lentelems */

    .table {

    border-bottom: 1px solid black;

    border-right: 1px solid black;

    }

    .th {

    text-align:center;

    color: #D3E5F1;

    border-left: 1px solid gray;

    border-top: 1px solid gray;

    background-color: #A3B5C1;

    height: 20px;

    font-weight: normal;

    }

    .th a {

    color: #D3E5F1;

    }

    .td {

    background-color: #F5F5F5;

    padding-left:5px;

    border-left:1px solid gray

    }

    .td2 {

    background-color: #EEEEEE;

    padding-left: 5px;

    border-left: 1px solid gray;

    }


    Štai ir turime dizainą :) Mano rezultatas: http://www.part.lt/img/e36295a5cde3bfa514a6c23de2356e0a458.jpg 
    Sėkmės.

    Šaltinis: http://mightmedia.lt/Straipsniai/m,6/kaip-pritaikyti-dizaina-_6.html#ixzz26fbqj8rk
     
    Data: 2009-05-07 19:01:43, Autorius: Paulius

    Rašyti komentarą

    Prašome prisijungti!
    arrow_upward