I am posting this in the hopes that the solution I've found to my problem will help others who may want to do something similiar. Please note that the solution I have found does not have anything to do with css and is a bit of a hack.
What I decided on was to generate a link on the right side of the pulldown box that when clicked would open a new window and open a page containing an image with the different colors on it (I haven't written this page yet, but the link opens a window and the page not found pops up).
Here's what I did. First I copied tpl_modules_attributes.php from includes/templates/template_default/templates/ to my harddrive. Then, I edited the file like this:
Code:
<?php
/**
* Module Template
*
* Template used to render attribute display/input fields
*
* @package templateSystem
* @copyright Copyright 2003-2005 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: tpl_modules_attributes.php 3208 2006-03-19 16:48:57Z birdbrain $
*/
?>
<div id="productAttributes">
<?php if ($zv_display_select_option > 0) { ?>
<h3 id="attribsOptionsText"><?php echo TEXT_PRODUCT_OPTIONS; ?></h3>
<?php } // show please select unless all are readonly ?>
<?php
for($i=0;$i<sizeof($options_name);$i++) {
?>
<!--
//Comment section moved
//<?php
// if ($options_comment[$i] != '' and $options_comment_position[$i] == '0') {
//?>
//<h3 class="attributesComments"><?php echo $options_comment[$i]; ?></h3>
//<?php
// }
//?>
//Comment section end moved
-->
<div class="wrapperAttribsOptions">
<h4 class="optionName back"><?php echo $options_name[$i]; ?></h4>
<div class="back"><?php echo "\n" . $options_menu[$i]; ?></div>
<!-- Moved here -->
<?php
if ($options_comment[$i] != '' and $options_comment_position[$i] == '0') {
?>
<h3 class="attributesComments"><?php echo " " . $options_comment[$i]; ?></h3>
<?php
}
?>
<!-- End move -->
<br class="clearBoth" />
</div>
<?php if ($options_comment[$i] != '' and $options_comment_position[$i] == '1') { ?>
<div class="ProductInfoComments"><?php echo $options_comment[$i]; ?></div>
<?php } ?>
<?php
if ($options_attributes_image[$i] != '') {
?>
<?php echo $options_attributes_image[$i]; ?>
<?php
}
?>
<br class="clearBoth" />
<?php
}
?>
<?php
if ($show_onetime_charges_description == 'true') {
?>
<div class="wrapperAttribsOneTime"><?php echo TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION; ?></div>
<?php } ?>
<?php
if ($show_attributes_qty_prices_description == 'true') {
?>
<div class="wrapperAttribsQtyPrices"><?php echo zen_image(DIR_WS_TEMPLATE_ICONS . 'icon_status_green.gif', TEXT_ATTRIBUTES_QTY_PRICE_HELP_LINK, 10, 10) . ' ' . '<a href="javascript:popupWindowPrice(\'' . zen_href_link(FILENAME_POPUP_ATTRIBUTES_QTY_PRICES, 'products_id=' . $_GET['products_id'] . '&products_tax_class_id=' . $products_tax_class_id) . '\')">' . TEXT_ATTRIBUTES_QTY_PRICE_HELP_LINK . '</a>'; ?></div>
<?php } ?>
</div>
You can see that I've commented out the original code section (in red) and moved it (in green) right after the dropdown box is created. This file was then copied to includes/templates/MY_TEMPLATE/templates/ .
Now what I've done is just move the comments to the right side of the pulldown. Next, I went into the admin->catalog->option name manager and then clicked 'edit' on the color dropdown attribute. This brings up another page where you can add a comment.
Here's what I put in for the comment:
Code:
<A HREF="colors.htm" target="_blank">View Color Samples</a>
Now when you view any page with the color attribute you'll also see a link on the right of the dropdown that pops up the page that displays the colors available.
Phew! The monkey is off my back!
If you'd like to see it in action:
http://www.decaldepot.net/zencart/in...products_id=79
*NOTE* I was not using the attributes comments for anything before so if you are using the comments then this may not be the best approach for you.
Bookmarks