scottdev Posted March 11, 2004 Share Posted March 11, 2004 I want to revise the code that deals with product images to automatically add a 1 pixel border around the image versus doing it manually in photoshop. Any ideas? Link to comment Share on other sites More sharing options...
Stephan Gebbers Posted March 11, 2004 Share Posted March 11, 2004 maybe you want to try this css solution? but backup first! :) in ../catalog/includes/funktions/html_output.php right below the Image Wrapper Function // The HTML image wrapper function ?function tep_image($src, $alt = '', $width = '', $height = '', $parameters = '') { ? ?if ( (($src == '') || ($src == DIR_WS_IMAGES)) && (IMAGE_REQUIRED == 'false') ) { ? ? ?return false; ? ?} add // Zebra001 added $borderforimage = 'false'; if (($width == SMALL_IMAGE_WIDTH) && ($height == SMALL_IMAGE_HEIGHT)) $borderforimage = 'true'; //end Zebra001 added right after ? ?if (tep_not_null($alt)) { ? ? ?$image .= ' title=" ' . tep_parse_input_field_data($alt, array('"' => '"')) . ' "'; add // Zebra001 added if ($borderforimage == 'true') $image .= ' class=fotgal '; // end Zebra001 added so it should look like this at the end //// // The HTML image wrapper function ?function tep_image($src, $alt = '', $width = '', $height = '', $parameters = '') { ? ?if ( (($src == '') || ($src == DIR_WS_IMAGES)) && (IMAGE_REQUIRED == 'false') ) { ? ? ?return false; ? ?} // Zebra001 added $borderforimage = 'false'; if (($width == SMALL_IMAGE_WIDTH) && ($height == SMALL_IMAGE_HEIGHT)) $borderforimage = 'true'; //end Zebra001 added // alt is added to the img tag even if it is null to prevent browsers from outputting // the image filename as default ? ?$image = '<img src="' . tep_parse_input_field_data($src, array('"' => '"')) . '" border="0" alt="' . tep_parse_input_field_data($alt, array('"' => '"')) . '"'; ? ?if (tep_not_null($alt)) { ? ? ?$image .= ' title=" ' . tep_parse_input_field_data($alt, array('"' => '"')) . ' "'; // Zebra001 added if ($borderforimage == 'true') $image .= ' class=fotgal '; // end Zebra001 added ? ?} finally add this to the end of your osc stylesheet.css .fotgal {border:1px; border-thickness: 1px; border-color: #000000; border-style: solid; } A:hover .fotgal {border:1px; border-thickness: 1px; border-color: #FFC0C0; border-style: solid; } A:active .fotgal {border:1px; border-thickness: 1px; border-color: #E3E4FF; border-style: solid; } hope it works for you. Stephan Link to comment Share on other sites More sharing options...
scottdev Posted March 11, 2004 Author Share Posted March 11, 2004 Our code is a lot diffrent. I'm using MS@ loaded 6! <?php /* $Id: html_output.php,v 1.1.1.1 2003/09/18 19:05:10 wilt Exp $ osCommerce, Open Source E-Commerce Solutions http://www.oscommerce.com Copyright © 2003 osCommerce Released under the GNU General Public License */ //// // The HTML href link wrapper function function tep_href_link($page = '', $parameters = '', $connection = 'NONSSL', $add_session_id = true, $search_engine_safe = true) { global $request_type, $session_started, $SID; if (!tep_not_null($page)) { die('</td></tr></table></td></tr></table><br><br><font color="#ff0000"><b>Error!</b></font><br><br><b>Unable to determine the page link!<br><br>'); } if ($connection == 'NONSSL') { $link = HTTP_SERVER . DIR_WS_HTTP_CATALOG; } elseif ($connection == 'SSL') { if (ENABLE_SSL == true) { $link = HTTPS_SERVER . DIR_WS_HTTPS_CATALOG; } else { $link = HTTP_SERVER . DIR_WS_HTTP_CATALOG; } } else { die('</td></tr></table></td></tr></table><br><br><font color="#ff0000"><b>Error!</b></font><br><br><b>Unable to determine connection method on a link!<br><br>Known methods: NONSSL SSL</b><br><br>'); } if (tep_not_null($parameters)) { $link .= $page . '?' . tep_output_string($parameters); $separator = '&'; } else { $link .= $page; $separator = '?'; } while ( (substr($link, -1) == '&') || (substr($link, -1) == '?') ) $link = substr($link, 0, -1); // Add the session ID when moving from different HTTP and HTTPS servers, or when SID is defined if ( ($add_session_id == true) && ($session_started == true) && (SESSION_FORCE_COOKIE_USE == 'False') ) { if (tep_not_null($SID)) { $_sid = $SID; } elseif ( ( ($request_type == 'NONSSL') && ($connection == 'SSL') && (ENABLE_SSL == true) ) || ( ($request_type == 'SSL') && ($connection == 'NONSSL') ) ) { if (HTTP_COOKIE_DOMAIN != HTTPS_COOKIE_DOMAIN) { $_sid = tep_session_name() . '=' . tep_session_id(); } } } if ( (SEARCH_ENGINE_FRIENDLY_URLS == 'true') && ($search_engine_safe == true) ) { while (strstr($link, '&&')) $link = str_replace('&&', '&', $link); $link = str_replace('?', '/', $link); $link = str_replace('&', '/', $link); $link = str_replace('=', '/', $link); $separator = '?'; } if (isset($_sid)) { $link .= $separator . $_sid; } return $link; } //// // The HTML image wrapper function function tep_image($src, $alt = '', $width = '', $height = '', $parameters = '') { if ( (empty($src) || ($src == DIR_WS_IMAGES)) && (IMAGE_REQUIRED == 'false') ) { return false; } // alt is added to the img tag even if it is null to prevent browsers from outputting // the image filename as default $image = '<img src="' . tep_output_string($src) . '" border="0" alt="' . tep_output_string($alt) . '"'; if (tep_not_null($alt)) { $image .= ' title=" ' . tep_output_string($alt) . ' "'; } if ( (CONFIG_CALCULATE_IMAGE_SIZE == 'true') && (empty($width) || empty($height)) ) { if ($image_size = @getimagesize($src)) { if (empty($width) && tep_not_null($height)) { $ratio = $height / $image_size[1]; $width = $image_size[0] * $ratio; } elseif (tep_not_null($width) && empty($height)) { $ratio = $width / $image_size[0]; $height = $image_size[1] * $ratio; } elseif (empty($width) && empty($height)) { $width = $image_size[0]; $height = $image_size[1]; } } elseif (IMAGE_REQUIRED == 'false') { return false; } } if (tep_not_null($width) && tep_not_null($height)) { $image .= ' width="' . tep_output_string($width) . '" height="' . tep_output_string($height) . '"'; } if (tep_not_null($parameters)) $image .= ' ' . $parameters; $image .= '>'; return $image; } //// // The HTML form submit button wrapper function // Outputs a button in the selected language function tep_image_submit($image, $alt = '', $parameters = '') { global $language; $image_submit = '<input type="image" src="' . tep_output_string(DIR_WS_LANGUAGES . $language . '/images/buttons/' . $image) . '" border="0" alt="' . tep_output_string($alt) . '"'; if (tep_not_null($alt)) $image_submit .= ' title=" ' . tep_output_string($alt) . ' "'; if (tep_not_null($parameters)) $image_submit .= ' ' . $parameters; $image_submit .= '>'; return $image_submit; } //// // Output a function button in the selected language function tep_image_button($image, $alt = '', $parameters = '') { global $language; return tep_image(DIR_WS_LANGUAGES . $language . '/images/buttons/' . $image, $alt, '', '', $parameters); } //// // Output a separator either through whitespace, or with an image function tep_draw_separator($image = 'pixel_black.gif', $width = '100%', $height = '1') { return tep_image(DIR_WS_IMAGES . $image, '', $width, $height); } //// // Output a form function tep_draw_form($name, $action, $method = 'post', $parameters = '') { $form = '<form name="' . tep_output_string($name) . '" action="' . tep_output_string($action) . '" method="' . tep_output_string($method) . '"'; if (tep_not_null($parameters)) $form .= ' ' . $parameters; $form .= '>'; return $form; } //// // Output a form input field function tep_draw_input_field($name, $value = '', $parameters = '', $type = 'text', $reinsert_value = true) { $field = '<input type="' . tep_output_string($type) . '" name="' . tep_output_string($name) . '"'; if ( (isset($GLOBALS[$name])) && ($reinsert_value == true) ) { $field .= ' value="' . tep_output_string(stripslashes($GLOBALS[$name])) . '"'; } elseif (tep_not_null($value)) { $field .= ' value="' . tep_output_string($value) . '"'; } if (tep_not_null($parameters)) $field .= ' ' . $parameters; $field .= '>'; return $field; } //// // Output a form password field function tep_draw_password_field($name, $value = '', $parameters = 'maxlength="40"') { return tep_draw_input_field($name, $value, $parameters, 'password', false); } //// // Output a selection field - alias function for tep_draw_checkbox_field() and tep_draw_radio_field() function tep_draw_selection_field($name, $type, $value = '', $checked = false, $parameters = '') { $selection = '<input type="' . tep_output_string($type) . '" name="' . tep_output_string($name) . '"'; if (tep_not_null($value)) $selection .= ' value="' . tep_output_string($value) . '"'; if ( ($checked == true) || ( isset($GLOBALS[$name]) && is_string($GLOBALS[$name]) && ( ($GLOBALS[$name] == 'on') || (isset($value) && (stripslashes($GLOBALS[$name]) == $value)) ) ) ) { $selection .= ' CHECKED'; } if (tep_not_null($parameters)) $selection .= ' ' . $parameters; $selection .= '>'; return $selection; } //// // Output a form checkbox field function tep_draw_checkbox_field($name, $value = '', $checked = false, $parameters = '') { return tep_draw_selection_field($name, 'checkbox', $value, $checked, $parameters); } //// // Output a form radio field function tep_draw_radio_field($name, $value = '', $checked = false, $parameters = '') { return tep_draw_selection_field($name, 'radio', $value, $checked, $parameters); } //// // Output a form textarea field function tep_draw_textarea_field($name, $wrap, $width, $height, $text = '', $parameters = '', $reinsert_value = true) { $field = '<textarea name="' . tep_output_string($name) . '" wrap="' . tep_output_string($wrap) . '" cols="' . tep_output_string($width) . '" rows="' . tep_output_string($height) . '"'; if (tep_not_null($parameters)) $field .= ' ' . $parameters; $field .= '>'; if ( (isset($GLOBALS[$name])) && ($reinsert_value == true) ) { $field .= stripslashes($GLOBALS[$name]); } elseif (tep_not_null($text)) { $field .= $text; } $field .= '</textarea>'; return $field; } //// // Output a form hidden field function tep_draw_hidden_field($name, $value = '', $parameters = '') { $field = '<input type="hidden" name="' . tep_output_string($name) . '"'; if (tep_not_null($value)) { $field .= ' value="' . tep_output_string($value) . '"'; } elseif (isset($GLOBALS[$name])) { $field .= ' value="' . tep_output_string(stripslashes($GLOBALS[$name])) . '"'; } if (tep_not_null($parameters)) $field .= ' ' . $parameters; $field .= '>'; return $field; } //// // Hide form elements function tep_hide_session_id() { global $session_started, $SID; if (($session_started == true) && tep_not_null($SID)) { return tep_draw_hidden_field(tep_session_name(), tep_session_id()); } } //// // Output a form pull down menu function tep_draw_pull_down_menu($name, $values, $default = '', $parameters = '', $required = false) { $field = '<select name="' . tep_output_string($name) . '"'; if (tep_not_null($parameters)) $field .= ' ' . $parameters; $field .= '>'; if (empty($default) && isset($GLOBALS[$name])) $default = stripslashes($GLOBALS[$name]); for ($i=0, $n=sizeof($values); $i<$n; $i++) { $field .= '<option value="' . tep_output_string($values[$i]['id']) . '"'; if ($default == $values[$i]['id']) { $field .= ' SELECTED'; } $field .= '>' . tep_output_string($values[$i]['text'], array('"' => '"', '\'' => ''', '<' => '<', '>' => '>')) . '</option>'; } $field .= '</select>'; if ($required == true) $field .= TEXT_FIELD_REQUIRED; return $field; } //// // Creates a pull-down list of countries function tep_get_country_list($name, $selected = '', $parameters = '') { $countries_array = array(array('id' => '', 'text' => PULL_DOWN_DEFAULT)); $countries = tep_get_countries(); for ($i=0, $n=sizeof($countries); $i<$n; $i++) { $countries_array[] = array('id' => $countries[$i]['countries_id'], 'text' => $countries[$i]['countries_name']); } return tep_draw_pull_down_menu($name, $countries_array, $selected, $parameters); } ?> Link to comment Share on other sites More sharing options...
Jayman2 Posted March 19, 2004 Share Posted March 19, 2004 Hi, I used Stephan's code to put a border around my image displays. It works just fine, but I have one problem. The border is the same size around all of my images. I have some that are narrow and the border does not wrap itself around them. All borders are the same size. Is there a way that I can make the borders fit perfectly around different size images? Thanks in advance. Link to comment Share on other sites More sharing options...
dukar Posted March 31, 2004 Share Posted March 31, 2004 This section of my html_output.php code (see below) is also much different - my version: osCommerce 2.2 Milestone 2, Feb. 2004 download I want this image border feature, but am wondering if there are any other thoughts out there about accomplishing this as the discrepencies in this thread above seem problematic. - Regards B) ////// The HTML image wrapper function function tep_image($src, $alt = '', $width = '', $height = '', $parameters = '') { if ( (empty($src) || ($src == DIR_WS_IMAGES)) && (IMAGE_REQUIRED == 'false') ) { return false; } // alt is added to the img tag even if it is null to prevent browsers from outputting // the image filename as default $image = '<img src="' . tep_output_string($src) . '" border="0" alt="' . tep_output_string($alt) . '"'; if (tep_not_null($alt)) { $image .= ' title=" ' . tep_output_string($alt) . ' "'; } if ( (CONFIG_CALCULATE_IMAGE_SIZE == 'true') && (empty($width) || empty($height)) ) { if ($image_size = @getimagesize($src)) { if (empty($width) && tep_not_null($height)) { $ratio = $height / $image_size[1]; $width = $image_size[0] * $ratio; } elseif (tep_not_null($width) && empty($height)) { $ratio = $width / $image_size[0]; $height = $image_size[1] * $ratio; } elseif (empty($width) && empty($height)) { $width = $image_size[0]; $height = $image_size[1]; } } elseif (IMAGE_REQUIRED == 'false') { return false; } } Link to comment Share on other sites More sharing options...
westkoast Posted April 1, 2004 Share Posted April 1, 2004 You guys are making this WAY to hard, and if the image is a link, the link will turn purple which sucks. What I do is put a little table with a black background around the image. <table width="20" border="0" cellspacing="0" cellpadding="1"><tr><td bgcolor="black"> // Image code goes here </td></tr></table> The above will put a perfect 1pixel around the image in ALL browsers. Some browsers will not keep your CCS border black, and it will look blue, or purple once it has been clicked. I need to read the rules more often... Link to comment Share on other sites More sharing options...
dukar Posted April 1, 2004 Share Posted April 1, 2004 Any smart ideas out there that address this image border issue? Link to comment Share on other sites More sharing options...
241 Posted April 1, 2004 Share Posted April 1, 2004 strange I thought that you werent allowed to mention LOADED on this forum I have had several posts removed just for containing the word LOADED in the content of the post even though one of them was just to ask if the person was using a LOADED version or not, it turned out that they were not using a LOADED version, however the post was removed any way just for having mentioned LOADED in the text one time and it was not even a LOADED question, so maybe you guys can explain how it is that you can freely discuss about a LOADED version without a peep from a moderator on the subject of LOADED and how not to mention LOADED No longer giving free advice. Please place deposit in meter slot provided. Individual: [=] SME: [==] Corporation: [===] If deposit does not fit one of the slots provided then you are asking too much! Is your Osc dated try Phoenix raising oscommerce from the ashes. Link to comment Share on other sites More sharing options...
burt Posted April 1, 2004 Share Posted April 1, 2004 The easiest (and best) way to do this is with a small piece of .css, thus: In stylesheet.css: .outline { border: 1px solid black; } Then in product_info.php you change from this: tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') to this: tep_image(DIR_WS_IMAGES . $product_info['products_image'], addslashes($product_info['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5" class="outline"') and from this: tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5"') to this: tep_image(DIR_WS_IMAGES . $product_info['products_image'], $product_info['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'hspace="5" vspace="5" class="outline"') Link to comment Share on other sites More sharing options...
Jayman2 Posted April 1, 2004 Share Posted April 1, 2004 Someone had posted the code in a message on the forum sometime ago. It was before they upgraded to this new forum software. I had used it on a store that I was working on. I wish I still had the code. I don't know what code I added to get this effect, so I can't even copy it and share it. When the cursor passes over an image the border highlights. It wraps around each image perfectly. If anyone has any ideas, let me know. Here is a capture of how is looks. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.