osCommerce Layout Modified

[MahmoodDar]

Hiya all

I would like to know as what are the steps needed to be taken to achieve this sort of changes in osCommerce

http://www.memoryworld.de/

Can this be done through Dreamweavers MX Design Mode or it should only be done through Code View.

Moreover, does one need to create an extra Style Sheet?

Thanks

[michael_s]

Yes and Yes.

Can be done in dreamweaver in either mode. But that is some really nice work, so you better be good at using photoshop too!

Probably not an extra stylesheet, just a few style additions. It is a pretty well thought out site over there.

[MahmoodDar]

HIya msaek

I have read its View Source and it has two Style Sheets attached.
One " stylesheet.css" and other "style.css"

I have tried to change the layout in Dreamweaver but i cant find a way through php, what i tried was that i ran the default.php and copied in view source and then made the adjustments to the html (Static). But the problem came out that it wasnt getting modified as php does.

How has www.memoryworld.com done that in PHP.?

By the way i am good at photshop and flash mx but not PHP

[MahmoodDar]

alright , how would i add a gif in the middle of the InfoBox, in between the Left Corner gif and the right corner gif. the Style Sheet only changes the colour.

For Example, do i have to make the changes here in /catalog/includes/classes/boxes.php

class infoBoxHeading extends tableBox {
    function infoBoxHeading($contents, $left_corner = true, $right_corner = true, $right_arrow = false) {
      $this->table_cellpadding = '0';

      if ($left_corner) {
        $left_corner = tep_image(DIR_WS_IMAGES . 'infobox/corner_left.gif');
      } else {
        $left_corner = tep_image(DIR_WS_IMAGES . 'infobox/corner_right_left.gif');
      }
      if ($right_arrow) {
        $right_arrow = '<a href="' . $right_arrow . '">' . tep_image(DIR_WS_IMAGES . 'infobox/arrow_right.gif', ICON_ARROW_RIGHT) . '</a>';
      } else {
        $right_arrow = '';
      }
      if ($right_corner) {
        $right_corner = $right_arrow . tep_image(DIR_WS_IMAGES . 'infobox/corner_right.gif');
      } else {
        $right_corner = $right_arrow . tep_draw_separator('pixel_trans.gif', '11', '14');
      }

and the default.php

 <td height="14" class="infoBoxHeading" nowrap><img src="images/pixel_trans.gif" border="0" alt="" width="11" height="14"></td>

[/code]

[lango]

msasek, Please excuse the butt in.

Mahmood:

the imortant part of the infoboxHeading is this:

 $info_box_contents = array();
      $info_box_contents[] = array(array('params' => 'height="14" class="infoBoxHeading"', 'text' => $left_corner),
                                   array('params' => 'width="100%" height="14" class="infoBoxHeading"', 'text' => $contents[0]['text']),
                                   array('params' => 'height="14" class="infoBoxHeading"', 'text' => $right_corner));
      $this->tableBox($info_box_contents, true);
    }
  }

I found to add as you say a gif between both corners would go something like this if you still require text do it as a background:

$info_box_contents = array();
$info_box_contents[] = array(array('params' => 'height="14" class="infoBoxHeading"', 'text' => $left_corner),
array('params' => 'background="images/infobox/background.gif" width="100%" class="infoBoxHeading"', 'text' => $contents[0]['text']),

array('params' => 'height="14" class="infoBoxHeading"', 'text' => $right_corner));
$this->tableBox($info_box_contents, true);
}
}

Remember to remove any background colour from you stylesheet.css for infoboxHeading.
Hope this helps.

[MahmoodDar]

Thanks Lango

Ill give this a try

Also, ill check it out in the latest OSCDox Guide.

[MahmoodDar]

I read the guide a bit and I want to add a new box in the right column.
I want that box to hold Login Box.

Do i go about as same as with the Test Page explained in the Osdox Guide.

[MahmoodDar]

Hiya

I have changed the layout of the cart a bit.

I have changed the InfoBox Header Image between the right and left corner gifs. Thanks to Lango for the help

Now i want to place gifs around the Right and Left sides of the WHOLE InfoBox. I tried it with increasing the margin and adding a think border but it doesnt fit well.

Is there a way to define images for the Right and Left Sides of the InfoBox through StyleSheet or any other way

Thanks

[lango]

Mahmood

before I can help any further, can you check this out and advise if this is what you mean.

www.themetest.dcpc.co.uk

you can change the theme at

www.themetest.dcpc.co.uk/admin

Login with:

username tester
password tester

configuration----mystore--- at the bottom you will see Site Thema Options


Lango

[MahmoodDar]

HIya lango

This is exactly what I am talking about. By the way, the site looks really good.

How can I edit my stylesheet or add another to make a theme similar to that. Is this the contribution from Oscommerce.