Additional Images Size

[alepia]

Hello there,
I have already searched on the forum about the same issue but I couldn't find a solution to my additional images size! The additional images have the same size settings as the main product size..

Here's an example:
https://bellissima-scarves.co.uk/ind...products_id=85

[alepia]

What I would like do to is to have a smaller additional images size so they can be put besides the main picture and under the Name & price.

[schoolboy]

admin >>> configuration >>> images

[alepia]

@schoolboy I already tried this! When I change the size of the main image, it actually changes also the additional pics one. But I would like to have a big main pic and smaller additional images!

[schoolboy]

You are using what looks like a Template Monster template.

MANY problems lurk within these horrible templates.

If you cannot adjust the images using the proper procedures, then get hold of the crooks who sold you the template and ask them to fix it for you.

[alepia]

It is not a template monster :/
Shall I post the additionalimages php files' code?

[alepia]

Additional_images.php :

<?php
/**
* additional_images module
*
* Prepares list of additional product images to be displayed in template
*
* @package templateSystem
* @copyright Copyright 2003-2006 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: additional_images.php 5369 2006-12-23 10:55:52Z drbyte $
*/
if (!defined('IS_ADMIN_FLAG')) {
die('Illegal Access');
}
if (!defined('IMAGE_ADDITIONAL_DISPLAY_LINK_EVEN_WHEN_NO_LARGE')) define('IMAGE_ADDITIONAL_DISPLAY_LINK_EVEN_WHEN_NO_LARGE','Yes');
// modified for greybox for zencart $images_array = array();

if ($products_image != '') {
// prepare image name
$products_image_extension = substr($products_image, strrpos($products_image, '.'));
$products_image_base = ereg_replace($products_image_extension, '', $products_image);

// if in a subdirectory
if (strrpos($products_image, '/')) {
$products_image_match = substr($products_image, strrpos($products_image, '/')+1);
//echo 'TEST 1: I match ' . $products_image_match . ' - ' . $file . ' - base ' . $products_image_base . '<br>';
$products_image_match = ereg_replace($products_image_extension, '', $products_image_match) . '_';
$products_image_base = $products_image_match;
}

$products_image_directory = ereg_replace($products_image, '', substr($products_image, strrpos($products_image, '/')));
if ($products_image_directory != '') {
$products_image_directory = DIR_WS_IMAGES . ereg_replace($products_image_directory, '', $products_image) . "/";
} else {
$products_image_directory = DIR_WS_IMAGES;
}

// Check for additional matching images
$file_extension = $products_image_extension;
$products_image_match_array = array();
if ($dir = @dir($products_image_directory)) {
while ($file = $dir->read()) {
if (!is_dir($products_image_directory . $file)) {
if (substr($file, strrpos($file, '.')) == $file_extension) {
// if(preg_match("/" . $products_image_match . "/i", $file) == '1') {
if(preg_match("/" . $products_image_base . "/i", $file) == '1') {
if ($file != $products_image) {
if ($products_image_base . ereg_replace($products_image_base, '', $file) == $file) {
// echo 'I AM A MATCH ' . $file . '<br>';
$images_array[] = $file;
} else {
// echo 'I AM NOT A MATCH ' . $file . '<br>';
}
}
}
}
}
}
if (sizeof($images_array)) {
sort($images_array);
}
$dir->close();
}
}

// Build output based on images found
$num_images = sizeof($images_array);
$list_box_contents = '';
$title = '';

if ($num_images) {
$row = 0;
$col = 0;
if ($num_images < IMAGES_AUTO_ADDED || IMAGES_AUTO_ADDED == 0 ) {
$col_width = floor(100/$num_images);
} else {
$col_width = floor(100/IMAGES_AUTO_ADDED);
}

for ($i=0, $n=$num_images; $i<$n; $i++) {
$file = $images_array[$i];
$products_image_large = ereg_replace(DIR_WS_IMAGES, DIR_WS_IMAGES . 'large/', $products_image_directory) . ereg_replace($products_image_extension, '', $file) . IMAGE_SUFFIX_LARGE . $products_image_extension;
$flag_has_large = file_exists($products_image_large);
$products_image_large = ($flag_has_large ? $products_image_large : $products_image_directory . $file);
$flag_display_large = (IMAGE_ADDITIONAL_DISPLAY_LINK_EVEN_WHEN_NO_LARGE == 'Yes' || $flag_has_large);
$base_image = $products_image_directory . $file;
$thumb_slashes = zen_image($base_image, addslashes($products_name), 125, 200);
$thumb_regular = zen_image($base_image, $products_name, 125, 200);

/* bof greybox 1: greybox for zencart v1.00 by bigjoed 25 NOV 2007 */
$script_link = '<a href="' . $products_image_large . '" rel="gb_imageset[mygallery]" title="' . $products_name . '">' . zen_image($base_image, addslashes($products_name), MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT) . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>';
/* eof greybox 1: greybox for zencart v1.00 by bigjoed 25 NOV 2007 */


// $alternate_link = '<a href="' . $products_image_large . '" onclick="javascriptopupWindow(\''. $large_link . '\') return false;" title="' . $products_name . '" target="_blank">' . $thumb_regular . '<br />' . TEXT_CLICK_TO_ENLARGE . '</a>';

$link = $script_link . "\n " . $noscript_link;
// $link = $alternate_link;

// List Box array generation:
$list_box_contents[$row][$col] = array('params' => 'class="additionalImages centeredContent back"' . ' ' . 'style="width:' . $col_width . '%;"',
'text' => "\n " . $link);
$col ++;
if ($col > (IMAGES_AUTO_ADDED -1)) {
$col = 0;
$row ++;
}
} // end for loop
} // endif

?>

Tpl_product_info_display.php:

<?php
/**
* Page Template
*
* Loaded automatically by index.php?main_page=product_info.<br />
* Displays details of a typical product
*
* @package templateSystem
* @copyright Copyright 2003-2006 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_product_info_display.php 16242 2010-05-08 16:05:40Z ajeh $
*/
//require(DIR_WS_MODULES . '/debug_blocks/product_info_prices.php');
?>
<div class="centerColumn" id="productGeneral">

<!--bof Form start-->
<?php echo zen_draw_form('cart_quantity', zen_href_link(zen_get_info_page($_GET['products_id']), zen_get_all_get_params(array('action')) . 'action=add_product', $request_type), 'post', 'enctype="multipart/form-data"') . "\n"; ?>
<!--eof Form start-->

<?php if ($messageStack->size('product_info') > 0) echo $messageStack->output('product_info'); ?>

<!--bof Category Icon -->
<?php if ($module_show_categories != 0) {?>
<?php
/**
* display the category icons
*/
require($template->get_template_dir('/tpl_modules_category_icon_display.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_category_icon_display.php'); ?>
<?php } ?>
<!--eof Category Icon -->

<!--bof Prev/Next top position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 1 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
* display the product previous/next helper
*/
require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next top position-->

<!--bof Main Product Image -->
<?php
if (zen_not_null($products_image)) {
?>
<?php
/**
* display the main product image
*/
require($template->get_template_dir('/tpl_modules_main_product_image.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_main_product_image.php'); ?>
<?php
}
?>
<!--eof Main Product Image-->

<!--bof Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->



<!--bof Product Price block -->
<h2 id="productPrices" class="productGeneral">
<?php
// base price
if ($show_onetime_charges_description == 'true') {
$one_time = '<span >' . TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION . '</span><br />';
} else {
$one_time = '';
}
echo $one_time . ((zen_has_product_attributes_values((int)$_GET['products_id']) and $flag_show_product_info_starting_at == 1) ? TEXT_BASE_PRICE : '') . zen_get_products_display_price((int)$_GET['products_id']);
?></h2>
<!--eof Product Price block -->

<!--bof Additional Product Images -->

<?php

/**

* display the products additional images

*/

require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?>

<!--eof Additional Product Images -->

<!--bof free ship icon -->
<?php if(zen_get_product_is_always_free_shipping($products_id_current) && $flag_show_product_info_free_shipping) { ?>
<div id="freeShippingIcon"><?php echo TEXT_PRODUCT_FREE_SHIPPING_ICON; ?></div>
<?php } ?>
<!--eof free ship icon -->

<!--bof Product description -->
<?php if ($products_description != '') { ?>
<div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div>
<?php } ?>
<!--eof Product description -->
<br class="clearBoth" />

<!--bof Add to Cart Box -->
<?php
if (CUSTOMERS_APPROVAL == 3 and TEXT_LOGIN_FOR_PRICE_BUTTON_REPLACE_SHOWROOM == '') {
// do nothing
} else {
?>
<?php
$display_qty = (($flag_show_product_info_in_cart_qty == 1 and $_SESSION['cart']->in_cart($_GET['products_id'])) ? '<p>' . PRODUCTS_ORDER_QTY_TEXT_IN_CART . $_SESSION['cart']->get_quantity($_GET['products_id']) . '</p>' : '');
if ($products_qty_box_status == 0 or $products_quantity_order_max== 1) {
// hide the quantity box and default to 1
$the_button = '<input type="hidden" name="cart_quantity" value="1" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
} else {
// show the quantity box
$the_button = PRODUCTS_ORDER_QTY_TEXT . '<input type="text" name="cart_quantity" value="' . (zen_get_buy_now_qty($_GET['products_id'])) . '" maxlength="6" size="4" /><br />' . zen_get_products_quantity_min_units_display((int)$_GET['products_id']) . '<br />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
}
$display_button = zen_get_buy_now_button($_GET['products_id'], $the_button);
?>
<?php if ($display_qty != '' or $display_button != '') { ?>
<div id="cartAdd">
<?php
echo $display_qty;
echo $display_button;
?>

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4cd1ec2b08cdcb12"></script>
<!-- AddThis Button END -->

</div>
<?php } // display qty and button ?>
<?php } // CUSTOMERS_APPROVAL == 3 ?>
<!--eof Add to Cart Box-->



<!--bof Product details list -->
<?php if ( (($flag_show_product_info_model == 1 and $products_model != '') or ($flag_show_product_info_weight == 1 and $products_weight !=0) or ($flag_show_product_info_quantity == 1) or ($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name))) ) { ?>
<ul id="productDetailsList" class="floatingBox back">
<?php echo (($flag_show_product_info_model == 1 and $products_model !='') ? '<li>' . TEXT_PRODUCT_MODEL . $products_model . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_weight == 1 and $products_weight !=0) ? '<li>' . TEXT_PRODUCT_WEIGHT . $products_weight . TEXT_PRODUCT_WEIGHT_UNIT . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_quantity == 1) ? '<li>' . $products_quantity . TEXT_PRODUCT_QUANTITY . '</li>' : '') . "\n"; ?>
<?php echo (($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name)) ? '<li>' . TEXT_PRODUCT_MANUFACTURER . $manufacturers_name . '</li>' : '') . "\n"; ?>
</ul>
<br class="clearBoth" />
<?php
}
?>
<!--eof Product details list -->

<!--bof Attributes Module -->
<?php
if ($pr_attr->fields['total'] > 0) {
?>
<?php
/**
* display the product atributes
*/
require($template->get_template_dir('/tpl_modules_attributes.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_attributes.php'); ?>
<?php
}
?>
<!--eof Attributes Module -->

<!--bof Quantity Discounts table -->
<?php
if ($products_discount_type != 0) { ?>
<?php
/**
* display the products quantity discount
*/
require($template->get_template_dir('/tpl_modules_products_quantity_discounts.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_products_quantity_discounts.php'); ?>
<?php
}
?>
<!--eof Quantity Discounts table -->



<!--bof Prev/Next bottom position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 2 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
* display the product previous/next helper
*/
require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next bottom position -->

<hr id="product-divider" />

<!--bof Tell a Friend button -->
<?php
if ($flag_show_product_info_tell_a_friend == 1) { ?>
<div id="productTellFriendLink" class="buttonRow forward"><?php echo ($flag_show_product_info_tell_a_friend == 1 ? '<a href="' . zen_href_link(FILENAME_TELL_A_FRIEND, 'products_id=' . $_GET['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_TELLAFRIEND, BUTTON_TELLAFRIEND_ALT) . '</a>' : ''); ?></div>
<?php
}
?>
<!--eof Tell a Friend button -->

<!--bof Reviews button and count-->
<?php
if ($flag_show_product_info_reviews == 1) {
// if more than 0 reviews, then show reviews button; otherwise, show the "write review" button
if ($reviews->fields['count'] > 0 ) { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS, zen_get_all_get_params()) . '">' . zen_image_button(BUTTON_IMAGE_REVIEWS, BUTTON_REVIEWS_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<p class="reviewCount"><?php echo ($flag_show_product_info_reviews_count == 1 ? TEXT_CURRENT_REVIEWS . ' ' . $reviews->fields['count'] : ''); ?></p>
<?php } else { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS_WRITE, zen_get_all_get_params(array())) . '">' . zen_image_button(BUTTON_IMAGE_WRITE_REVIEW, BUTTON_WRITE_REVIEW_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<?php
}
}
?>
<!--eof Reviews button and count -->


<!--bof Product date added/available-->
<?php
if ($products_date_available > date('Y-m-d H:i:s')) {
if ($flag_show_product_info_date_available == 1) {
?>
<p id="productDateAvailable" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_AVAILABLE, zen_date_long($products_date_available)); ?></p>
<?php
}
} else {
if ($flag_show_product_info_date_added == 1) {
?>
<p id="productDateAdded" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_ADDED, zen_date_long($products_date_added)); ?></p>
<?php
} // $flag_show_product_info_date_added
}
?>
<!--eof Product date added/available -->

<!--bof Product URL -->
<?php
if (zen_not_null($products_url)) {
if ($flag_show_product_info_url == 1) {
?>
<p id="productInfoLink" class="productGeneral centeredContent"><?php echo sprintf(TEXT_MORE_INFORMATION, zen_href_link(FILENAME_REDIRECT, 'action=url&goto=' . urlencode($products_url), 'NONSSL', true, false)); ?></p>
<?php
} // $flag_show_product_info_url
}
?>
<!--eof Product URL -->

<!--bof also purchased products module-->
<?php require($template->get_template_dir('tpl_modules_also_purchased_products.php', DIR_WS_TEMPLATE, $current_page_base,'templates'). '/' . 'tpl_modules_also_purchased_products.php');?>
<!--eof also purchased products module-->

<!--bof Form close-->
</form>
<!--bof Form close-->
</div>

[dgent]

This isnt really the right way of doing it, as the admin settings should control the sizes, but if you add this to your stylesheet it will fix it.

.additionalImages img {
height: 10%;
width: 10%;
}

[alepia]

This isnt really the right way of doing it, as the admin settings should control the sizes, but if you add this to your stylesheet it will fix it.

.additionalImages img {
height: 10%;
width: 10%;
}

This did the job!
Now I need to work out how to place the images directly beneath price!

[alepia]

https://bellissima-scarves.co.uk/ind...2fuf204ttdm9j3

As you can see on the website there is a big whitespace between price and the additional images. What I would like to do is to move upward the additional images!