How To Update Credit Card Info in AccessAlly When Using Infusionsoft

Are you using Infusionsoft’s e-commerce system to sell your products, offers, and subscriptions? AccessAlly includes a simple shortcode that you can use for clients to update their own credit card information inside the membership site.

Shortcode:

[accessally_credit_card_update]

Or use the shortcode adder:

Credit card shortcode adder

(Infusionsoft ONLY) This shortcode lets users see which credit cards they currently have on file. You can also let them add a new card or update an existing one with this shortcode.

This shortcode will allow users to update the credit card(s) they have on file, so that successful subscription payments (made through the Infusionsoft order forms) can go through.

The tutorial on this page shows you how to do it.

Video Tutorial: Update Credit Cards (Infusionsoft users ONLY)

STYLING CODE USED IN VIDEO

.accessally-credit-card-view-section {
margin:10px 0;
border:1px solid #e4e4e4;
}
.accessally-credit-card-view-id-section {
display:none;
}
.accessally-credit-card-view-content-section {
display:inline-block;
width:90%;
}
.accessally-credit-card-view-label-column {
display:inline-block;
width:150px;
text-align:right;
padding-right:20px;
}
.accessally-credit-card-view-content-column {
display:inline-block;
}
input.accessally-credit-card-edit-button, a.accessally-credit-card-edit-button {
background-color: #00a5b3;
border: none;
padding: 10px 15px;
color: white;
border-radius: 5px;
box-shadow: 0 0 3px 3px #f1f1f1;
cursor: pointer;
font-size: 12px;
text-decoration:none;
}
input.accessally-credit-card-edit-button:hover, a.accessally-credit-card-edit-button:hover {
background-color: #a9b533;
}
.accessally-credit-card-success-message {
color:green;
background-color: #eafdfd;
padding: 10px;
border: 1px solid #e4e4e4;
-webkit-box-shadow: none;
box-shadow:none;
margin: 10px auto;
}
.accessally-credit-card-error-message {
color:red;
background-color: #eafdfd;
padding: 10px;
border: 1px solid #e4e4e4;
-webkit-box-shadow: none;
box-shadow:none;
margin: 10px auto;
}
.accessally-credit-card-edit-label-column {
display:inline-block;
width:30%;
vertical-align:middle;
}
.accessally-credit-card-edit-input-column {
display:inline-block;
width:50%;
vertical-align:middle;
}
.accessally-credit-card-edit-row {
height:40px;
}
.accessally-credit-card-edit-input-column input{
padding:8px 5px;
width:100%;
}
.accessally-credit-card-edit-input-column select{
height:31px;
}

Written Tutorial: Update Credit Cards (Infusionsoft users ONLY)

Step 1: Go to AccessAlly > User Account Ops

STEP 2: Enable Credit Card Management

Check the box to enable this shortcode. By default, users cannot update the existing credit card on file. This helps prevent a working credit card to become invalidated.

However, if you’d like to allow your users to update/edit the credit cards they have on file, simply check the corresponding box.

STEP 3: Add shortcode to page

Add the shortcode [accessally_credit_card_update] to the page of your choice.

Without the “Allow updating existing credit card” enabled, the information will appear as follows:

If you have enabled the box to allow users to update existing credit cards, a new “update” button will appear:

Updated on March 22, 2018

Related Articles