Adding Terms of Service Acceptance check box to payment screen

[tbrady85]

Hey everyone,

I'm a website designer that offers hosting as an optional service for my clients. Because of this I don't openly advertise hosting. If the client wants my hosting then I setup their WHMCS account and submit the order for it myself so all they have to do is pay the invoice.  Since I do things this way this bypass's the Terms of Service checkbox that you see when creating an account or adding a package and because of that I have to send them a separate document with my TOS to have the client esign it. 

My question is, how difficult would it be to add the TOS check box to the payment screen myself?   I'm not an expert developer but if someone were to nudge me in the right direction I usually do a pretty decent job at figuring it out.

Thanks,

Tyler

[brian!]

Hi Tyler,

10 hours ago, tbrady85 said:

My question is, how difficult would it be to add the TOS check box to the payment screen myself?

that answer possibly depends upon which payment gateway you are using - or are they choosing the gateway paying from the invoice page ?

[tbrady85]

Hey Brian,

They don't choose the gateway since I just use Stripe.  When they click on "Pay now" on their invoice they're taken to the screen on the attached image.

This is where I'm needing to put the TOS acceptance check box; right above the "Submit Payment" button.

 

[brian!]

Hi Tyler,

18 hours ago, tbrady85 said:

This is where I'm needing to put the TOS acceptance check box; right above the "Submit Payment" button. 

that screenshot is of the creditcard.tpl template (usually at /templates/six.creditcard.tpl) - ultimately, you should be able to do this using an action hook, but with v7.8 around the corner, and that including changes to Stripe, i'm reluctant to go down that road until we know what those changes will be with regards to the templates.

a quick fix for your issue, would be to edit creditcard.tpl and change...

<div class="form-group">
	<div class="text-center">
		<button type="submit" class="btn btn-primary btn-lg" id="btnSubmit" value="{$LANG.submitpayment}">
			<span class="pay-text">{$LANG.submitpayment}</span>
			<span class="click-text hidden">{$LANG.pleasewait}</span>
		</button>
	</div>
</div>

to...

<div class="form-group">
	<div class="text-center">
		<input type="checkbox" required name="terms"> {$LANG.ordertosagreement} <a href="https://www.google.com" target="_blank">{$LANG.ordertos}</a><br><br>
		<button type="submit" class="btn btn-primary btn-lg" id="btnSubmit" value="{$LANG.submitpayment}">
			<span class="pay-text">{$LANG.submitpayment}</span>
			<span class="click-text hidden">{$LANG.pleasewait}</span>
		</button>
	</div>
</div>

that will add a checkbox to that page and force them to tick it in order to submit payment, or show an error message if they don't tick the box.