2 +--------------------------------------------------------------------+
3 | Copyright CiviCRM LLC. All rights reserved. |
5 | This work is published under the GNU AGPLv3 license with some |
6 | permitted exceptions and without any warranty. For full license |
7 | and copyright information, see https://civicrm.org/licensing |
8 +--------------------------------------------------------------------+
10 {capture assign="adminPriceSets"}{crmURL p='civicrm/admin/price' q="reset=1"}{/capture}
11 {crmRegion name="contribute-form-contributionpage-amount-main"}
12 <div class="crm-block crm-form-block crm-contribution-contributionpage-amount-form-block">
14 {ts}Use this form to configure Contribution Amount options. You can give contributors the ability to enter their own contribution amounts and/or provide a fixed list of amounts. For fixed amounts, you can enter a label for each 'level' of contribution (e.g. Friend, Sustainer, etc.). If you allow people to enter their own dollar amounts, you can also set minimum and maximum values. Depending on your choice of Payment Processor, you may be able to offer a recurring contribution option.{/ts} {docURL page="user/contributions/payment-processors"}
16 <div class="crm-submit-buttons">{include file="CRM/common/formButtons.tpl" location="top"}</div>
17 {if !$paymentProcessor}
18 {capture assign=ppUrl}{crmURL p='civicrm/admin/paymentProcessor' q="reset=1"}{/capture}
19 <div class="status message">
20 {ts 1=$ppUrl}No Payment Processor has been configured / enabled for your site. Unless you are only using CiviContribute to solicit non-monetary / in-kind contributions, you will need to <a href='%1'>configure a Payment Processor</a>. Then return to this screen and assign the processor to this Contribution Page.{/ts} {docURL page="user/contributions/payment-processors"}
21 <p>{ts}NOTE: Alternatively, you can enable the <strong>Pay Later</strong> option below without setting up a payment processor. All users will then be asked to submit payment offline (e.g. mail in a check, call in a credit card, etc.).{/ts}</p>
24 <table class="form-layout-compressed">
25 <tr class="crm-contribution-contributionpage-amount-form-block-is_monetary"><th scope="row" class="label" width="20%">{$form.is_monetary.label}</th>
26 <td>{$form.is_monetary.html}<br />
27 <span class="description">{ts}Uncheck this box if you are using this contribution page for free membership signup ONLY, or to solicit in-kind / non-monetary donations such as furniture, equipment.. etc.{/ts}</span></td>
29 <tr class="crm-contribution-contributionpage-amount-form-block-currency"><th scope="row" class="label" width="20%">{$form.currency.label}</th>
30 <td>{$form.currency.html}<br />
31 <span class="description">{ts}Select the currency to be used for contributions submitted from this contribution page.{/ts}</span></td>
33 {if $paymentProcessor}
34 <tr class="crm-contribution-contributionpage-amount-form-block-payment_processor"><th scope="row" class="label" width="20%">{$form.payment_processor.label}</th>
35 <td>{$form.payment_processor.html}<br />
36 <span class="description">{ts}Select the payment processor to be used for contributions submitted from this contribution page (unless you are soliciting non-monetary / in-kind contributions only).{/ts} {docURL page="user/contributions/payment-processors"}</span></td>
39 <tr class="crm-contribution-contributionpage-amount-form-block-is_pay_later"><th scope="row" class="label">{$form.is_pay_later.label}</th>
40 <td>{$form.is_pay_later.html}<br />
41 <span class="description">{ts}Check this box if you want to give users the option to submit payment offline (e.g. mail in a check, call in a credit card, etc.).{/ts}</span></td>
43 <tr id="payLaterFields" class="crm-contribution-form-block-payLaterFields"><td> </td>
45 <table class="form-layout">
46 <tr class="crm-contribution-contributionpage-amount-form-block-pay_later_text"><th scope="row" class="label">{$form.pay_later_text.label} <span class="crm-marker" title="This field is required.">*</span> {if $action == 2}{include file='CRM/Core/I18n/Dialog.tpl' table='civicrm_contribution_page' field='pay_later_text' id=$contributionPageID}{/if}</th>
47 <td>{$form.pay_later_text.html|crmAddClass:big}<br />
48 <span class="description">{ts}Text displayed next to the checkbox for the 'pay later' option on the contribution form. You may include HTML formatting tags.{/ts}</span></td></tr>
49 <tr class="crm-contribution-contributionpage-amount-form-block-pay_later_receipt"><th scope="row" class="label">{$form.pay_later_receipt.label} <span class="crm-marker" title="This field is required.">*</span> {if $action == 2}{include file='CRM/Core/I18n/Dialog.tpl' table='civicrm_contribution_page' field='pay_later_receipt' id=$contributionPageID}{/if}</th>
50 <td>{$form.pay_later_receipt.html|crmAddClass:big}<br />
51 <span class="description">{ts}Instructions added to Confirmation and Thank-you pages, as well as the confirmation email, when the user selects the 'pay later' option (e.g. 'Mail your check to ... within 3 business days.').{/ts}</span></td></tr>
53 <tr><th scope="row" class="label">{$form.is_billing_required.label}</th>
54 <td>{$form.is_billing_required.html}<br />
55 <span class="description">{ts}Check this box to require users who select the pay later option to provide billing name and address.{/ts}</span>
60 <tr class="crm-contribution-contributionpage-amount-form-block-amount_block_is_active">
61 <th scope="row" class="label">{$form.amount_block_is_active.label}</th>
62 <td>{$form.amount_block_is_active.html}<br />
63 <span class="description">{ts}Uncheck this box if you are using this contribution page for membership signup and renewal only – and you do NOT want users to select or enter any additional contribution amounts.{/ts}</span></td>
65 <tr id="priceSet" class="crm-contribution-contributionpage-amount-form-block-priceSet">
66 <th scope="row" class="label">{$form.price_set_id.label}</th>
68 <td>{$form.price_set_id.html}<br /><span class="description">{ts 1=$adminPriceSets}Select a pre-configured Price Set to offer multiple individually priced options for contributions. Otherwise, select "-none-" and enter one or more fixed contribution options in the table below. Create or edit Price Sets <a href='%1'>here</a>.{/ts}</span></td>
70 <td><div class="status message">{ts 1=$adminPriceSets}No Contribution Price Sets have been configured / enabled for your site. Price sets allow you to configure more complex contribution options (e.g. "Contribute $25 more to receive our monthly magazine."). Click <a href='%1'>here</a> if you want to configure price sets for your site.{/ts}</div></td>
75 <div id="recurringFields">
76 <table class="form-layout-compressed">
79 {if $recurringPaymentProcessor}
80 <tr id="recurringContribution" class="crm-contribution-form-block-is_recur"><th scope="row" class="label" width="20%">{$form.is_recur.label}</th>
81 <td>{$form.is_recur.html}<br />
82 <span class="description">{ts}Check this box if you want to give users the option to make recurring contributions. This feature requires that you use a payment processor which supports recurring billing / subscriptions functionality.{/ts} {docURL page="user/contributions/payment-processors"}</span>
85 <tr id="recurFields" class="crm-contribution-form-block-recurFields"><td> </td>
87 <table class="form-layout-compressed">
88 <tr class="crm-contribution-form-block-recur_frequency_unit"><th scope="row" class="label">{$form.recur_frequency_unit.label}<span class="crm-marker" title="This field is required.">*</span></th>
89 <td>{$form.recur_frequency_unit.html}<br />
90 <span class="description">{ts}Select recurring units supported for recurring payments.{/ts}</span></td>
92 <tr class="crm-contribution-form-block-is_recur_interval"><th scope="row" class="label">{$form.is_recur_interval.label}</th>
93 <td>{$form.is_recur_interval.html}<br />
94 <span class="description">{ts}Can users also set an interval (e.g. every '3' months)?{/ts}</span></td>
96 <tr class="crm-contribution-form-block-is_recur_installments"><th scope="row" class="label">{$form.is_recur_installments.label}</th>
97 <td>{$form.is_recur_installments.html}<br />
98 <span class="description">{ts}Give the user a choice of installments (e.g. donate every month for 6 months)? If not, recurring donations will continue indefinitely.{/ts}</span></td>
107 {if $futurePaymentProcessor}
108 <span id="pledge_calendar_date_field"> {$form.pledge_calendar_date.html}</span>
109 <span id="pledge_calendar_month_field"> {$form.pledge_calendar_month.html}<br/><span class="description">{ts}Recurring payment will be processed this day of the month following submission of this contribution page.{/ts}</span></span>
113 <div id="amountFields">
114 <table class="form-layout-compressed">
115 {* handle CiviPledge fields *}
117 <tr class="crm-contribution-form-block-is_pledge_active"><th scope="row" class="label" width="20%">{$form.is_pledge_active.label}</th>
118 <td>{$form.is_pledge_active.html}<br />
119 <span class="description">{ts}Check this box if you want to give users the option to make a Pledge (a commitment to contribute a fixed amount on a recurring basis).{/ts}</span>
122 <tr id="pledgeFields" class="crm-contribution-form-block-pledgeFields"><td></td><td>
123 <table class="form-layout-compressed">
124 <tr class="crm-contribution-form-block-pledge_frequency_unit"><th scope="row" class="label">{$form.pledge_frequency_unit.label}<span class="crm-marker"> *</span></th>
125 <td>{$form.pledge_frequency_unit.html}<br />
126 <span class="description">{ts}Which frequencies can the user pick from (e.g. every 'week', every 'month', every 'year')?{/ts}</span></td>
128 <tr class="crm-contribution-form-block-is_pledge_interval"><th scope="row" class="label">{$form.is_pledge_interval.label}</th>
129 <td>{$form.is_pledge_interval.html}<br />
130 <span class="description">{ts}Can they also set an interval (e.g. every '3' months)?{/ts}</span></td>
132 <tr class="crm-contribution-form-block-initial_reminder_day"><th scope="row" class="label">{$form.initial_reminder_day.label}</th>
133 <td>{$form.initial_reminder_day.html}
134 <span class="label">{ts}Days prior to each scheduled payment due date.{/ts}</span></td>
136 <tr class="crm-contribution-form-block-max_reminders"><th scope="row" class="label">{$form.max_reminders.label}</th>
137 <td>{$form.max_reminders.html}
138 <span class="label">{ts}Reminders for each scheduled payment.{/ts}</span></td>
140 <tr class="crm-contribution-form-block-additional_reminder_day"><th scope="row" class="label">{$form.additional_reminder_day.label}</th>
141 <td>{$form.additional_reminder_day.html}
142 <span class="label">{ts}Days after the last one sent, up to the maximum number of reminders.{/ts}</span></td>
144 {if $futurePaymentProcessor}
145 <tr id="adjustRecurringFields" class="crm-contribution-form-block-adjust_recur_start_date"><th scope="row" class="label">{$form.adjust_recur_start_date.label}</th>
146 <td>{$form.adjust_recur_start_date.html}<br/>
147 <div id="recurDefaults">
148 <span class="description">{$form.pledge_default_toggle.label}</span>
149 <table class="form-layout-compressed">
150 <tr class="crm-contribution-form-block-date_of_recurring_contribution">
151 <td>{$form.pledge_default_toggle.html}</td>
153 <tr class="crm-contribution-form-block-is_pledge_start_date_visible">
154 <td>{$form.is_pledge_start_date_visible.html} {$form.is_pledge_start_date_visible.label}</td>
156 <tr class="crm-contribution-form-block-is_pledge_start_date_visible">
157 <td>{$form.is_pledge_start_date_editable.html} {$form.is_pledge_start_date_editable.label}</td>
169 <tr class="crm-contribution-form-block-amount_label">
170 <th scope="row" class="label" width="20%">{$form.amount_label.label}<span class="crm-marker"> *</span></th>
171 <td>{$form.amount_label.html}</td>
173 <tr class="crm-contribution-form-block-is_allow_other_amount"><th scope="row" class="label" width="20%">{$form.is_allow_other_amount.label}</th>
174 <td>{$form.is_allow_other_amount.html}<br />
175 <span class="description">{ts}Check this box if you want to give users the option to enter their own contribution amount. Your page will then include a text field labeled <strong>Other Amount</strong>.{/ts}</span></td></tr>
177 <tr id="minMaxFields" class="crm-contribution-form-block-minMaxFields"><td> </td><td>
178 <table class="form-layout-compressed">
179 <tr class="crm-contribution-form-block-min_amount"><th scope="row" class="label">{$form.min_amount.label}</th>
180 <td>{$form.min_amount.html|crmMoney}</td></tr>
181 <tr class="crm-contribution-form-block-max_amount"><th scope="row" class="label">{$form.max_amount.label}</th>
182 <td>{$form.max_amount.html|crmMoney}<br />
183 <span class="description">{ts 1=5|crmMoney}If you have chosen to <strong>Allow Other Amounts</strong>, you can use the fields above to control minimum and/or maximum acceptable values (e.g. don't allow contribution amounts less than %1).{/ts}</span></td></tr>
188 <fieldset><legend>{ts}Fixed Contribution Options{/ts}</legend>
189 <div class="description">
190 {ts}Use the table below to enter up to ten fixed contribution amounts. These will be presented as a list of radio button options. Both the label and dollar amount will be displayed.{/ts}{if $isQuick}{ts} Click <a id='quickconfig' href='#'>here</a> if you want to configure the Fixed Contribution Options below as part of a Price Set, with the added flexibility and complexity that entails.{/ts}{/if}
193 <table id="map-field-table">
194 <tr class="columnheader" ><th scope="column">{ts}Contribution Label{/ts}</th><th scope="column">{ts}Amount{/ts}</th><th scope="column">{ts}Default?{/ts}<br />{$form.default.0.html}</th></tr>
195 {section name=loop start=1 loop=11}
196 {assign var=idx value=$smarty.section.loop.index}
197 <tr><td class="even-row">{$form.label.$idx.html}</td><td>{$form.value.$idx.html|crmMoney}</td><td class="even-row">{$form.default.$idx.html}</td></tr>
204 <div class="crm-submit-buttons">{include file="CRM/common/formButtons.tpl" location="bottom"}</div>
207 <script type="text/javascript">
209 var futurePaymentProcessorMapper = [];
210 {/literal}{if $futurePaymentProcessor}
211 {foreach from=$futurePaymentProcessor item="futurePaymentProcessor" key="index"}{literal}
212 futurePaymentProcessorMapper[{/literal}{$index}{literal}] = '{/literal}{$futurePaymentProcessor}{literal}';
216 var defId = $('input[name="pledge_default_toggle"][value="contribution_date"]').attr('id');
217 var calId = $('input[name="pledge_default_toggle"][value="calendar_date"]').attr('id');
218 var monId = $('input[name="pledge_default_toggle"][value="calendar_month"]').attr('id');
220 $("label[for='" + calId + "']").append($('#pledge_calendar_date_field'));
221 $("label[for='" + monId + "']").append($('#pledge_calendar_month_field'));
225 $("#" + defId).click( function() {
226 if ($(this).is(':checked')) {
227 $('#pledge_calendar_month').prop('disabled', 'disabled');
228 $('#pledge_calendar_date').prop('disabled', 'disabled');
229 $("#pledge_calendar_date").next('input').prop('disabled', 'disabled');
233 $("#" + calId).click( function() {
234 if ($(this).is(':checked')) {
235 $('#pledge_calendar_month').prop('disabled', 'disabled');
236 $('#pledge_calendar_date').prop('disabled', false);
237 $("#pledge_calendar_date").next('input').prop('disabled', false);
241 $("#" + monId).click( function() {
242 if ($(this).is(':checked')) {
243 $('#pledge_calendar_month').prop('disabled', false);
244 $("#pledge_calendar_date").next('input').prop('disabled', 'disabled');
245 $('#pledge_calendar_date').prop('disabled', 'disabled');
251 {/literal}{/if}{literal}
253 var paymentProcessorMapper = [];
255 {if $recurringPaymentProcessor}
256 {foreach from=$recurringPaymentProcessor item="paymentProcessor" key="index"}{literal}
257 paymentProcessorMapper[{/literal}{$index}{literal}] = '{/literal}{$paymentProcessor}{literal}';
262 var psid = $('#price_set_id').val();
263 showHideAmountBlock(psid, 'price_set_id');
264 function checked_payment_processors() {
266 $('.crm-contribution-contributionpage-amount-form-block-payment_processor input[type="checkbox"]').each(function(){
267 if($(this).prop('checked')) {
268 var id = $(this).attr('id').split('_')[2];
275 // show/hide recurring block
276 $('.crm-contribution-contributionpage-amount-form-block-payment_processor input[type="checkbox"]').change(function(){
277 showRecurring( checked_payment_processors() );
278 showAdjustRecurring( checked_payment_processors() );
280 showRecurring( checked_payment_processors() );
281 showAdjustRecurring( checked_payment_processors() );
283 var element_other_amount = document.getElementsByName('is_allow_other_amount');
284 if (! element_other_amount[0].checked) {
285 cj('#minMaxFields').hide();
287 var amount_block = document.getElementsByName('amount_block_is_active');
288 var priceSetID = {/literal}'{$priceSetID}'{literal};
290 if ( ! amount_block[0].checked || priceSetID ) {
292 cj('#priceSet').hide();
293 if (CRM.memberPriceset) {
294 cj(".crm-contribution-contributionpage-amount-form-block-amount_block_is_active td").html('<span class="description">{/literal}{ts}You cannot enable the Contribution Amounts section when a Membership Price Set is in use. (See the Memberships tab above.) Membership Price Sets may include additional fields for non-membership options that require an additional fee (e.g. magazine subscription) or an additional voluntary contribution.</span>{/ts}{literal}');
297 cj('#amountFields').hide();
301 payLater('is_pay_later');
304 cj('#is_pay_later').click( function() {
305 payLater('is_pay_later');
309 function minMax(chkbox) {
310 if (chkbox.checked) {
311 cj('#minMaxFields').show();
313 cj('#minMaxFields').hide();
314 document.getElementById("min_amount").value = '';
315 document.getElementById("max_amount").value = '';
319 function payLater(chkbox) {
320 var elementId = 'payLaterFields';
321 if (cj('#' + chkbox).prop('checked')) {
322 cj('#' + elementId).show();
324 cj('#' + elementId).hide();
328 function showHideAmountBlock(element, elementName) {
329 // show / hide when amount section is active check/uncheck.
330 var priceSetID = {/literal}'{$priceSetID}'{literal};
331 switch (elementName) {
334 cj('#amountFields').hide();
337 cj('#amountFields').show();
341 case 'is_pledge_active':
342 case 'is_allow_other_amount':
343 if (element.checked) {
344 if (priceSetID) cj( "#price_set_id" ).val('');
345 cj('#amountFields').show();
347 cj("#amount_block_is_active").prop('checked', true );
350 case 'amount_block_is_active':
351 if (element.checked) {
353 cj('#amountFields').hide();
354 cj( "#price_set_id" ).val(priceSetID);
357 cj('#amountFields').show();
358 cj( "#price_set_id" ).val('');
360 cj('#priceSet, #recurringFields').show();
363 cj( "#price_set_id" ).val('');
364 cj('#amountFields, #priceSet, #recurringFields').hide();
370 function showRecurring( paymentProcessorIds ) {
372 cj.each(paymentProcessorIds, function(k, id){
373 if( cj.inArray(id, paymentProcessorMapper) == -1 ) {
379 cj( '#recurringContribution' ).show( );
381 if ( cj( '#is_recur' ).prop('checked' ) ) {
382 cj( '#is_recur' ).prop('checked', false);
383 cj( '#recurFields' ).hide( );
385 cj( '#recurringContribution' ).hide( );
389 function showAdjustRecurring( paymentProcessorIds ) {
391 cj.each(paymentProcessorIds, function(k, id){
392 if( cj.inArray(id, futurePaymentProcessorMapper) == -1 ) {
398 cj( '#adjustRecurringFields' ).show( );
400 if ( cj( '#adjust_recur_start_date' ).prop('checked' ) ) {
401 cj( '#adjust_recur_start_date' ).prop('checked', false);
402 cj( '#recurDefaults' ).hide( );
404 cj( '#adjustRecurringFields' ).hide( );
408 {/literal}{if $futurePaymentProcessor}{literal}
409 function setDateDefaults() {
410 {/literal}{if !$pledge_calendar_date}{literal}
411 cj('#pledge_calendar_date').prop('disabled', 'disabled');
412 cj("#pledge_calendar_date").next('input').prop('disabled', 'disabled');
415 {if !$pledge_calendar_month}{literal}
416 cj('#pledge_calendar_month').prop('disabled', 'disabled');
417 {/literal}{/if}{literal}
419 {/literal}{/if}{literal}
424 {include file="CRM/common/showHideByFieldValue.tpl"
425 trigger_field_id ="is_recur"
426 trigger_value ="true"
427 target_element_id ="recurFields"
428 target_element_type ="table-row"
433 {if $form.adjust_recur_start_date}
434 {include file="CRM/common/showHideByFieldValue.tpl"
435 trigger_field_id ="adjust_recur_start_date"
436 trigger_value ="true"
437 target_element_id ="recurDefaults"
438 target_element_type ="table-row"
444 {include file="CRM/common/showHideByFieldValue.tpl"
445 trigger_field_id = "is_pledge_active"
446 trigger_value = "true"
447 target_element_id = "pledgeFields"
448 target_element_type = "table-row"
456 <script type="text/javascript">
458 $("#quickconfig").click(function(e) {
462 message: {/literal}"{ts escape='js'}Once you switch to using a Price Set, you won't be able to switch back to your existing settings below except by re-entering them. Are you sure you want to switch to a Price Set?{/ts}"{literal}
463 }).on('crmConfirm:yes', function() {
465 var dataUrl = '{crmURL p="civicrm/ajax/rest" h=0 q="className=CRM_Core_Page_AJAX&fnName=setIsQuickConfig&context=civicrm_contribution_page&id=$contributionPageID" }';
467 $.getJSON(dataUrl).done(function(result) {window.location = CRM.url("civicrm/admin/price/field", {reset: 1, action: 'browse', sid: result});});
475 {crmRegion name="contribute-form-contributionpage-amount-post"}