Jump to content
Sign in to follow this  
DenominatorX

Request: Background Image Changer via Admin Panel

Recommended Posts

I would like to have a contribution that allows me to set a different background through the admin panel for marketing/advertising purposes. I would like to be able to change which background is in use, or have the option to load a random background from a list, each time the page loads. This doesn't seem to hard.. .basically, the Stylesheet would need to call a variable - and the variable could be set via the admin panel...

 

is this possible, and if so... does anyone know how to create one? I think it would be a great idea.

Share this post


Link to post
Share on other sites

This what you had in mind? Tested with 2.2rc2a. YMMV

 

Before you start; BACKUP, BACKUP, BACKUP. Did I mention that you should keep copies of your current production files nearby with descriptive filenames?

 

Create directory (eg. catalog/images/backgrounds).

Upload background images to directory.

 

Add definition in includes/configure.php: define('DIR_WS_BGIMAGES', DIR_WS_IMAGES . 'backgrounds/');

 

Add definition in admin/includes/configure.php: define('DIR_FS_BGIMAGES', DIR_FS_CATALOG . DIR_WS_IMAGES . 'backgrounds/');

 

Run SQL statements:

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Display Random Background Image', 'RANDOM_BG', 'false', 'Display a random image for the background, true. Pick a background image, false.', '1', '25','tep_cfg_select_option(array(\'true\', \'false\'),', now());

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Choose Background Image', 'BACKGROUND_IMAGE', 'store_logo.png', 'Choose an image for the background', '1', '26', 'tep_cfg_pull_down_filename_list(', now());

 

Place this code before the location where you wish to call the image, removing your line with the html tag and placing it within the php echo statement:

<?php
 if (RANDOM_BG == 'true') {
$files_array = tep_get_bgimage_filenames();
$rand = array_rand($files_array);
$bg_image = $files_array[$rand];
 } else {
$bg_image = BACKGROUND_IMAGE;
 }

echo '<table (or tr or td or div) background="' . DIR_WS_BGIMAGES . $bg_image . '" the_rest_of_your_tag_parameters">';

?>

At the end of includes/functions/general.php, add before the closing php tag:

////
// Background image functions
// added by dmn - 04/21/08 Get a directory listing
 function tep_get_bgimage_filenames() {
$files_array = array();
if ($handle = opendir(DIR_FS_BGIMAGES)) {
  while (false !== ($file = readdir($handle))) {
	if (preg_match('/\.(png|gif|jpg)$/i', $file)) {
	  array_push($files_array, $file);
	}
  }
  closedir($handle);
}
return $files_array;
 }

At the end of admin/includes/functions/general.php, add before the closing php tag:

////
// Background image functions
// added by dmn - 04/21/08 Get a directory listing
 function tep_get_bgimage_filenames() {
$files_array = array();
if ($handle = opendir(DIR_FS_BGIMAGES)) {
  while (false !== ($file = readdir($handle))) {
	if (preg_match('/\.(png|gif|jpg)$/i', $file)) {
	//if ($file != "." && $file != "..") {
	  array_push($files_array, $file);
	}
  }
  closedir($handle);
}
return $files_array;
 }

// added by dmn - 04/21/08 Alias to output and display the listing
 function tep_cfg_pull_down_filename_list() {
return tep_draw_pull_down_file_menu('configuration_value', tep_get_bgimage_filenames(), BACKGROUND_IMAGE);
 }

At the end of includes/functions/html_output.php, add before the closing php tag:

////
// Background image functions
// added by dmn - 04/22/08 Generate another form pull down menu
 function tep_draw_pull_down_file_menu($name, $values, $default = '', $parameters = '', $required = false) {
global $HTTP_GET_VARS, $HTTP_POST_VARS;

$field = '<select name="' . tep_output_string($name) . '"';

if (tep_not_null($parameters)) $field .= ' ' . $parameters;

$field .= '>';

if (empty($default) && ( (isset($HTTP_GET_VARS[$name]) && is_string($HTTP_GET_VARS[$name])) || (isset($HTTP_POST_VARS[$name]) && is_string($HTTP_POST_VARS[$name])) ) ) {
  if (isset($HTTP_GET_VARS[$name]) && is_string($HTTP_GET_VARS[$name])) {
	$default = stripslashes($HTTP_GET_VARS[$name]);
  } elseif (isset($HTTP_POST_VARS[$name]) && is_string($HTTP_POST_VARS[$name])) {
	$default = stripslashes($HTTP_POST_VARS[$name]);
  }
}

for ($i=0, $n=sizeof($values); $i<$n; $i++) {
  $field .= '<option value="' . tep_output_string($values[$i]) . '"';
  if ($default == $values[$i]) {
	$field .= ' SELECTED';
  }

  $field .= '>' . tep_output_string($values[$i], array('"' => '"', '\'' => ''', '<' => '<', '>' => '>')) . '</option>';
}
$field .= '</select>';

if ($required == true) $field .= TEXT_FIELD_REQUIRED;

return $field;
 }

Configure your two new items in admin Configuration -> My Store

 

Enjoy

Edited by dmnalven

For ALL problems, please review this link first -> osCommerce Knowledge Base

Share this post


Link to post
Share on other sites

Corrected and tweaked install instructions, with help from DenominatorX.

 

Tested with 2.2rc2a. YMMV

 

Before you start; BACKUP, BACKUP, BACKUP. Did I mention that you should keep copies of your current production files nearby with descriptive filenames?

 

Create directory (eg. catalog/images/backgrounds).

Upload background images to directory.

 

Add definitions in includes/configure.php:

// background image randomizer - 05/16/08 - Defines

define('DIR_WS_BGIMAGES', DIR_WS_IMAGES . 'backgrounds/');

define('DIR_FS_BGIMAGES', DIR_FS_CATALOG . DIR_WS_IMAGES . 'backgrounds/');

 

Add definition in admin/includes/configure.php:

// background image randomizer - 05/16/08 - Defines

define('DIR_FS_BGIMAGES', DIR_FS_CATALOG . DIR_WS_IMAGES . 'backgrounds/');

 

Run SQL statements:

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Display Random Background Image', 'RANDOM_BG', 'false', 'Display a random image for the background, true. Pick a background image, false.', '1', '925','tep_cfg_select_option(array(\'true\', \'false\'),', now());

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Choose Background Image', 'BACKGROUND_IMAGE', 'store_logo.png', 'Choose an image for the background', '1', '926', 'tep_cfg_pull_down_filename_list(', now());

 

Place this code before the location where you wish to call the image, removing your line with the html tag and placing it within the php echo statement:

<?php
 ////
 // Background image functions
 // background image randomizer - 05/16/08 - Place image
 if (RANDOM_BG == 'true') {
$files_array = tep_get_bgimage_filenames();
$rand = array_rand($files_array);
$bg_image = $files_array[$rand];
 } else {
$bg_image = BACKGROUND_IMAGE;
 }

echo '<body (or table or tr or td or div) background="' . DIR_WS_BGIMAGES . $bg_image . '" the_rest_of_your_tag_parameters">';

?>

You may have to edit the html elements' style for the images to show.

 

At the end of includes/functions/general.php, add before the closing php tag:

////
// Background image functions
// background image randomizer - 05/16/08 - Get a directory listing
 function tep_get_bgimage_filenames() {
$files_array = array();
if ($handle = opendir(DIR_FS_BGIMAGES)) {
  while (false !== ($file = readdir($handle))) {
	if (preg_match('/\.(png|gif|jpg)$/i', $file)) {
	  array_push($files_array, $file);
	}
  }
  closedir($handle);
}
return $files_array;
 }

At the end of admin/includes/functions/general.php, add before the closing php tag:

////
// Background image functions
//  background image randomizer - 05/16/08 - Get a directory listing
 function tep_get_bgimage_filenames() {
$files_array = array();
if ($handle = opendir(DIR_FS_BGIMAGES)) {
  while (false !== ($file = readdir($handle))) {
	if (preg_match('/\.(png|gif|jpg)$/i', $file)) {
	  array_push($files_array, $file);
	}
  }
  closedir($handle);
}
return $files_array;
 }

// background image randomizer - 05/16/08 - Alias to output and display the listing
 function tep_cfg_pull_down_filename_list() {
return tep_draw_pull_down_file_menu('configuration_value', tep_get_bgimage_filenames(), BACKGROUND_IMAGE);
 }

At the end of admin/includes/functions/html_output.php, add before the closing php tag:

( REMOVE THE SPACE AFTER EACH OF THE FOUR '&' IN THE ARRAY DEFINITION BELOW - THIS WINDOW WILL NOT RENDER THE code CORRECTLY - IT WOULD SHOW THE REPRESENTATION OF THE CHARACTER INSTEAD )

////
// Background image functions
// background image randomizer - 05/16/08 - Generate another form pull down menu 
 function tep_draw_pull_down_file_menu($name, $values, $default = '', $parameters = '', $required = false) {
global $HTTP_GET_VARS, $HTTP_POST_VARS;

$field = '<select name="' . tep_output_string($name) . '"';

if (tep_not_null($parameters)) $field .= ' ' . $parameters;

$field .= '>';

if (empty($default) && ( (isset($HTTP_GET_VARS[$name]) && is_string($HTTP_GET_VARS[$name])) || (isset($HTTP_POST_VARS[$name]) && is_string($HTTP_POST_VARS[$name])) ) ) {
  if (isset($HTTP_GET_VARS[$name]) && is_string($HTTP_GET_VARS[$name])) {
	$default = stripslashes($HTTP_GET_VARS[$name]);
  } elseif (isset($HTTP_POST_VARS[$name]) && is_string($HTTP_POST_VARS[$name])) {
	$default = stripslashes($HTTP_POST_VARS[$name]);
  }
}

for ($i=0, $n=sizeof($values); $i<$n; $i++) {
  $field .= '<option value="' . tep_output_string($values[$i]) . '"';
  if ($default == $values[$i]) {
	$field .= ' SELECTED';
  }

  $field .= '>' . tep_output_string($values[$i], array('"' => '& quot;', '\'' => '& #039;', '<' => '& lt;', '>' => '& gt;')) . '</option>';
}
$field .= '</select>';

if ($required == true) $field .= TEXT_FIELD_REQUIRED;

return $field;
 }

Configure your two new items in admin Configuration -> My Store

 

Enjoy


For ALL problems, please review this link first -> osCommerce Knowledge Base

Share this post


Link to post
Share on other sites

Sorry this code

 

 

<?php

////

// Background image functions

// background image randomizer - 05/16/08 - Place image

if (RANDOM_BG == 'true') {

$files_array = tep_get_bgimage_filenames();

$rand = array_rand($files_array);

$bg_image = $files_array[$rand];

} else {

$bg_image = BACKGROUND_IMAGE;

}

 

echo '<body (or table or tr or td or div) background="' . DIR_WS_BGIMAGES . $bg_image . '" the_rest_of_your_tag_parameters">';

 

?>

Share this post


Link to post
Share on other sites

Hello,

 

Did modification to code, all credits goes to dmnalven.

 

Run SQL statements:

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, use_function, set_function, date_added) VALUES ('Background color', 'BG_COLOR', '#FFFFFF', 'Go to <a href="http://www.w3schools.com/cssref/css_colornames.asp" target="_blank"><font color="darkred">W3schools website</font></a> to pick a color.<br />Color must be in the format:<br />#FFFFFF', '1', '928','NULL', 'tep_cfg_textarea(', now());

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Repeat small image', 'BG_REPEAT', 'no-repeat', 'Repeat small image.', '1', '927','tep_cfg_select_option(array(\'repeat\', \'no-repeat\'),', now());

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Choose horizontal position of the image', 'BG_H_POSITION', 'none', 'Choose horizontal position of the image.', '1', '929','tep_cfg_select_option(array(\'none\', \'center\', \'left\', \'right\'),', now());

 

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, set_function, date_added) VALUES ('Choose vertical position of the image', 'BG_V_POSITION', 'none', 'Choose vertical position of the image.', '1', '930','tep_cfg_select_option(array(\'none\', \'center\', \'top\', \'bottom\'),', now());

 

Replace:

echo '<body (or table or tr or td or div) background="' . DIR_WS_BGIMAGES . $bg_image . '" the_rest_of_your_tag_parameters">';

 

with:

 

?>

<style type="text/css">

body {background:<?php echo BG_COLOR; ?> url(<?php echo DIR_WS_BGIMAGES . $bg_image ?>) <?php echo BG_REPEAT; ?> <?php if (BG_H_POSITION == 'none') { } else {echo BG_H_POSITION;} ?> <?php if (BG_V_POSITION == 'none') { } else {echo BG_V_POSITION;} ?>;}

</style>

 

Configure your 4 new items in admin Configuration -> My Store

 

Tested with 2.3

 

Enjoy

Edited by vlad36

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×