Jak zrobic 3 kolumnowe wyswietlanie produktow na stronie ???
M
merci
2008-04-08 08:41
mastah - dodatek ten nie bedzie dzialal z wersja Q.Cart v3.0, potrzebna jest jego modyfikacja. Planujemy uaktualnic go, tak by dzialal z nowa wersja, ale znajdziemy na to czas dopiero za jakies 2-3 tyg. A jak samemu zrobic cos takiego, niestety nie jestem w stanie dac instrukcji, nie jest to takie proste, ale jak ktos dobrze zna html/css i troche php, to moze zobaczyc jak byl zrobiony dodatek ProductsInRow i sprobowac przeniesc to do swojego sklepu.
FoTam74
2008-04-09 19:39
merci:
my polish is very poor... does that mean that the ProductsInRow plugin for Quick.Cart v3.x will be automatically released when the final version comes out?
Anyway, I hope so... please explain shortly in english, merci!
:)
FoTam74
mastah
2008-04-09 22:48
I made 2 colums without plugin :D little changes to css and php ... couldn't wait for plugin... ^_^'
M
mastah
2008-04-09 22:51
FoTam74
merci said that there should be ProductsInRow plugin released in 2-3 weeks from now for the v3.0
M
s4motny
2008-04-10 04:35
dude can u send me hove to make it on s4motny@gmail.com i will be very glad
merci
2008-04-10 08:21
mastah - maybe write here how to make two column for those who can't wait for plugin.
mastah
2008-04-10 23:49
Ok - but first of all i think its not VALID with W3C becouse its too hard for me to get what is wrong ...
1. Open pages_default.tpl 2. Go to (
<!-- BEGIN PRODUCTS_HEAD --> <ul id="products"> <li class="pages" id="pagesBefore">$lang[Pages]: $aData[sPages]</li> <!-- END PRODUCTS_HEAD -->
)
AND REPLACE IT WITH (
<!-- BEGIN PRODUCTS_HEAD --> <li class="pages" id="pagesBefore">$lang[Pages]: $aData[sPages]</li> <ul id="products"> <!-- END PRODUCTS_HEAD -->
)
then go to line with (
<!-- BEGIN PRODUCTS_FOOT --> <li class="pages" id="pagesAfter">$lang[Pages]: $aData[sPages]</li> </ul> <!-- END PRODUCTS_FOOT -->
)
AND CHANGE IT TO (
<!-- BEGIN PRODUCTS_FOOT --> </ul> <li class="pages" id="pagesAfter">$lang[Pages]: $aData[sPages]</li> <!-- END PRODUCTS_FOOT -->
) 3. Open default.css or other main css file you use... 4. Go to line with (
/* PRODUCTS LIST */ #products{float:left;width:100%;list-style:none;} #products li{clear:both;float:left;width:96%;padding:5px 2% 10px;border-bottom:1px solid #d1bd9d;} * html #products li{width:100%;}
)
AND REPLACE IT WITH (
/* PRODUCTS LIST */ #products{float:left;width:100%;list-style:none;} #products li{float:left;width:40%;height:175px;margin:5px 5px 10px;border-bottom:1px solid #d1bd9d;} * html #products li{width:40%;}
)
Ok and now explanation ... first we changed the content of <ul id="products"> , we made " 1 2 3 (4) 5 ... Next >>> " outside the UL. If we wont do that the page will spread all over the site :D
Now the colums:
- For two: - change in css
#products li{float:left;width:40%;height:175px;margin:5px 5px 10px;border-bottom:1px solid #d1bd9d;} * html #products li{width:40%;}
the percentage values close to 40 % you can experiment with that
- For three: - change in css percentage values to 25-30 % ... or something like that... should work.
