Jump to content



Photo
- - - - -

Convert OSCommerce 2.2RC2a to table-less CSS


  • Please log in to reply
233 replies to this topic

#161   srr

srr
  • Members
  • 7 posts
  • Real Name:Steve

Posted 05 August 2010 - 11:33

Here is a cleaner way: Adjust the size of the header (or rather the space needed for the header) from the stylesheet. Open the stylesheet.css and find these two selectors:

#header {
position: absolute;top: 0px;width:945px;padding:0px 0px 0px 0px;margin:10px 0px 0px 0px;background-color: transparent; 
}
			
#page {
float: left;width: 945px;padding:0px 0px 0px 0px;margin:115px 0px 10px 0px;border:0px solid #666666;background-repeat:repeat-y;background-position:0px 0px;
}

Note the #header position is 'absolute'. That means it ignores the placement of anything else. Which is why it is overlapping your page content, or the #page container, when you make the header image bigger.

However, note the #page margin:115px 0px 0px 0px. That first number 115px is the top margin in pixels above the #page container or div . Increase that number to push the content down more and allow for the increased size of your header.


Not sure why I didn't try that in the first place works perfectly - thanks.

One other question I downloaded the 1st March update that you uploaded. Does this contain any code from the contributions that you have tried with OSC to CSS?

Thanks.

Edited by srr, 05 August 2010 - 11:37.


#162   srr

srr
  • Members
  • 7 posts
  • Real Name:Steve

Posted 06 August 2010 - 21:59

Not sure if you have another thread for the apple template you created. But would it be possible for you to provide a copy of the source files for the images in this template so that I can change the colour?

I would be very grateful.

Thanks.

#163   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 06 August 2010 - 22:12

Go to :

blue_button

and you can pull it off the site.

#164   srr

srr
  • Members
  • 7 posts
  • Real Name:Steve

Posted 07 August 2010 - 20:57

Go to :

blue_button

and you can pull it off the site.


Thanks for that. Would you also be able to provide the ones for the info box's and the topbar etc?

Thanks again.

#165   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 07 August 2010 - 21:12

I do not have the source files for these. They are such simple gif's, that you should be able to just open them in photoshop in whatever form you need.

#166   kortshop

kortshop
  • Members
  • 16 posts
  • Real Name:Vidar Strand
  • Gender:Male
  • Location:Aalesund, Norway

Posted 01 September 2010 - 17:33

I have a problem with installing "jQuery - Ultimate Product Pack" on top of the OSC to CSS contribution. I have seen it working on the demo site: demo site. Could someone please post or email me the product_info.php file. I have the admin part working and it's only when displaying a product that the page layout is messed up.

Vidar

#167   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 01 September 2010 - 18:24

I'm positive the problem is with the page height as this affects the info boxes. However I really like the these boxes, are they compatible with OsCommerce v2?


Hello Linus,

These alignment issues are resolved in the Version 2 of OSc to CSS which I should have posted in about a week. The infoboxes are reworked and the entire layout is on the rock solid 960 grid system. (Google 'Grid 960' or visit 960.gs ). You can see the new version in progress at www dot alpha-clear dot com/ninesixty.

#168   pdcelec

pdcelec
  • Members
  • 606 posts
  • Real Name:Paul Clifford
  • Gender:Male
  • Location:UK

Posted 05 September 2010 - 18:15

Hi
I have installed the osc to css conversion and think it is a great contribution. Having just read the last post about version 2, I am holding back on installing contributions to the site. The site is only 3 days old and I dont want to add loads of contributions till osc css ver 2 is available unless you can tell me if there will be much to upgrade from ver 1.
Thanks

#169   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 05 September 2010 - 19:14

Hi Pdcelec,

It will be tedious to upgrade if you have installed contributions. A lot of stuff is going to be different. The new version will be far easier to learn and work with. If you haven't done much in the way of installing contributions I would hold off. It will be easy however to simply upload the new version directly on top of the old version. That will be just a matter of overwriting the catalog files.

One thing you could do, however is upload your products and configure your store . There will be no changes to the database, or changes to the admin.

I should have it ready this week.

#170   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 22 September 2010 - 19:17

Trying to to download the latest full package dated 15 Sept, 2010. After clicking the download link, I get the red X ->an error occurred when unzipping.

#171   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 22 September 2010 - 20:09

I just tried the download, it works okay. There is something a little goofy on your end. I'm sure it is one little annoying and obscure setting somewhere that will be easy to change. (I'm guessing, I really don't know)

The download system on OSCommerce is really good, though.

#172   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 22 September 2010 - 22:16

I just tried the download, it works okay. There is something a little goofy on your end. I'm sure it is one little annoying and obscure setting somewhere that will be easy to change. (I'm guessing, I really don't know)

The download system on OSCommerce is really good, though.

I did try the full contribution for an earlier date and also the updates, with no problem. So it is just that one date 15 Sept, 2010. Just for my information, I even tried a few other contributions, all with no problems. So do not know why that one problem with that one date. Even tried your other contribution, it was a success.

Edited by blr044, 22 September 2010 - 22:19.


#173   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 22 September 2010 - 22:51

I don't know why it is a problem, there is nothing I can do. Maybe the darn internet tubes need cleaning or something.

The bulk mail engine is my favorite, it is just simple and rock steady. I'm glad you like it.

#174   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 23 September 2010 - 20:09

I've tried and retried to download OSC to CSS dated 15 Sept, 2010. Even closed browser completely and even made sure cache was cleared, still no luck. Image below:

[img]http://www.greatdiscounts4u.com/images/osc_to_css.jpg[/img]

Am asking if a member could download it and attach the file to a email if not to large to send. Email address is russell044 at gmail dot com

Thanks in advance.

Edited by blr044, 23 September 2010 - 20:11.


#175   multimixer

multimixer

    Lemons or Melons ?

  • Partner
  • 4,627 posts
  • Real Name:George Zarkadas
  • Gender:Male
  • Location:Greece

Posted 25 September 2010 - 06:40

Am asking if a member could download it and attach the file to a email if not to large to send. Email address is russell044 at gmail dot com


I send you the addon in 3 formats, check your mailbox for something you got from multimixer, maybe it will land in the spam folder

#176   sijo

sijo
  • Members
  • 268 posts
  • Real Name:Stein Ivar Johnsen
  • Gender:Male
  • Location:Norway

Posted 25 September 2010 - 07:25

Trying to to download the latest full package dated 15 Sept, 2010. After clicking the download link, I get the red X ->an error occurred when unzipping.


There is a problem with this package. At my end it dit not unzip with WinRar but it worked with WinZip...
---------------
regards
sijo
---------------

Contrib: JMrating10 - Rate your products / osCommerce VTS - Virus & Threat Scanner

(osCommerce VTS now also checks for leading and trailing whitespace and also have a grep function)

#177   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 25 September 2010 - 16:24

I send you the addon in 3 formats, check your mailbox for something you got from multimixer, maybe it will land in the spam folder


Thanks George and Stein for the help.

Yes, I had to download WinZip to try and /thumbsup.gif' class='bbc_emoticon' alt=':thumbsup:' /> and not use PKWare.

Edited by blr044, 25 September 2010 - 16:26.


#178   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 26 September 2010 - 17:13

First of all, I have downloaded this contribution, and for a limit time, it is in it's own directory for testing purposes. I have a few comments/questions regarding this mod.

1. I notice in the demo web site, there is a slight difference when viewed using IE8 and FF. You can see it in the left and right column.

2. Also I notice the lines in the content area is solid even though in styles.css - it as:

.dotted-line{
border-bottom:1px dotted #999999;
}


3. On my test site, it appears as a dotted line between the grids.

4. What's the difference between grid_6 alpha and grid_6 omega?

5. My information box contents list begins with a square bullet compared to numbers - ex. 1, 2, and etc.

6. I did as instructed, used the latest 2.2RC2A ver and then ver 2.0 of OSC to CSS plus the two updates after version 2.0

7. When viewing through the demo site last week, I came across a page with grid layouts templates. Now I jut can not fine it.

8. I had to remove the the superfish horizontal navigation menu because the number of my categories. But I always could rearrange the categories in the future so that the top nav menu will accommodate the complete list of categories.

9. When it states grid_8 - does it mean the text will cover an area equal of 8 grids?

My test site is located at wwww dot greatdiscounts4u dot com / osc_to_css/

Thanks for taking to read through these and answering my questions/comments.

Bennett

#179   npn2531

npn2531
  • Members
  • 1,146 posts
  • Real Name:George
  • Gender:Not Telling
  • Location:Portland OR

Posted 26 September 2010 - 17:47

IE, FF and browsers issues: if you can solve this sort of thing definitively, you will be a Rock Star. It's an issue with all websites. People create hacks, tricks and separate stylesheets, etc to deal with this. In fact the 960.gs is an attempt to deal with it as well. Here is a good resource:
http://www.positioni...es/cc-plus.html

Dotted line issue: There is another selector somewhere, it could be in text.css, that is overriding this. Try this:
#content .dotted-line{
border-bottom:1px dotted #999999;
}

Alpha and Omega. Important concepts in the 960.gs system. You can nest a grid_6 within a grid_6 only if you specify that the inner, the nested, grid_6 will have no left and right margins. class="grid_6 alpha" means no margins, and contents are to be aligned left. Omega, no margins and aligned right. Without alpha and omega you can't nest equal unit grids.

Go to 960.gs and also learn what the classes 'prefix_x', 'suffix_x' , 'push_x', 'pull_x' mean. They are totally awesome. For example. class="grid_3 push_1" will create a grid unit that is 4 wide, but the content area is only 3 wide but pushed over 1. You can push it right over the adjacent grid unit if you like. class="grid_3 prefix_1" will create a unit four wide, but with an empty space or margin 1 wide on the left. etc, etc.

Square units instead of numbers. Somewhere in the text or styles css there is a selector defining the style of the ordered lists. Use the same technique as above. Create a ol style prefixed by #content or #header etc., or find and change the existing selector.

Grid layout - go to 960.gs and get their download. It in you will find the grid templates. Yes, 960.gs is the entire web address. talk about branding!

grid_8, yes the text will cover a unit of 8 grid units minus a margin of 10px left and right

#180   blr044

blr044
  • Members
  • 1,009 posts
  • Real Name:Bennett
  • Gender:Male
  • Location:USA

Posted 26 September 2010 - 18:24

IE, FF and browsers issues: if you can solve this sort of thing definitively, you will be a Rock Star. It's an issue with all websites. People create hacks, tricks and separate stylesheets, etc to deal with this. In fact the 960.gs is an attempt to deal with it as well. Here is a good resource:
http://www.positioni...es/cc-plus.html


Thanks for this bit of info.