Hospa – Theme Documentation

Setup Donate Us Form

Setup Donate Us Form

Here is the code for Contact Form 7 donate form code:

<div class="donate-form-content">
    <div class="inner-wrap">
        <div class="top-title">
            <h2>Donate Us</h2>
            <ul class="list">
                <li>
                    <a href="#">HOME</a>
                </li>
                <li>DONATE US</li>
            </ul>
        </div>
        <div class="content">
            <h3>One Time Gift</h3>
            <p>Your one-time gift will help Meca General Foundation meet the hospital's most urgent needs. From upgrades, to new and replacement equipment, we depend on donations like yours to provide the best care for patients and families in the many diverse communities we serve.</p>
        </div>
        <div class="information">
            <h3>Gift Amount</h3>
            <div class="amount-list">
                [radio amount label_first use_label_element default:1 "$50|50.00" "$100|100.00" "$250|250"]
            </div>
            <span>I want to support the most urgent needs of Meca General</span>
            <div class="form-group">
                [radio gift-type class:form-check-label use_label_element default:1 "Use my gift where it is needed most." "Specify an area for the gift to support"]
            </div>
            <div class="form-group">
                [select* programs class:form-select class:form-control "Hemoglobin A1C" "Urinalysis" "MRI & CT Scan" "Ultrasound"]
            </div>
        </div>
    </div>
    <div class="inner-wrap">
        <div class="information">
            <h3>Donor Information</h3>
            <div class="form-group">
                [radio donor-info class:form-check-label use_label_element default:1 "Make this gift on behalf of an organization" "I do NOT wish to be listed as a donor in any Foundation publication(s)."]
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-6 col-md-12">
                    <div class="form-group">
                        <label>Donor First Name</label>
                        [text* name class:form-control placeholder "Add first name"]
                    </div>
                </div>
                <div class="col-lg-6 col-md-12">
                    <div class="form-group">
                        <label>Donor Last Name</label>
                        [text* last-name class:form-control placeholder "Add last name"]
                    </div>
                </div>
                <div class="col-lg-6 col-md-12">
                    <div class="form-group">
                        <label>Address</label>
                        [text* address class:form-control placeholder "Add address"]
                    </div>
                </div>
                <div class="col-lg-6 col-md-12">
                    <div class="form-group">
                        <label>City</label>
                        [select* city class:form-select class:form-control "Vancouver" "Toronto" "Winnipeg" "Ottawa"]
                    </div>
                </div>
                <div class="col-lg-12 col-md-12">
                    <div class="form-group">
                        <label>Phone No</label>
                        [number phone-number class:form-control placeholder "Add phone no"]
                    </div>
                </div>
                <div class="col-lg-12 col-md-12">
                    <div class="form-group">
                        <label>Email Address</label>
                        [email* email class:form-control placeholder "Email Address"]
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="inner-wrap">
        <div class="information">
            <div class="bottom">
                <h3>Legacy Giving</h3>
                <div class="form-group">
                    <div class="form-check">
                        [checkbox legacy-giving class:form-check-label use_label_element "I would like to receive information about leaving a gift in my will."]
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="inner-wrap">
        <div class="donate-btn">
            <button type="submit" class="default-btn">
                <i class="ti ti-circle-arrow-right-filled"></i>
                Donate
            </button>
        </div>
        <div class="alert-text">
            <i class="ti ti-alert-circle-filled"></i>
            <p>Having Trouble? Contact the Foundation directly to make your gift at: 416-356-6946</p>
        </div>
    </div>
</div>