I created this smart PayPal form for Trekkers.org. See trekkers.org/donate/. It lets the user switch back and forth between recurring and one-time donations. I couldn’t find a free plugin that can do this.
If this is installed on a WordPress or other CMS site, it is better set up as a plugin. A site owner does not need to lose all functionality just because he/she switches themes.
<div class="donationContainer">
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank" id="recurringHiddenInputs">
<input type="hidden" name="item_name" value="Donation">
<input type="hidden" name="business" value="donations@non-profit.org">
<input type="hidden" name="lc" value="US">
<input type="hidden" name="no_shipping" value="1">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="return" value="http://your-site.org/thankyou/">
<input type="hidden" name="p3" value="1" class="recurring">
<input type="hidden" name="src" value="1" class="recurring">
<input type="hidden" name="no_note" value="0" class="recurring">
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donateCC_LG.gif:NonHostedGuest" class="recurring">
<table>
<tbody>
<tr>
<td colspan="2" style="padding: 0 1px;"><h4>Donate by Paypal</h4></td>
</tr>
<tr>
<td>Please select <span>*</span></td>
<td>
<div class="radio-choice">
<input type="radio" name="cmd" value="_xclick-subscriptions" id="severalTimes" checked>
<label for="severalTimes">Recurring Donation</label>
<input type="radio" name="cmd" value="_donations" id="oneTime">
<label for="oneTime">One-time Donation</label>
</div>
</td>
</tr>
<tr>
<td class="firstcol"><label for="amountInput">Donation amount ($) <span>*</span></label></td>
<td id="donationAmount"><input type="text" name="a3" placeholder="25" class="recurring" id="amountInput"></td>
</tr>
<tr id="recurringFrequency">
<td class="recurring"><label for="frequency">Frequency</label></td>
<td class="recurring"><select name="t3" id="frequency">
<option value="M" selected="selected">Monthly</option>
<option value="Y">Yearly</option>
</select></td>
</tr>
<tr>
<td><input type="hidden" name="on0" value="Program"> <label for="os0">Gift made to:</label></td>
<td><select name="os0" id="os0">
<option value="General Operating Budget">General Operating Fund</option>
<option value="Scholarship Fund">Scholarship Fund</option>
<option value="Equipment Fund">Equipment Fund</option>
<option value="Bus Maintenance">Bus Maintenance Fund</option>
</select></td>
</tr>
<tr>
<td><input type="hidden" name="on1" value="Dedicated to"> <label for="os1">Donation made<br>in honor of:</label></td>
<td><input name="os1" type="text" placeholder="name" id="os1"></td>
</tr>
<tr>
<td colspan="2" class="paypal-button">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" name="submit" alt="Donate by PayPal"></td>
</tr>
<tr>
<td colspan="2" class="required"><span>* required</span></td>
</tr>
</tbody>
</table>
</form>
</div>
It requires this bit of jQuery to switch the forms:
jQuery(document).ready(function($) {
$("input[id='oneTime']").change(function() {
if ($(this).is(':checked')) {
$('.recurring').remove();
$('#donationAmount').append('<input type="text" name="amount" placeholder="25" class="oneTime" id="amountInput">');
}
});
$("input[id='severalTimes']").change(function() {
if ($(this).is(':checked')) {
$('.oneTime').remove();
$('#recurringFrequency').append('<td class="recurring"><label for="frequency">Frequency</label></td>
<td class="recurring"><select name="t3" id="frequency">
<option value="M" selected="selected">Monthly</option>
<option value="Y">Yearly</option></select></td>');
$('#recurringHiddenInputs').append(' <input type="hidden" name="p3" value="1" class="recurring">
<input type="hidden" name="src" value="1" class="recurring">
<input type="hidden" name="no_note" value="0" class="recurring">
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donateCC_LG.gif:NonHostedGuest" class="recurring"> ');
$('#donationAmount').append('<input type="text" name="a3" placeholder="25" class="recurring">');
}
})
});