Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Need help creating pop up text for product info page


arkisaeo

Recommended Posts

Posted

One of the things my client wants to have done is, on each individual product page she wants to have a link that opens a new window with a list of that particular product's ingredients.

 

For example:

 

The category page would have the following things listed:

 

Facial Mask

Lip Balm

Soap

 

If you would click on the Lip Balm link, it would take you to the product info page for that product. And there you would see the description, image, add to cart button and so forth.

 

However, either below the image or below the description text, there would also be a link that says: "Click here to view a list of Ingredients". You'd click on that link, and a window or lightbox window would pop up with the list of ingredients for the Lip Balm.

 

 

Then, if you wanted to view the Soap product, you'd go to that product page and if you clicked on that Ingredients link, it would pop up the ingredients for the Soap, etc.

 

 

 

I know how to do this in html, but I can't figure out how to do it in the product_info.php file.

 

 

In an html file, I use the lyteframe code listed here (HTML Content Example) and the effect works fine.

 

What I can't figure out is how to edit the product_info.php file so that each individual product page would have their own individual list of ingredients pop up in a box like that. I've searched the forums and the Add-Ons section, but the only pop-up/lightbox info I've found deals with images and not really text at all.

 

Any ideas?

Posted

one idea

 

1) You create one more field in DB, table products_description, call it products_ingredients or whatever

2) Alter the file admin/categories.php, so you have a textarea field to write into this your info. You can see how it is done for the regular description

3) make a new file under catalog/ and call it ingredients.php. In this file query the database (table products_description) for the ingredients info. You need the products id for this so

4) make a link to this new file (ingredients.php) and don't forget to send the products_id with it

5) last thing is to decide with what effect you want the new page to appear, you can use fancybox or whatever, set up the link accordingly + maybe some more additions in product_info.php, same as in regular html

 

EDIT: I would also search in the addons, maybe something exist, something like a tabbed product info or similar

Posted

I think I might have figured out another way. Well, almost.

 

In product_info.php there's this line of code:

 

<?php echo sprintf(TEXT_MORE_INFORMATION, tep_href_link(FILENAME_REDIRECT, 'action=url&goto=' . urlencode($product_info['products_url']), 'NONSSL', true, false)); ?>

 

which redirects to the Products URL listed for the product in the admin control panel.

 

What I can't figure out is how to add this snippet of code to that line:

 

rel="lyteframe" rev="width: 300px; height: 200px;"

 

so the redirected url will open in the lyteframe box instead of a new browser window or tab.

Posted

I figured it out! Woohoo! :D

 

For those wondering:

 

This is for adding a link to your product page, which could be for a list of ingredients, a more detailed product description, instructions, etc.

(The link will open in a lightbox on the same page)

 

 

 

***BEFORE YOU DO ANYTHING, BACKUP YOUR FILES/DATABASE!!!***

 

 

 

1. Go to: Your Shopping Cart Admin Panel--->Catalog--->Categories/Products

 

2. Click on the product you want to add the link to and then click 'Edit'

 

3. Near the bottom of the product's edit page, you'll find a section to add the "Products URL (without http://)". Put the link you want to use in that section.

 

4. Click this link to download this Lytebox program::: download Lytebox v.3.22

 

*Don't try to substitute another lightbox program/code for this as they do NOT all work the same or have the same features.

 

 

 

5. Upload the Lytebox files to your site (via ftp, cPanel, or whatever else you use). In my case, I uploaded the files to the root of the site, which is where the catalog files are also located.

 

 

6. Open product_info.php (it should be in the catalog file, or wherever you stored your shop files)

 

7. Add:

 

<link rel="stylesheet" href="lytebox/lytebox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lytebox/lytebox.js"></script>

 

between the

<head> </head>

tags

 

 

8. Find:

 

<?php echo sprintf(TEXT_MORE_INFORMATION, tep_href_link(FILENAME_REDIRECT, 'action=url&goto=' . urlencode($product_info['products_url']), 'NONSSL', true, false)); ?>

 

 

Replace With:

 

<?php echo '<a href="' . tep_href_link(FILENAME_REDIRECT, 'action=url&goto=' . urlencode($product_info['products_url']), 'NONSSL', true, false) . '" rel="lyteframe[product]" title="'.'">' . TEXT_CLICK_TO_ENLARGE . '</a>'; ?>

 

 

Save and it should work!

 

You can replace the "TEXT_CLICK_TO_ENLARGE" with another pre-defined text.

 

To edit the text or add new text, go into Includes--->Languages--->English (or whatever language file you want to edit) ---> product_info.php

 

 

Find:

 

define('TEXT_CLICK_TO_ENLARGE', 'Click to enlarge');

 

And you can change the Click to enlarge to something else

 

or, you can add a new definition below that:

 

define('YOUR_TEXT_NAME', 'Whatever you want the text to say');

 

 

 

That's it!

Archived

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

×
×
  • Create New...