Dot under product image ?

[Acknowledeged74]

Hi

 

Please take a look at this image, there is a dot (I know it sounds small), that really looks like it shouldn't be there under the product images, on each individual product page.

 

Anyone know how to get rid of this please?

 

Cheers

 

Ash

[NodsDorf]

Hi

 

Please take a look at this image, there is a dot (I know it sounds small), that really looks like it shouldn't be there under the product images, on each individual product page.

 

Anyone know how to get rid of this please?

 

Cheers

 

Ash

 

This looks like a jquery slider did you install this or is it a template? I recently put this on a site I worked on it looks very close to it. You can see that site here to see if its similar its hard to tell from that image.

[vishalchauhan]

Hi

 

I think its due to unwanted <li> tag under the image.

 

Because in the oscommerce 2.3.1, the image in product info page created withing <ul> tag

 

second thing if there is white space in product -> html cotent section from backend but i think its not a issue

 

check in the product info page if there is any extra <li> tag.

 

 

[NodsDorf]

That makes sense too.

[multimixer]

Check if in your styleshhet.css you have

 

#piGal ul {
 list-style-type: none;
}

[Acknowledeged74]

Cool, thanks I'll have a look and report back on which is correct. ;0)

[Acknowledeged74]

Check if in your styleshhet.css you have

 

#piGal ul {
 list-style-type: none;
}

 

this is set to none already.

[Acknowledeged74]

MMMMM

 

The source code reads:

 

 

<div id="piGal" style="float: right;">

<ul>

 

<li><a href="/images/goldbluering.jpg" target="_blank" rel="fancybox"><img src="images/goldbluering.jpg" alt="" width="277" height="244" /></a></li>

</ul>

</div>

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: 0,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

 

<script type="text/javascript">

$("#piGal a[rel^=fancybox]").fancybox({

cyclic: true

});

</script>

 

 

9ct Gold Reversable Masonic Ring, with square moveable black background. This ring is available in sizes K to Z, just specify the size you want when purchasing. :: 9.4 grams in weight :: Hallmarked 9ct Gold

 

<div style="clear: both;"></div>

 

 

</div>

 

and there only seems to be the one <li> which holds the large product image, so not sure its that either ?

 

Any other ideas ?

[multimixer]

CAn you say your url?

[Acknowledeged74]

universal masonry dot co dot uk

 

really down want it picked up by google yet.

[vishalchauhan]

did you change the code?

[vishalchauhan]

you have to check you product info page code for image..

 

something missing there.........

 

have you taken backup before changes?

 

if yes then compare your original file code with latest one.

 

 

 

[Acknowledeged74]

I haven't changed the product info page at all, that's how it was downloaded when I got it.

[vishalchauhan]

ok here i attached a page.

 

please, please, please take backup of your current page and upload that one and check

product_info.php

[vishalchauhan]

ok mate

 

late me show you something

 

i think i have found that.

 

there is width=0 and height=0 in your script for small image which is below the large image that's not a point thats the small image

[Acknowledeged74]

Ah maybe that makes sense, why is it trying to show a small image, on the product page ? I think I can do without that, any idea where the small image is in the code, somewhere in the following I think ?

 

<div id="piGal" style="float: right;">

<ul>

 

<?php

$pi_counter = 0;

while ($pi = tep_db_fetch_array($pi_query)) {

$pi_counter++;

 

$pi_entry = ' <li><a href="';

 

if (tep_not_null($pi['htmlcontent'])) {

$pi_entry .= '#piGalimg_' . $pi_counter;

} else {

$pi_entry .= tep_href_link(DIR_WS_IMAGES . $pi['image']);

}

 

$pi_entry .= '" target="_blank" rel="fancybox">' . tep_image(DIR_WS_IMAGES . $pi['image']) . '</a>';

 

if (tep_not_null($pi['htmlcontent'])) {

$pi_entry .= '<div style="display: none;"><div id="piGalimg_' . $pi_counter . '">' . $pi['htmlcontent'] . '</div></div>';

}

 

$pi_entry .= '</li>';

 

echo $pi_entry;

}

?>

 

</ul>

</div>

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

<?php

} else {

?>

 

<div id="piGal" style="float: right;">

<?php echo '<a href="' . tep_href_link(DIR_WS_IMAGES . $product_info['products_image']) . '" target="_blank" rel="fancybox">' . tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), null, null, 'hspace="5" vspace="5"') . '</a>'; ?>

</div>

[vishalchauhan]

ok let me check one thing

 

find this code

 

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

and replace with

 

thumbwidth: 75,

 

may be this is a issue.

 

if products are not more than one then it assign 0 value so we give now 75 fix

 

let check.

[Acknowledeged74]

OK its now showing a smaller version of the main image, instead of the dot (or v.small image).

[Acknowledeged74]

I would like to remove this smaller image any idea which bit of code I need to remove from the product page, or maybe its something in the settings ?

[multimixer]

Make your self sure about following

1) in file product_info.php you have this

  thumbwidth: <?php echo (($pi_counter > 1) ? '65' : '0'); ?>,

included here

<script type="text/javascript">
$('#piGal ul').bxGallery({
 maxwidth: 300,
 maxheight: 200,
 thumbwidth: <?php echo (($pi_counter > 1) ? '65' : '0'); ?>,
 thumbcontainer: 300,
 load_image: 'ext/jquery/bxGallery/spinner.gif'
});
</script>

2) You did not upload the same image a second time as a large image

 

3) you add to your css following

#piGal img{border:none}

[Acknowledeged74]

Wow thanks so much Multimixer, top answer, absolutely did the trick. Of course it was an border as the dot you can see is the same colour grey, border=0 naturally gets rid of it.