Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

infoboxes and background images


scotch33

Recommended Posts

Hi -

 

I want to change the infobox titlebars. I am fine with adding background images etc.

 

However, I want to change the layout in the headings (i.e. get the three tds to merge or something along those lines) - the problem is I am not good enough with php to find where the infobox headers are.

 

I can see they are not in the column-right / left files or in the individual infobox files themselves - can anyone help in pointing me to the files / code that i can tweak to get the results i want.

 

What I am getting at the moment in the boxes is shown in the jpeg below - the background image repeating in the three tds is what i am trying to improve

 

box.jpg

Link to comment
Share on other sites

You just need to add this to the TD.infoBoxHeading class in stylesheet.css:

background-image: url(images/hdr_bkgnd.gif);

Change the image name to whatever you want, of course.

 

Jack

Support Links:

For Hire: Contact me for anything you need help with for your shop: upgrading, hosting, repairs, code written, etc.

All of My Addons

Get the latest versions of my addons

Recommended SEO Addons

Link to comment
Share on other sites

Thanks Jack - got that bit. However the problem I am experiencing is that the background image i set appears in the left td, the central td and the right td. Unfortunately as I am trying to use an image that I can't simply repeat horizonatlly I end up with it starting in the wrtong place three times.

 

In an ideal world I want to set a class on eiether just the infobox header table or the tr, not the td.

 

Cheers for the suggestion though, mate.

Link to comment
Share on other sites

to give more detail about what is desired -

 

the code as it outputs in current shop...

 

<table border="0" width="100%" cellspacing="0" cellpadding="0">
 <tr>
<td height="14" class="infoBoxHeading"><img src="images/infobox/corner_left.gif" border="0" alt="" width="11" height="22"></td>
<td width="100%" height="14" class="infoBoxHeading">Categories</td>
<td height="14" class="infoBoxHeading" nowrap><img src="images/pixel_trans.gif" border="0" alt="" width="11" height="14"></td>
 </tr>
</table>

 

the code as I would like to get it to work

 

<table class="infoBoxHeading" border="0" width="100%" cellspacing="0" cellpadding="0">
 <tr>
<td height="14"><img src="images/infobox/corner_left.gif" border="0" alt="" width="11" height="22"></td>
<td width="100%" height="14">Categories</td>
<td height="14" nowrap><img src="images/pixel_trans.gif" border="0" alt="" width="11" height="14"></td>
 </tr>
</table>

 

No in boxes.php I have reached the stage of being able to affect the table boxes in general, and have also found this code relating to the infoboxes -

 

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

  if ($left_corner == true) {
	$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 == true) {
	$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 == true) {
	$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 that boys and girls is where i become lost. Anyone who is a better php hero than i got any pointers?

 

Thanks!

Link to comment
Share on other sites

I must not be understanding the problem. Did you try a no repeate attibute iin the style sheet? If you want ithe image to only show on certain boxes, you can insert the image right into the code in includes/languages/english.php. For example, find this

define('BOX_HEADING_CATEGORIES', 'Categories');

and change it to

define('BOX_HEADING_CATEGORIES', '<img src="some_image.jpg">');

 

Jack

Support Links:

For Hire: Contact me for anything you need help with for your shop: upgrading, hosting, repairs, code written, etc.

All of My Addons

Get the latest versions of my addons

Recommended SEO Addons

Link to comment
Share on other sites

I must not be understanding the problem. Did you try a no repeate attibute iin the style sheet? If you want ithe image to only show on certain boxes, you can insert the image right into the code in includes/languages/english.php. For example, find this
define('BOX_HEADING_CATEGORIES', 'Categories');

and change it to

define('BOX_HEADING_CATEGORIES', '<img src="some_image.jpg">');

 

Jack

 

 

Hi Jack,

 

Thanks for your help again mate, but yes I think we are talking on different lines here. I completely understand the stylesheet and my options with the background image. The problem is that because the infoboxheader contains three cells, all of the same class, it places the image in each cell - thus i get a repeat - three cells three copies of the class, three images. What I want to do is hack the php so that I can assign a class to the table or the table row - thus enabling me to place a single, non repeating background image behind the three cells (if you get my drift). Then I can make the class of the three cells transparent backed so that the image behind shows through.

 

Hope that makes sense (if you look at the top image i attached to the first post you will indeed see three copies of an image - one in each cell - with the central cell showing the most of an image)

 

Thanks!

 

John

Link to comment
Share on other sites

further to easlier post - I can see where you are going with the advice on attaching directly to the heading - sorry, was too busy explaining my problem to see that your suggest might work - will try it now...

Link to comment
Share on other sites

No, it didn't. Or rather, the code you gave me was off course, spot on. But it simply stuck the graphic in the centre cell of the box - rather than putting an image across all three cells as a background (so I can still have the text heading)

 

That said - useful thrick that I hadn't thought of and one that I will almost certainly use for other shops in the future - thanks!

Link to comment
Share on other sites

I think what you are referring to about the three cells are the left and right cells used to create the roundied corners. To keep that option, you will need to slice your image into three images and add them to the code in includes/classes/boxes.php (or just replace the exisitng images/infobox/ images).

 

Jack

Support Links:

For Hire: Contact me for anything you need help with for your shop: upgrading, hosting, repairs, code written, etc.

All of My Addons

Get the latest versions of my addons

Recommended SEO Addons

Link to comment
Share on other sites

Yeah - another one that I've already tried mate. Didn't work the way I wanted. Look thanks for all your help, I am sure there is a way around the issue I have, but frankly the customer isn't paying me enough to wasite any more time on it so I am putting it down to OSC's graphic limitations and moving on.

 

Cheers anyway, an interesting investigation if nothing else.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...