Online Bill Pay (payment form)

[inhouse]

Hello, I was wondering if there is a way for me to create an Online Bill Pay form that links up to ShopSite so all incoming payments are handled in one central location. The form would be relatively simple and would have contact info, credit card info, and a blank input field for a dollar amount. This form would work like ordering a gift certificate or a donation form in that there is no set dollar amount.

I don't see a way to create a bill pay form via ShopSite but I'm interested in any workarounds. I would like to host the form on my website and have the "submit" or "add to cart" button bring the user to ShopSite to complete the form (credit card info and checkout).

Check out the existing form I am using as a reference here:
http://www.dashapp.com/online/payments/index.php?clientid=1981

Thanks in advance.

[Jim]

Use the Variable Price (Name, SKU) options for a product to create your form. See an example on http://shopsite.com/templates/examples/product-02-price.html

The last example has all 3 options variable so you can have them enter their name, invoice #( change sku text to what you want) and amount. Add the item to the cart and continue the checkout process to make the payment.

We use a similar form for online payments to ShopSite.

[inhouse]

That should work although I have no idea how to set up a 2nd product and link it to a different page. This is an after thought as far as the cart is concerned. Are each of the text fields options? I have no idea how to do this. It works completely different than my other item that uses drop downs. I learned that, but this seems different. Is there any jumping off point I can start with or sample code type stuff?

[Jim]

The template code is right on the page that I gave the url for. Use the last example Product Variable Price Example. Create a product template using just that code. Assign the template to a product that you have set to have Variable Price, Variable Sku, Variable name. (Set the product price to the minimum that a person must pay because the product can't be added to the cart with a price the shopper enters that is lower than that.)

You could also check your product templates under Product > Edit Product Layout and see if you have the ShopSite provide templates Donation.sst and Invoice.sst. Both of those use the variable price feature for donations or Invoice type forms.

[inhouse]

I think I assigned the template I created to my product; however, I don't know where I can see this page. I don't have or want my 2 products linked with any navigation since they will have links on my site. My main order form is index.html. I have no idea how to view this 2nd product. I tried http://protech.accountsupport.com/store/online-bill-pay.html but that doesn't work. I had a lot of help setting up my first product so I've really only learned how to edit product options, styles, and includes.

Link Name: online-bill-pay.html

[Jim]

Did you create a page with the filename set to online-bill-pay.html?
Did you assign the product that is your online bill pay product to the page that has the filename online-bill-pay.html?

If you answered No to question 1.
Click on the Pages button or Icon in your backoffice of ShopSite store. At the bottom of the screen is there a button called Advanced Editing if so, click it. And you will be in the advanced editing mode. (If the button says Basic Editing you are already in advanced editing mode. so just proceed as follows.
Click the Add a Page button. Give the page a name and fill in any details you want for the page. Near the bottom of the screen is a section Advance Info with the field "File name:" enter online-bill-pay.html. When you have finished filling any other details you want click the Save button.

If you answered No to question 2.
click the Pages button or Icon. select the page that you created with the File name: set to online-bill-pay.html and then click the Assign Items button. The next screen will ask for Pages or Products, select the Products option and click Proceed.
There will be 2 boxes. from the bottom box select the product that is your online-bill-pay product and click the Add button which will move the item to the top box. Click Save Changes. There will be a Publish tab that has popped up on the right side of the navigation at the top of the page, click that button to publish the pages you have modified in your store.

You should now be able to go to the url http://protech.accountsupport.com/store/online-bill-pay.html and see your product and test that the bill pay is working.

[inhouse]

Jim, number 1 was the problem. I thought I had set the filename but I had actually set the link name. So now how do I add more fields? I have the price with an input field but don't know where to add more fields/descriptions. I tried just adding in form HTML to the custom template but I'm not sure this will work. I clicked the submit button and received a cart error "No variable price specified, item not added to the shopping cart". Even when I remove my pasted form HTML the cart doesn't populate with anything. It does however try to add in the surcharge we set up for my other product. Seems I have a lot to edit to get this to work... Any help?

http://protech.accountsupport.com/store/online-bill-pay.html

[Jim]

There are several problems.
1. The html for the page is not complete. There are not closing </body> and </html> tags
2. this is not valid <input type=text name="4:Payment Amount" size="14" maxlength="12" value="">
I'm not sure which field you are trying to use in adding to the cart? Is this suppose to be the value of the payment, an invoice number, the persons name? The 'name="4:Payment Amount " needs to be the specific database field you are submitting, not just text.

This page http://shopsite.com/templates/cookbook/product-variable.shtml contains sample template code for all three fields, name, price and sku. the basic format for the fields is "name=productRecordNumber:field" where 'field' is name or price or sku

Code: Select all

<input name="[--PRODUCT.RecordNumber--]:name" size="20" value="" type="text">
---------------------------------------^^^^^
<input name="[--PRODUCT.RecordNumber--]:price" size="4" value="" type="text">
---------------------------------------^^^^^
<input name="[--PRODUCT.RecordNumber--]:sku" size="4" value="" type="text">
---------------------------------------^^^^^

[inhouse]

Jim, first you told me to use the sample code here: http://shopsite.com/templates/examples/product-02-price.html so I pasted that into my template.

Now you're saying I should be using the code found here: http://shopsite.com/templates/cookbook/product-variable.shtml. So I pasted that code in and it seemed to appear ok except there is no submit button. I tried to do a mix of the 2 examples and now everything is all messed up. This is extremely frustrating. I simply want to have a text field the customer can fill out (5 lines by 50 characters) and a field that enables customer to input a monetary figure and hit submit.

I also stated that the surcharge from my other product also appears in the shopping cart. This is a problem because it only applies to the fuel ordering form, not this bill pay form.

I need help please. Lauren had helped me set up the other product/checkout so I'm not even sure how we would hide the surcharge portion.

[Jim]

I was only giving you examples to go on not the actual code. The second section of code was just pointing out where you need to fix the template since you have the text
If you post your product template as you currently have it I will modify it for you.

However, you also have a problem with your page template since it doesn't display a complete page, so that also needs to be fixed.

[inhouse]

I don't know why my page template isn't complete or what needs to be added for it to be complete. Again, I still have this surcharge from the other product appearing in my shopping cart. I have no idea what to do with that either. Thanks for helping.

Code: Select all

<style type="text/css">
<!--
.current-price {
    display: none!important;
}
-->
</style>

<h4>Please complete this form to make a payment.</h4>
<p><em>This form should not be used to order heating oil. If you would like to order heating oil online, please click <a href="http://protech.accountsupport.com/store/index.html" title="Order Home Heating Oil">here</a>. Heating oil orders submitted through the Online Bill Payment form will be voided.</em> </p>
  <input name="form" type="hidden" id="form" value="1" />

[-- IF PRODUCT.VariableName? --]
<b>Remarks (Invoice, Account Number, Comments...)</b>
<br>
<input name="[--PRODUCT.RecordNumber--]:name" size="20" value="" type="text">
[-- ELSE --]
[-- PRODUCT.Name --]
[-- END_IF --]
<br><br>

[-- IF PRODUCT.VariablePrice? --]
<b>Payment Amount:</b><br> $<input name="[--PRODUCT.RecordNumber--]:price" size="14" value="" type="text">
[-- ELSE --]
[-- PRODUCT.Price --]
[-- END_IF --]
<br><br>

    <b>Payment Amount:</b><br> [-- STORE.CurrencySymbol --]<input type=text name="[-- PRODUCT.RecordNumber --]:price" size="12" maxlength="10" value="">
    <input type=hidden name=storeid value=[-- STORE_ID --]>
    <input type=hidden name=dbname value=products>
    <input type=hidden name=function value=add>
    <input type=hidden name=itemnum value=[-- PRODUCT.RecordNumber --]>
    <br><br>
    <input class="add" type=submit value="[-- ADDTEXT --]">
    </form>
  [-- ELSE --]


[Jim]

The template you posted is not a complete product template. Is that all you have in the product template?

It should look like this

Code: Select all

[-- DEFINE PRODUCT --]

   [-- PRODUCT.ProductDescription --]<br>

<form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method=post>
    <input type="hidden" name="storeid" value="[-- STORE_ID --]">
    <input type="hidden" name="dbname" value="products">
    <input type="hidden" name="itemnum" value="[-- PRODUCT.RecordNumber --]">
    <input type="hidden" name="function" value=add>
     <b>Remarks (Invoice, Account Number, Comments...)<br><input name="[--PRODUCT.RecordNumber--]:name" size="20" value="" type="text"><br>
     <b>Invoice#&nbsp;&nbsp:</b><br><input name="[--PRODUCT.RecordNumber--]:sku" size="20" value="" type="text"><br>
     <b>Payment Amount</b><br> [-- STORE.CurrencySymbol --]<input type="text" name="[-- PRODUCT.RecordNumber --]:price" size="12" maxlength="10" value=""><br>
     <br><input class="add" type=submit value="[-- ADDTEXT --]">

</form>

[-- END_DEFINE PRODUCT --]

This text which you had in the template should be put in the product description field rather than the template. This will make it easier to change if you need to. It is displayed using the [-- PRODUCT.ProductDescription --] tag in the template.
----------------
<h4>Please complete this form to make a payment.</h4>
<p><em>This form should not be used to order heating oil. If you would like to order heating oil online, please click <a href="http://protech.accountsupport.com/store/index.html" title="Order Home Heating Oil">here</a>. Heating oil orders submitted through the Online Bill Payment form will be voided.</em> </p>
---------------

To make the template as simple as possible I have stripped all conditional statements since it is specific for your use. Because it has embedded text for the 3 input field descriptions It should only be assigned to specific product you use for your Payments. That product must haave Variable Pricing, Variable sku and Variable Name enabled.
I also remove 3 sections that are in normal product template, Cross-sell, Subproducts and MoreInfopage since this product will not use those.

I haven't done anything specific with the formatting of the product other than to put <br> after the various text label and input fields so they are separated a little vertically.