2334BS - Enhanced Contact Us

ArtcoInc · May 30, 2014

I am trying to adapt the Enhanced Contact Us add-on to 2334bs.

http://addons.oscommerce.com/info/8323

One of the things this add-on does is, if a customer has an account, and if they are logged into their account, when they use the Contact Us page, the module pre-populates the page with the user's name, email address, and optionally their phone number. In addition, the user can still edit their email address and phone number, but not their name.

My problem is a small cosmetic issue regarding layout:

If the user does not have an account (or is not logged into their account), the screen has a field for them to enter their name. This field is in line with the field title (in this case, "Full Name").

If the user *does* have an account, their name is displayed next to the field title, but is not in line with the title. It is slightly above where it should be:

There is also a small difference in the spacing between the Name and Email Address lines. I have confirmed this in IE, Firefox, and Chrome.

The relevant part of the code is:

<?php echo tep_draw_form('contact_us', tep_href_link(FILENAME_CONTACT_US, 'action=send'), 'post', 'class="form-horizontal"', true); ?>
<div class="contentContainer">
<div class="contentText">

 <p class="inputRequirement text-right"><?php echo FORM_REQUIRED_INFORMATION; ?></p>
 <div class="clearfix"></div>
 <div class="form-group has-feedback">
 <label for="inputFromName" class="control-label col-xs-3"><?php echo ENTRY_NAME; ?></label>
 <div class="col-xs-9">
	 <?php
		 echo (isset($account['customers_lastname']) ? $name . tep_draw_hidden_field('name',$name) : tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"'));
	 echo FORM_REQUIRED_INPUT;
	 ?>
 </div>
 </div>
 <div class="form-group has-feedback">
 <label for="inputFromEmail" class="control-label col-xs-3"><?php echo ENTRY_EMAIL; ?></label>
 <div class="col-xs-9">
	 <?php
	 echo tep_draw_input_field('email', $email, 'required aria-required="true" id="inputFromEmail" placeholder="' . ENTRY_EMAIL . '"');
	 echo FORM_REQUIRED_INPUT;
	 ?>
 </div>
 </div>

Any help would be appreciated! Thanks.

Malcolm

♥Tsimi · May 30, 2014

Installing the add-on now.....

♥Tsimi · May 31, 2014

Hi Malcolm

Could you please attach your contact_us.php here? Or just post the code?

ArtcoInc · May 31, 2014

<?php
/*
$Id$
osCommerce, Open Source E-Commerce Solutions
http://www.oscommerce.com
Copyright (c) 2010 osCommerce
Released under the GNU General Public License
*/
require('includes/application_top.php');
require(DIR_WS_LANGUAGES . $language . '/' . FILENAME_CONTACT_US);
if (isset($_GET['action']) && ($_GET['action'] == 'send') && isset($_POST['formid']) && ($_POST['formid'] == $sessiontoken)) {
$error = false;
$name = tep_db_prepare_input($_POST['name']);
$email_address = tep_db_prepare_input($_POST['email']);
$enquiry = tep_db_prepare_input($_POST['enquiry']);

// Begin addition - Enhanced Contact Us - 5-29-2014
$subject = tep_db_prepare_input($_POST['subject']);
$phone = tep_db_prepare_input($_POST['phone']);
$date = 'Date Sent: ' . date("d M Y H:i:s");
$orders_id = tep_not_null($_POST['orders_id']) ? $_POST['orders_id'] : false;
$xipaddress = $_SERVER["REMOTE_ADDR"];
$subject = $subject ? $subject : EMAIL_SUBJECT;
//$enquiry = preg_replace('/\r/','\', \'',$enquiry);
//$enquiry = preg_replace('/\(|\)/','\'',$enquiry);
//$_POST['enquiry'] = $result;

if (strlen($name) < ENTRY_LAST_NAME_MIN_LENGTH) {
 $error = true;
 $messageStack->add('contact', ENTRY_LAST_NAME_ERROR);
}
if (strlen($enquiry) < 8) {
 $error = true;
 $messageStack->add('contact', ENTRY_ERROR_ENQUIRY);
}
// End of Addition

if (!tep_validate_email($email_address)) {
 $error = true;
 $messageStack->add('contact', ENTRY_EMAIL_ADDRESS_CHECK_ERROR);
}
$actionRecorder = new actionRecorder('ar_contact_us', (tep_session_is_registered('customer_id') ? $customer_id : null), $name);
if (!$actionRecorder->canPerform()) {
 $error = true;
 $actionRecorder->record(false);
 $messageStack->add('contact', sprintf(ERROR_ACTION_RECORDER, (defined('MODULE_ACTION_RECORDER_CONTACT_US_EMAIL_MINUTES') ? (int)MODULE_ACTION_RECORDER_CONTACT_US_EMAIL_MINUTES : 15)));
}
if ($error == false) {
 $enquiry = MESSAGE_FROM . $name . "\n" . $date . "\n" . ($phone ? ENTRY_TELEPHONE_NUMBER . $phone . "\n" : '' ) . ($customer_id ? MAIL_CLIENT_ID . $customer_id . "\n" : '') . ($orders_id ? MAIL_ORDER_ID . $orders_id . "\n" : '') . "\n" . MAIL_IP . $xipaddress . '.' . "\n\n" . ENTRY_ENQUIRY . "\n" . $enquiry;
 tep_mail(STORE_OWNER, STORE_OWNER_EMAIL_ADDRESS, EMAIL_SUBJECT, $enquiry, $name, $email_address);
 $actionRecorder->record();
 tep_redirect(tep_href_link(FILENAME_CONTACT_US, 'action=success'));
}
}
$breadcrumb->add(NAVBAR_TITLE, tep_href_link(FILENAME_CONTACT_US));
require(DIR_WS_INCLUDES . 'template_top.php');

// Begin addition - Enhanced Contact Us - 5-29-2014
$account = array();$orders = array();$name = '';$email = '';$phone = '';
if (tep_session_is_registered('customer_id')) {
$account_query = tep_db_query("select customers_firstname, customers_lastname, customers_telephone, customers_id, customers_email_address from " . TABLE_CUSTOMERS . " where customers_id = '" . (int)$customer_id . "'");
$account = tep_db_fetch_array($account_query);
$name = $account['customers_firstname'].' '.$account['customers_lastname'] ;
$email = $account['customers_email_address'] ;
$phone = $account['customers_telephone'] ;
$history_query = tep_db_query("select orders_id, date_purchased from " . TABLE_ORDERS . " where customers_id = '" . (int)$customer_id . "' order by orders_id DESC");
$orders[0] = array('id' => '0', 'text' => ENTRY_ORDER_ID);
while ($history = tep_db_fetch_array($history_query)) {
 $orders[] = array('id' => $history['orders_id'], 'text' => $history['orders_id'] . ENTRY_ORDERED . tep_date_short($history['date_purchased']));
}
}
// End Addition
?>

<div class="page-header">
<h1><?php echo HEADING_TITLE; ?></h1>
</div>

<?php
if ($messageStack->size('contact') > 0) {
echo $messageStack->output('contact');
}
if (isset($HTTP_GET_VARS['action']) && ($HTTP_GET_VARS['action'] == 'success')) {
?>
<div class="contentContainer">
 <div class="contentText">
 <div class="alert alert-info"><?php echo TEXT_SUCCESS; ?></div>
 </div>
 <div class="pull-right">
 <?php echo tep_draw_button(IMAGE_BUTTON_CONTINUE, 'glyphicon-chevron-right', tep_href_link(FILENAME_DEFAULT)); ?>
 </div>
</div>
<?php
} else {
?>

<!-- Begin addition - Enhanced Contact Us - 5-29-2014 -->
<table>
<tr>
 <td class="main" >
 <b>
	 <?php echo (STORE_NAME); ?>
 </b><br />
 <?php echo nl2br(STORE_ADDRESS); ?><br /><br />
 <?php echo (OPENING_HOURS); ?>
 </td>
</tr>
</table>
<!-- End of Addition -->

<?php echo tep_draw_form('contact_us', tep_href_link(FILENAME_CONTACT_US, 'action=send'), 'post', 'class="form-horizontal"', true); ?>
<div class="contentContainer">
 <div class="contentText">

 <p class="inputRequirement text-right"><?php echo FORM_REQUIRED_INFORMATION; ?></p>
 <div class="clearfix"></div>
 <div class="form-group has-feedback">
	 <label for="inputFromName" class="control-label col-xs-3"><?php echo ENTRY_NAME; ?></label>
	 <div class="col-xs-9">
	 <?php
		 echo (isset($account['customers_lastname']) ? $name . tep_draw_hidden_field('name',$name) : tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"'));
		 echo FORM_REQUIRED_INPUT;
	 ?>
	 </div>
 </div>
 <div class="form-group has-feedback">
	 <label for="inputFromEmail" class="control-label col-xs-3"><?php echo ENTRY_EMAIL; ?></label>
	 <div class="col-xs-9">
	 <?php
		 echo tep_draw_input_field('email', $email, 'required aria-required="true" id="inputFromEmail" placeholder="' . ENTRY_EMAIL . '"');
		 echo FORM_REQUIRED_INPUT;
	 ?>
	 </div>
 </div>

<!-- Begin test for adding phone number -->
 <div class="form-group has-feedback">
	 <label for="inputFromPhone" class="control-label col-xs-3"><?php echo ENTRY_TELEPHONE_NUMBER; ?></label>
	 <div class="col-xs-9">
	 <?php
//	 echo tep_draw_input_field('phone', $phone, 'required aria-required="true" id="inputFromPhone" placeholder="' . ENTRY_TELEPHONE_NUMBER . '"');
		 echo tep_draw_input_field('phone', $phone, NULL );
//	 echo FORM_REQUIRED_INPUT;
	 ?>
	 </div>
 </div>
<!-- End test for adding phone number -->


 <div class="form-group has-feedback">
	 <label for="inputEnquiry" class="control-label col-xs-3"><?php echo ENTRY_ENQUIRY; ?></label>
	 <div class="col-xs-9">
	 <?php
		 echo tep_draw_textarea_field('enquiry', 'soft', 50, 15, NULL, 'required aria-required="true" id="inputEnquiry" placeholder="' . ENTRY_ENQUIRY . '"');
		 echo FORM_REQUIRED_INPUT;
	 ?>
	 </div>
 </div>
 </div>
 <div class="buttonSet">
 <span class="buttonAction">
	 <?php echo tep_draw_button(IMAGE_BUTTON_CONTINUE, 'glyphicon-send', null, 'primary'); ?>
 </span>
 </div>
</div>
</form>
<?php
}
require(DIR_WS_INCLUDES . 'template_bottom.php');
require(DIR_WS_INCLUDES . 'application_bottom.php');
?>

♥Tsimi · May 31, 2014

Hi

I tried to add some css when the name is showing to push it down with a margin-top: 7px; It works but it pushes down the inout field aswell when the customer is not logged in.

I found a way to show the customer name in the same way as it does the pre-inserted mail address and phone number. Meaning, the name is inside the input field and the customer would have the possibilty to change it. If that is OK then change the following code:

echo (isset($account['customers_lastname']) ? $name . tep_draw_hidden_field('name',$name) : tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"'));

to this

echo tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"');

that is all could come up with for now. best would be an if else statement but i have no clue how to change the current code to that. Maybe whitehat or burt or someone else might have a better idea.

P.S. and you might have to change the following text

Please use the form on the right to contact us with any comments or concerns.

the form might not be always on the right side with BS. ;)

burt · May 31, 2014

http://getbootstrap.com/css/#forms-controls-static

♥Tsimi · May 31, 2014

Hi @@burt

Thanks something new learned today.

Still the problem is there... i added two images that show the difference logged in or logged out with the code used below.

Seems like the input field is at the right place but the asterik and the <label> are pushed up by 5px - 8px.

I tried this following code;

<p class="inputRequirement text-right"><?php echo FORM_REQUIRED_INFORMATION; ?></p>
	 <div class="clearfix"></div>
	 <div class="form-group has-feedback">
			 <label for="inputFromName" class="control-label col-xs-3"><?php echo ENTRY_NAME; ?></label>
			 <div class="col-xs-9">
			 <p class="form-control-static"><?php
					 echo (isset($account['customers_lastname']) ? $name . tep_draw_hidden_field('name',$name) : tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"'));
					 echo FORM_REQUIRED_INPUT;
			 ?></p>
			 </div>
	 </div>

burt · May 31, 2014

You need to recode that whole area. This addon is one of those I place into the "good idea, poor execution" category.

Logged in: remove the required tags, add the name. Add a hidden input containing the name (does not matter where so long as it is inside the form /form

Not logged in: no change.

You need this: "<p class="form-control-static">" if and only if customer is logged in.

♥Tsimi · May 31, 2014

@@burt

i think i got it! (w00t)

the function works but could you please confirm the code below. Just to make sure that i didn't code some $&&$#% here.

<div class="form-group has-feedback">
<label for="inputFromName" class="control-label col-xs-3"><?php echo ENTRY_NAME; ?></label>
<div class="col-xs-9">
<?php
if (!tep_session_is_registered('customer_id')) {
echo tep_draw_input_field('name', null, '', 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"');
echo FORM_REQUIRED_INPUT;
} else {
echo '<p class="form-control-static">';
echo (isset($account['customers_lastname']) ? $name . tep_draw_hidden_field('name',$name) : tep_draw_input_field('name', $name, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"'));
echo FORM_REQUIRED_INPUT;
echo '</p>';	
}
?>
</div>

burt · May 31, 2014

If the customer is logged in, you don't need hardly any of that code. Assuming $name is some sort of variable taken from the logged in customer details...

echo '<p class="form-control-static">' . $name . '</p>';
echo tep_draw_hidden_field('name',$name);

♥Tsimi · May 31, 2014

Now i see it....there is already a

if (!tep_session_is_registered('customer_id')) {

further up the code

// Begin addition - Enhanced Contact Us - 5-29-2014
$account = array();$orders = array();$name = '';$email = '';$phone = '';
if (tep_session_is_registered('customer_id')) {
$account_query = tep_db_query("select customers_firstname, customers_lastname, customers_telephone, customers_id, customers_email_address from " . TABLE_CUSTOMERS . " where customers_id = '" . (int)$customer_id . "'");
$account = tep_db_fetch_array($account_query);
$name = $account['customers_firstname'].' '.$account['customers_lastname'] ;
$email = $account['customers_email_address'] ;
$phone = $account['customers_telephone'] ;
$history_query = tep_db_query("select orders_id, date_purchased from " . TABLE_ORDERS . " where customers_id = '" . (int)$customer_id . "' order by orders_id DESC");
$orders[0] = array('id' => '0', 'text' => ENTRY_ORDER_ID);
while ($history = tep_db_fetch_array($history_query)) {
	 $orders[] = array('id' => $history['orders_id'], 'text' => $history['orders_id'] . ENTRY_ORDERED . tep_date_short($history['date_purchased']));
}
}
// End Addition

♥Tsimi · May 31, 2014

With the big help from @@burt i could put this together.

<div class="form-group has-feedback">
<label for="inputFromName" class="control-label col-xs-3"><?php echo ENTRY_NAME; ?></label>
<div class="col-xs-9">
<?php if (!tep_session_is_registered('customer_id')) {
echo tep_draw_input_field('name', null, 'required autofocus="autofocus" aria-required="true" id="inputFromName" placeholder="' . ENTRY_NAME . '"');
echo FORM_REQUIRED_INPUT;
}else{
echo '<p class="form-control-static">' . $name . '</p>';
echo tep_draw_hidden_field('name',$name);
}
?>
</div>
</div>

ArtcoInc · May 31, 2014

Thank you both *very* much! I admit that this was a silly little cosmetic issue, and I am excited that a solution was found!

P.S. and you might have to change the following text

Please use the form on the right to contact us with any comments or concerns.

the form might not be always on the right side with BS. ;)

That bit was in the original add-on, and I did change it in my adaptation. :thumbsup: Thank you.

This addon is one of those I place into the "good idea, poor execution" category.

As I have said before, I am not a professional programmer or developer. I was just trying to take this 'good idea' and apply it to my application. I acknowledge that this add-on was created for the stock osC, and not the bootstrap version. And, in trying to adapt it to the bootstrap version, I needed some assistance to avoid having a 'poor execution'. I did have to leave the display of the store name, address, etc still in a table, only because I do not know how to code it properly. Not pretty, code wise, but it works. And, with the help of both of you, this is now a 'slightly less poor execution'. Thank you.

Now, to see if I can get the recaptcha to work :-

Malcolm

♥Tsimi · June 1, 2014

@@ArtcoInc

Now, to see if I can get the recaptcha to work

This one sentence didn't get out of my head and anyway I want to use this add-on in the future too so I started to work on that issue.

Since we have a "responsive" osC it would be great to have a responsive reCaptcha. Well, that is what I did, I found this tutorial by jaicab and implemented that reCaptcha but i didn't really like it's "visual skin" so i restyled it. The following two attached zip files contain the complete contact_us.php file and a css file. One is the untouched version as you see in that tutorial and the other is my re-styled one.

After you installed the add-on with the reCaptcha extra just overwrite the contact_us.php file with one that comes with the zip files and just copy&paste the css definitions into the user.css.

Inside the contact_us.php file you will have to replace this text YOUR_PUBLIC_KEY with the reCaptcha public key (of course). (2 instances to replace!)

I installed it into my local shop so couldn't test the message function properly. I get a send successful message but not sure if it really went or not.

Another issue is that, when the TEXT_SUCCESS shows up the categories box on the left disappears i don't know if that is normal behaviour.

I am sure the code could use some cleaning regarding the reCaptcha therefore it would be great if a veteran coder could take a quick look at the files and tell if there is anything that needs attention.

ArtcoInc · June 1, 2014

Thank you *very* much! I will look at this when I can get to my other computer.

In the code I posted above (message #4), I did make a slight change when modding the 'stock' add-on. I moved the store name, address, hours, etc to *after* " ] else [ " statement. This deleted having the store name, address, etc from displaying on the "Your enquiry has been successfully sent to the Store Owner" page. I thought that it was not necessary to include it again at that point (too much clutter on the screen).

In my in-house testing (without the reCaptcha), the Categories boxes *do* appear on the 'Successfully sent' page.

Will let you know how my further testing goes. Thanks again!

Malcolm

ArtcoInc · June 2, 2014

An interesting idea. Personally, I have difficulties reading some reCaptchas, and it can get frustrated if I have to 'get another' more than once, just to be able to read it.

That said, it is effective at keeping the bots in order ...

Malcolm

burt · June 2, 2014

"Action Recorder" ...

♥joli1811 · June 2, 2014

Custom wholesale contact page with image upload for 2.3.3.4 using action recorder download if anyone wants to cherry pick the action recorder code out

Regards

Joli

♥Tsimi · June 2, 2014

Thanks John!

The contact_us.php file in the zip files had some minor bugs that i could fix thanks to burt and whitehat.

The attached file is based on my version of the reCaptcha (tsimi reworked)

New file attached.

another alternative to use instead the reCaptcha ist this here;

read

♥joli1811 · June 2, 2014

Nice one have a site getting x 3 spam mails everyday lets see if they can do any maths :D

burt · June 2, 2014

With a maths question (2 minute code changes) and protection by action recorder (built in), I think you should see a dramatic reduction in bot activity. Personally I don't like capcha's, I find them incredibly hard to decipher...

♥joli1811 · June 2, 2014

With a maths question (2 minute code changes) and protection by action recorder (built in), I think you should see a dramatic reduction in bot activity. Personally I don't like capcha's, I find them incredibly hard to decipher...

Yes myself also some of the :- capcha's are like a jigsaw puzzle nothing 100% so 90% fine with me going to do later have these annoying repeating spam x 3 daily goes to junk but have to check junk in case something important slipped in so nice to get rid of them.

ArtcoInc · June 2, 2014

another alternative to use instead the reCaptcha ist this here;

read

@@burt

I am trying to implement this. I believe you have a typo. You say to add this to catalog/included/languages/english.php

define('ENTRY_HUMAN', 'What is the sum of %s and %s ?);
define('ENTRY_EMAIL_HUMAN_CHECK_ERROR', 'You are a robot or you think 2+2=5. Please go away.');

There needs to be a closing single quote after the Question Mark ...

define('ENTRY_HUMAN', 'What is the sum of %s and %s ?');
define('ENTRY_EMAIL_HUMAN_CHECK_ERROR', 'You are a robot or you think 2+2=5. Please go away.');

Now to work on formatting and page layout ... (w00t)

Malcolm

♥Tsimi · June 3, 2014

Forgot to mention, i changed the "continue" button to "send".

You need to add this into your english.php

define('IMAGE_BUTTON_SEND', 'Send');

and I moved the form tag down a bit after this code

<?php

} else {

echo tep_draw_hidden_field('phone',$phone);

?>

<?php echo tep_draw_form('contact_us', tep_href_link(FILENAME_CONTACT_US, 'action=send'), 'post', 'class="form-horizontal"', true); ?>

burt · June 3, 2014

Sometimes I get an idea in my head I cannot shake. I spent 10 minutes coding this:

Thoughts ?

Archived

2334BS - Enhanced Contact Us

Recommended Posts

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites