Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Product Listing Enhancements, Thumbnails & Manufacturer Headings


spooks

Recommended Posts

hey SAM.. If i could bother you again, i hope you dont mind.. If you do, just ignore me..

 

I am trying to implement the hover popup on your product listing page, but out of all of the code i have seen, your is SOO complex it makes my head spin.. I can see what is happening in the code, but i am not entirely sure where to put my new code..

 

I know that i have to add this somewhere:

<div id="pic"><a class="p1" href="#" onClick="java script:return false"><?php echo('<img src=' . DIR_WS_IMAGES . $product_info['products_image'] . ' width="' . SMALL_IMAGE_WIDTH . '" height="' . SMALL_IMAGE_HEIGHT . '">'); ?><?php echo('<img src=' . DIR_WS_IMAGES . $product_info['products_image'] . ' width="' . SMALL_IMAGE_WIDTH . '" height="' . SMALL_IMAGE_HEIGHT . '" class="large">'); ?></a></div>

Which will make the hover work (I think) and there are three lines that call for the product image.. I have no idea what to do with this..

 

these are the lines with the product image.. 190 205 295

 

should i replace ALL of those lines with the code? Or just a portion??Sorry if i am being needy...

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

I don't think that would achieve what you think it would, you could try this:

 

find (295):

 

$image = (!$grid && $column_list[0] == 'PRODUCT_LIST_IMAGE' ? '<br>' : '') . $link . tep_image(DIR_WS_IMAGES . $image, ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']), PRODUCT_IMAGE_WIDTH, '') . '</a>' . '<br>';

 

Replace with:

 

$image = (!$grid && $column_list[0] == 'PRODUCT_LIST_IMAGE' ? '<br>' : '') . '<div id="pic">' . $link . tep_image(DIR_WS_IMAGES . $image, ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']), PRODUCT_IMAGE_WIDTH, '', 'class="std"')  . tep_image(DIR_WS_IMAGES . $image, ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']), 200, '', 'class="large"')  . '</a></div>' . '<br>';

 

then add:

 

div#pic a .large {display: none;}
div#pic a:hover .std {display: none;}
div#pic a:hover .large
{
display: block;
}

 

to your css.

 

the 200 above sets image width, alter to your needs, set to '' to use actual image width.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

To remove this all you need to do is restore your original product_listing.php module, the database changes will effect nothing else, if you wish to remove those just restore your last database backup.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

It may be clearer what goes on to you if instead of replace with:

 

$image = (!$grid && $column_list[0] == 'PRODUCT_LIST_IMAGE' ? '<br>' : '') . '<div id="pic">' . $link . tep_image(DIR_WS_IMAGES . $image, ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']), PRODUCT_IMAGE_WIDTH, '', 'class="std"')  . tep_image(DIR_WS_IMAGES . $image, ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']), 200, '', 'class="large"')  . '</a></div>' . '<br>';

 

you replace with:

 

$alt_text = ($addimages ? (tep_not_null($selected_image['images_description']) ? $selected_image['images_description'] : (tep_not_null($selected_image['products_image_description']) ? $selected_image['products_image_description'] : $products['products_name'])) : $products['products_name']);   

$image = (!$grid && $column_list[0] == 'PRODUCT_LIST_IMAGE' ? '<br>' : '') . '<div id="pic">' . $link . tep_image(DIR_WS_IMAGES . $image, $alt_text, PRODUCT_IMAGE_WIDTH, '', 'class="std"')  . tep_image(DIR_WS_IMAGES . $image, $alt_text, 200, '', 'class="large"')  . '</a></div>' . '<br>';

 

Hope that helps.

Edited by spooks

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

thanks sam.. i'm going to try that NOW!! i'm soo excited you really rock~~

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

Oh no.. sam.. i lost the images on my product listing now!!! i used the second block of code and the css.. and i got an unexpected T_ELSE and when i used the first block i have no images on the product list now.

Edited by lindsayanng

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

hey, i got the code in there without any errors or anything, BUT it does the opposite. It shows the image, and if you hover, it shrinks the whole table, not just the image..

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

Ok, so i figured out what is going on..

 

that code makes the horizonal images SHRINK and the verticle images EXPAND.. it also doesnt make them pop up on top, and actually moved EVERYTHING around including the tables that the images are in..

 

I kept it up so you can see it.. its not a huge deal if customers see it like that.. but its not the effect i was looking for..

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

ok.. i got it to pop OVER and leave a blank behind it, but it keeps popping up to the top left so it gets a squirrly. AND its using the small image which looks REALLY bad.. i need it to use a high quality image

 

go the position correct.. now i have an overall issue.. I just realized that the code that you wrote does not use the specs that i set in admin to use the actual size of the thumbnail.. i set width and hieght to null, but now it is actually setting a width which makes the portrait pictures look HUGE!!

 

I also cant figure out how to make it use a completely different image to pop over

Edited by lindsayanng

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

I changed your code to this:

div#pic a .std {display: none;}
div#pic a:hover .large{position:relative; top:10px; left:100px; background-color:#fff; z-index:100;}
div#pic a:hover .large
{position:relative; top:10px; left:100px; background-color:#fff; z-index:100;}

and it pops the image up, but it is causing SOO many other issues, that i think i shoudlnt use it..

 

still looking for other issues.. the images being the right size in the product listing is more important than this hover.. as much as i WANT it to work, i'm not sure it wil..

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

what do you mean?? you get a blank page?

 

check your control panel and see if you have error reporting turned on.

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

What site are you trying this on?

 

The code I gave only sets the width, so images don't get distorted

 

The code also uses the same image for both, as youir original did, if you wish to use seperate images you must alter the code like.

 

$image = (!$grid && $column_list[0] == 'PRODUCT_LIST_IMAGE' ? '<br>' : '') . '<div id="pic">' . $link . tep_image(DIR_WS_IMAGES . $image, $alt_text, PRODUCT_IMAGE_WIDTH, '', 'class="std"')  . tep_image(DIR_WS_IMAGES . $selected_image['medium_images'], $alt_text, 200, '', 'class="large"')  . '</a></div>' . '<br>';

 

If you wish to have the image 'pop over' everything else (so page stays same) it needs to be placed in a seperate layer, though positioning may become an issue.

 

If you wish to see the intended effect of my code see: http://www.livingconsciously.co.uk/catalog...php/cPath/42_45

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Using my original code (perhaps modified for seperate images) you could try this css in place of original:

 

div#pic a .large {display: none;}

div#pic a:hover .large

{

position:absolute; margin-left:0px; margin-top:-20px; display: block;

}

 

The main issue with this is IE & Firefox absolute positioning don`t relate.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

what do you mean?? you get a blank page?

 

check your control panel and see if you have error reporting turned on.

 

 

Yes... appearing blank the main page...

 

Take a look: http://www.factoryretails.com/35-mp4-player-c-21_23_24.html

 

 

Where i see on admin this error report??

 

Rafael

OScommerce Rocks!

Link to comment
Share on other sites

Hi all,

 

after installation of Product Listing Enhancements, Thumbnails & Manufacturer Headings V1.8 got following message on a site:

 

Fatal error: Call to a member function add_current_page() on a non-object in /mnt/........................./includes/application_top.php on line 314

 

Who knows how to fix?

Link to comment
Share on other sites

Hi all,

 

after installation of Product Listing Enhancements, Thumbnails & Manufacturer Headings V1.8 got following message on a site:

 

Fatal error: Call to a member function add_current_page() on a non-object in /mnt/........................./includes/application_top.php on line 314

 

Who knows how to fix?

 

Unrelated error, could simply be browser cache issue restart browser &/or clear browser cache

 

Otherwise search for navigation history errors/bugs

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

add

 

error_reporting(E_ALL);

 

to the start of product_listing.php after:

 

$graphic_bord = 'no'; //  set to 'yes' if you have older 'graphic borders' and not 'easy graphic borders'.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Yes... appearing blank the main page...

 

Take a look: http://www.factoryretails.com/35-mp4-player-c-21_23_24.html

 

 

Where i see on admin this error report??

 

Rafael

 

 

Already solve the problem...

 

I just get over the ident // that i had on my catalog/index.php file... on lines that are calling for filenam_new_products and filename_product_listing....

 

Tx all..

OScommerce Rocks!

Link to comment
Share on other sites

oohh.. i think you misunderstood what i wanted. I wanted the image to show the larger version of the same image when you hover, and yea, i wanted it to pop over..

 

See this page on Stu's site.. The effect that happens when you hover over the image.. I tried using his CSS and applying the style to your code, but it ALMOST worked.. I had it so that it was popping over larger, but i needed it to use the actual large image so i dont loose image quality

 

Stu Nichol's site

 

The issue is i have NO IDEA how to modify so that it using a larger image on the hover... still figureing that one out.

A great place for newbies to start

Road Map to oscommerce File Structure

DO NOT PM ME FOR HELP. My time is valuable, unless i ask you to PM me, please dont. You will get better help if you post publicly. I am not as good at this as you think anyways!

 

HOWEVER, you can visit my blog (go to my profile to see it) and post a question there, i will find time to get back and answer you

 

Proud Memeber of the CODE BREAKERS CLUB!!

Link to comment
Share on other sites

I think its quite stait forward, but an issue, of old, is your not sure where your large images are in your database, can you check what is called when you click on 'click to enlarge' assuming that is what you want to display.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

oohh.. i think you misunderstood what i wanted. I wanted the image to show the larger version of the same image when you hover, and yea, i wanted it to pop over..

 

See this page on Stu's site.. The effect that happens when you hover over the image.. I tried using his CSS and applying the style to your code, but it ALMOST worked.. I had it so that it was popping over larger, but i needed it to use the actual large image so i dont loose image quality

 

Stu Nichol's site

 

The issue is i have NO IDEA how to modify so that it using a larger image on the hover... still figureing that one out.

You could post your product_info.php file.

Link to comment
Share on other sites

Hi Sam :)

 

Absolutely wonderful mod! I initially setup Product Thumbnail Listing and only THEN realized that you have this updated version. Product Thumbnail Listing worked *perfectly* and I LOVE it, so I think that I will love this even more!

 

Problem is, I went through the instructions for upgrade and now I'm getting an error:

 

Fatal error: Cannot redeclare tep_get_category_name() (previously declared in /home/.../includes/modules/product_listing.php:88) in /home/.../includes/modules/product_listing.php on line 88

 

I'm honestly so new to php (despite already having worked on my store for 4 months) that I don't even know what that means. I've searched this whole forum but it seems I'm the only noob with this problem. Can you please help me out and at the very least tell me what it means and where I need to look to fix it?

 

Just FYI, I've re-uploaded your original product_listing.php like 8 times and I'm still getting the error so I'm genuinely confused.

 

I would appreciate any help at all. Thanks!! :) Oh and let me know if you need a link to the page or more code.. or anything else your heart desires.

 

-Kat

 

Link to My Still Incomplete Website

Link to comment
Share on other sites

Check your index.php, you must be calling product_listing.php twice??, also check if your calling it elsewhere (header, application_top etc etc)

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

You could post your product_info.php file.

 

 

Good idea, but better would be post popup_image.php contents.

Sam

 

Remember, What you think I ment may not be what I thought I ment when I said it.

 

Contributions:

 

Auto Backup your Database, Easy way

 

Multi Images with Fancy Pop-ups, Easy way

 

Products in columns with multi buy etc etc

 

Disable any Category or Product, Easy way

 

Secure & Improve your account pages et al.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...