Donation form with horizontal one-time gift and monthly gift on one line?

You would definitely need to use Javascript (big time) and CSS to make that happened. Two alternatives:

1. ​You build a donation API from scratch which will allow you to have the full flexibility in placing the components and rendering the donation forms in any layout you might desire.  Check - http://open.convio.com/api/#donation_api  for the API documentation  where at the very least you'll need both the "donate" and "startDonation" methods
   
    
2. Or you could built on top the regular out-of-the-box Donation2 form, using jQuery to manipulate the DOM (i.e moving around those donation ask levels component into the 2 div columns, relabeling, remapping those click listeners from the radio button of those ask amount onto their associated CSS buttons). You can tap into the bootstrap framework to speed up customizing the layout in responsive manner.

Out of the two options, I would say try with Option #1 due to the flexibility you have with regards of mapping the component to the backend LO donation. Sometimes manipulating the DOM out of the default Donation2 form is not as flexible as the API donation due to there might be default listeners that LO has on its donation forms that is mapped with regards to the container / elements parents - child relationship, that might potentially breaks if you simply just move them around outside of their respective parent containers, that type of situation.


regards,

Daniel 


EDIT ADD ON:

Actually there might be 3 options, here's the 3rd Option that you could consider -

• You could build a teaser / splash landing page with that rendering where upon "submit", it will bring user to the actual donation forms with their selection carry forward on it through the use of URL setter / parameters.   
  • set.DonationLevel=REPLACEWITHDONATIONLEVELID&set.Value=1000     -- This will prepopulate that "Other" amount --Note value last 2 digit is cents, so 1000 is USD 10  for "Other" free typed amount
  • setDonationLevel=REPLACEWITHDONATIONLEVELID     -- this will auto select the fixed amount you set within the actual donation form
  • set.BillingFirstName=REPLACEWITHFIRSTNAME   -- this will set the billing first name to whatever value you pass into
  • set.BillingLastNAme=REPLACEWITHLASTNAME -- this will set the billing last name to whatever value you pass into.

Libby London:

Hello!  

  I am looking to make a new donation form in LO.  Currently we have page wrappers for various donation forms that have full width headers, side nav bars, or no side nav bars.  However, I'm looking to make a donation form that has two content areas that are full width on top, and then having the side bar lower down.  I also need to have my one-time gift and monthly gift options on one line horizontally accross the full width of the page, thus pushing my side bar down the page. Is this possible?  I have a little big of js experience, but I'm hoping to not make a bunch of custom code.


I've attached a screenshot of what I'm looking to make.


Thanks!!