TeamRaiser Responsive Layout - Incomplete?

Brian Mucha

I'm working with the new 'responsive' layout option. The last two steps of registration - Billing Information and Confirmation - do not offer the responsive layout.

 

This means that the old style Progress Box returns right in the middle of a multi-step registration process.

 

Even worse, all the step buttons change location. This means that suddenly 'cancel' is where 'next' used to be. So after 5 pages our users will accidentally hit cancel.

 

This totally ruins this new feature. Has anyone else noticed this??

Aubrey Miller-Schmidt

Yes, I've noticed this. Also, the wrapper for the responsive site doesn't work properly out of the box.

Brian Mucha

Aubrey Miller-Schmidt:

Yes, I've noticed this. Also, the wrapper for the responsive site doesn't work properly out of the box.

This is inexcusable if this is really the case.

 

Unless its a recent regression, I don't see how it could have gotten past any sort of reasonable QA.

 

FOLLOW-UP EDIT: So, it wasn't a QA mistake or design omission. Yay! It was a confusing/missing part of the configuration.

Brian Mucha

Brian Mucha:

This is inexcusable if this is really the case.

 

Unless its a recent regression, I don't see how it could have gotten past any sort of reasonable QA.

 

FOLLOW-UP EDIT: So, it wasn't a QA mistake or design omission. Yay! It was a confusing/missing part of the configuration.

Okay - I just reported my FOURTH responsive layout bug so far.

 

The latest three occur on the Donation Form Thank You page.

 

1) There are <TR> and <TD> tags left in the template that should not be there, and they have no matching <TABLE>.

 

2) The opening DIV (<div class="donation-form-container responsive">) is not closed. This is the worst, and really messes up the layout.

 

3) The Employer Email field has an html fragment visible to the user.

 

<span class="entry-value"><a href="mailto:devnull@convio.com">devnull@convio.com</a>an></span>

 

EDIT: At first I thought bug 1 was a big deal, but bug 2 was responsible for the problems.The error correction in browsers seems to handle the errant table tags okay.

 

You can fix bug 2 - my real problem - with this S-Tag hack in your pagewrapper right after the body placeholder tag.

 

[[S63:3]]

[[?[[S8]]::donation=completed::</div>:: ]]

 

Fortunately the missing tag is in the outermost container, which makes this possible. Of course once/if Convio makes a fix this will have to be removed or the fix itself will cause similar problems.

 

Bug 3 is cosmetic, so I haven't spent much time on it yet.

Kent Gilliam

Brian Mucha:

Okay - I just reported my FOURTH responsive layout bug so far.

 

The latest three occur on the Donation Form Thank You page.

 

1) There are <TR> and <TD> tags left in the template that should not be there, and they have no matching <TABLE>.

 

2) The opening DIV (<div class="donation-form-container responsive">) is not closed. This is the worst, and really messes up the layout.

 

3) The Employer Email field has an html fragment visible to the user.

 

<span class="entry-value"><a href="mailto:devnull@convio.com">devnull@convio.com</a>an></span>

 

EDIT: At first I thought bug 1 was a big deal, but bug 2 was responsible for the problems.The error correction in browsers seems to handle the errant table tags okay.

 

You can fix bug 2 - my real problem - with this S-Tag hack in your pagewrapper right after the body placeholder tag.

 

[[S63:3]]

[[?[[S8]]::donation=completed::</div>:: ]]

 

Fortunately the missing tag is in the outermost container, which makes this possible. Of course once/if Convio makes a fix this will have to be removed or the fix itself will cause similar problems.

 

Bug 3 is cosmetic, so I haven't spent much time on it yet.

Hey all...

 

I just passed this thread along to our product team. Please share anything you can about issues you've seen with Responsive Design. I've asked them to have someone take a look at this thread and respond.

 

Kent

Brian Mucha

Kent Gilliam:

Hey all...

 

I just passed this thread along to our product team. Please share anything you can about issues you've seen with Responsive Design. I've asked them to have someone take a look at this thread and respond.

 

Kent

Since the product team will hopefully look at this, here's a minor aside...

 

You know many if not most people customize the appearance of these things. The way you have chosen to organize all these style sheets doesn't make that very easy. There are dozens of tags and classes across the uneditable teamraiser sheets that specify fonts alone. So if I want to change the font, I have to hunt down and override tons of tags.

 

Why not move all those font and color styles to a new sheet that we can edit, like CustomStyles, and leave the layout stuff where it is? Instant TR themes.

 

It shouldn't break anyone's existing design if you maintain the current heirarchy in this new theme.css file, it would simply be rearranging the existing sheets to facilitate rather than hinder customization.

 

/ Or just let us turn off your styles sheets and use our own entirely.

 

 

Brian Mucha

Aubrey Miller-Schmidt:

Yes, I've noticed this. Also, the wrapper for the responsive site doesn't work properly out of the box.

So, I received a PM from Kent, relaying the response from the Product Team.

 

They addressed the initial part of this thread regarding the last page of the teamraiser registration process not being responsive.

 

The Problem:

On every other page in the registration wizard the responsive layout is selected on the TeamRaiser Page in Step 12. Customize Pages. However on the Billing Information and Confirmation pages, the responsive option is not offered.

 

The Product Team says:

Enable the Donations 2 Registration Transaction Processing EDP under step 3 (Select Event Options) and then the related action "Edit Advanced Options".

 

Solution:

Go to Step 3 Select Event Options, down at the bottom under Edit Advance options, and there you will find EDP 22 - Donations 2 Registration Transaction Processing. Check that field and you now get a responsive layout for the remaining payment pages.

 

Hurray!

Brian Mucha

Brian Mucha:

Okay - I just reported my FOURTH responsive layout bug so far.

 

The latest three occur on the Donation Form Thank You page.

 

1) There are <TR> and <TD> tags left in the template that should not be there, and they have no matching <TABLE>.

 

2) The opening DIV (<div class="donation-form-container responsive">) is not closed. This is the worst, and really messes up the layout.

 

3) The Employer Email field has an html fragment visible to the user.

 

<span class="entry-value"><a href="mailto:devnull@convio.com">devnull@convio.com</a>an></span>

 

EDIT: At first I thought bug 1 was a big deal, but bug 2 was responsible for the problems.The error correction in browsers seems to handle the errant table tags okay.

 

You can fix bug 2 - my real problem - with this S-Tag hack in your pagewrapper right after the body placeholder tag.

 

[[S63:3]]

[[?[[S8]]::donation=completed::</div>:: ]]

 

Fortunately the missing tag is in the outermost container, which makes this possible. Of course once/if Convio makes a fix this will have to be removed or the fix itself will cause similar problems.

 

Bug 3 is cosmetic, so I haven't spent much time on it yet.

The Product Team also addressed some of the Donation Form problems.

 

They confirm the errant <TR> and <TD>, which will be corrected.

 

I will update this when I find out more about the other two items (unclosed DIV and the email address HTML)

 

Thanks Kent!

Kent Gilliam

Brian Mucha:

So, I received a PM from Kent, relaying the response from the Product Team.

 

They addressed the initial part of this thread regarding the last page of the teamraiser registration process not being responsive.

 

The Problem:

On every other page in the registration wizard the responsive layout is selected on the TeamRaiser Page in Step 12. Customize Pages. However on the Billing Information and Confirmation pages, the responsive option is not offered.

 

The Product Team says:

Enable the Donations 2 Registration Transaction Processing EDP under step 3 (Select Event Options) and then the related action "Edit Advanced Options".

 

Solution:

Go to Step 3 Select Event Options, down at the bottom under Edit Advance options, and there you will find EDP 22 - Donations 2 Registration Transaction Processing. Check that field and you now get a responsive layout for the remaining payment pages.

 

Hurray!

Hi all. I haven't had a chance to check the documentation on this but if the documentation needs to be improved, please let me know so I can pass along to the team.



Thanks!

Kent

Brian Mucha

Kent Gilliam:
Hi all. I haven't had a chance to check the documentation on this but if the documentation needs to be improved, please let me know so I can pass along to the team.



Thanks!

Kent

The TeamRaiser Configuration Chart does not include this field: Donations 2 Registration Transaction Processing

 

It is mentioned in the help for the page.

 

For Donations 2 Registration Transaction Processing, click the checkbox to enable the additional payment options allowed in Donations 2 (which include Amazon, PayPal, and bank account withdrawals) and enable the mobile-enhanced responsive layouts for TeamRaiser registration payments.

 

But thats assuming you had any idea to look to this advanced settings page for that EDP.

 

The release notes has a link to a youtube video (https://www.youtube.com/watch?v=tqyxEVBcNIU) that clearly mentions this EDP, but does not say that responsive design is related to it. It says that if you check the box the visitors will be able pay with additional options such as ACH, Paypal, etc. in addition to credit cards.

 

I think I would stick something on the two Teamraiser Pages next to the Layout field, where we expect to find the setting.

Lyn Maloney

Brian Mucha:

The TeamRaiser Configuration Chart does not include this field: Donations 2 Registration Transaction Processing

 

It is mentioned in the help for the page.

 

For Donations 2 Registration Transaction Processing, click the checkbox to enable the additional payment options allowed in Donations 2 (which include Amazon, PayPal, and bank account withdrawals) and enable the mobile-enhanced responsive layouts for TeamRaiser registration payments.

 

But thats assuming you had any idea to look to this advanced settings page for that EDP.

 

The release notes has a link to a youtube video (https://www.youtube.com/watch?v=tqyxEVBcNIU) that clearly mentions this EDP, but does not say that responsive design is related to it. It says that if you check the box the visitors will be able pay with additional options such as ACH, Paypal, etc. in addition to credit cards.

 

I think I would stick something on the two Teamraiser Pages next to the Layout field, where we expect to find the setting.

Brian,

 

Just to let you know, the currently published TeamRaiser Configuration Chart help contains the Donations 2 Registration Transaction Processing option with the explanation "Determines if alternate payment processors (like Amazon and PayPal) are accepted and if the mobile-ready responsive registration layouts are available."

 

We appreciate you letting us know your concerns.

 

Best regards,

Lyn Maloney

Staff Technical Writer

Brian Mucha

Lyn Maloney:

Brian,

 

Just to let you know, the currently published TeamRaiser Configuration Chart help contains the Donations 2 Registration Transaction Processing option with the explanation "Determines if alternate payment processors (like Amazon and PayPal) are accepted and if the mobile-ready responsive registration layouts are available."

 

We appreciate you letting us know your concerns.

 

Best regards,

Lyn Maloney

Staff Technical Writer

Sorry about that. "Donations 2 Transaction Processing" is the option that is listed. I was searching for the field's label "Donations 2 Registration Transaction Processing", which is also how it's listed in that other help doc I referenced.

 

I think I actually did notice this entry, but stupidly didn't look closely enough because I assumed this was refering to a separate setting for the donation form, which has been working fine this whole time.

Lyn Maloney

Brian Mucha:

Sorry about that. "Donations 2 Transaction Processing" is the option that is listed. I was searching for the field's label "Donations 2 Registration Transaction Processing", which is also how it's listed in that other help doc I referenced.

 

I think I actually did notice this entry, but stupidly didn't look closely enough because I assumed this was refering to a separate setting for the donation form, which has been working fine this whole time.

Oh, I see now. I will add a synonym reference to avoid confusion. That should help!

Brian Mucha

Lyn Maloney:
Oh, I see now. I will add a synonym reference to avoid confusion. That should help!

This is one of those TeamRaiser settings weirdnesses. (All the settings are on step 11, except this one which is on step 2.)

 

I'm sure there are internal technical reasons, but it isn't what you'd expect. Why does this Donation 2 setting control the entire responsive layout? I'd expect a responsive choice on the custom page layout setting which gave me the responsive progress-bar design and all that, but with a dumb donation classic form in the middle of it from the incorrect step 2 settings.

 

My form choice on step 2 is affecting what I see as page level stuff that belongs on step 11.

 

The other custom pages which are not responsive have layout settings which also are missing the responsive choice, so it leads you to believe these registration steps are not done either. A few others here in the community apparently thought the same.

 

I'd say a big bold line of red type in the documentation rather than the second half of a sentence would be better for this point. Even better would be a little note or label near the actual layout settings on the custom page UI noting the weird location.

 

 

Lyn Maloney

Brian Mucha:

This is one of those TeamRaiser settings weirdnesses. (All the settings are on step 11, except this one which is on step 2.)

 

I'm sure there are internal technical reasons, but it isn't what you'd expect. Why does this Donation 2 setting control the entire responsive layout? I'd expect a responsive choice on the custom page layout setting which gave me the responsive progress-bar design and all that, but with a dumb donation classic form in the middle of it from the incorrect step 2 settings.

 

My form choice on step 2 is affecting what I see as page level stuff that belongs on step 11.

 

The other custom pages which are not responsive have layout settings which also are missing the responsive choice, so it leads you to believe these registration steps are not done either. A few others here in the community apparently thought the same.

 

I'd say a big bold line of red type in the documentation rather than the second half of a sentence would be better for this point. Even better would be a little note or label near the actual layout settings on the custom page UI noting the weird location.

 

 

In the Version 11 release planned for July/Aug, we have added the Responsive Layout to many more pages, including the Custom page. And we are crafting a how-to topic for making the TeamRaiser event pages responsive. I will review our currently published help and see what I can add to mitigate the problems until the new topic is available.

 

Regards,

 

Lyn Maloney

Staff Technical Writer

Blackbaud, Inc.

Brian Mucha

Lyn Maloney:

Brian,

 

Just to let you know, the currently published TeamRaiser Configuration Chart help contains the Donations 2 Registration Transaction Processing option with the explanation "Determines if alternate payment processors (like Amazon and PayPal) are accepted and if the mobile-ready responsive registration layouts are available."

 

We appreciate you letting us know your concerns.

 

Best regards,

Lyn Maloney

Staff Technical Writer

Hey Lyn, I sure wish the Technical Writers would start up and watch a forum here. I've seen (and posted) lots of suggestions and complaints about the documentation. I'm not sure if reporting stuff like that to support goes anywhere.

 

I've seen some case errors in case-sensitive tags, or confusing bits. I see lots of people wishing for more complete basic code examples. I even suggested to set up the docs like a wiki so we could offer revisions directly, but just having a forum here would do it.

Tara Irwin

Brian Mucha:

So, I received a PM from Kent, relaying the response from the Product Team.

 

They addressed the initial part of this thread regarding the last page of the teamraiser registration process not being responsive.

 

The Problem:

On every other page in the registration wizard the responsive layout is selected on the TeamRaiser Page in Step 12. Customize Pages. However on the Billing Information and Confirmation pages, the responsive option is not offered.

 

The Product Team says:

Enable the Donations 2 Registration Transaction Processing EDP under step 3 (Select Event Options) and then the related action "Edit Advanced Options".

 

Solution:

Go to Step 3 Select Event Options, down at the bottom under Edit Advance options, and there you will find EDP 22 - Donations 2 Registration Transaction Processing. Check that field and you now get a responsive layout for the remaining payment pages.

 

Hurray!

Whoa! Roundabout way to activate this, but it seems to be working in my testing.  

 

Thanks for sharing this--very much appreciated!

 

-Tara