Improvements to the attendees shortcode

With large WordCamps like WordCampWordCamp A WordCamp is a conference where the WordPress community come together to teach one another what they’ve learned throughout the year and share the joy. https://central.wordcamp.org/about/. Europe and WordCamp US, the current implementation of the attendees shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. becomes a problem. Showing more than 2000 attendees on a single page is not only bad for performance, but also for UXUX UX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it. (like scrolling such a long page on a mobile and loading all the attendees including images).

Current performance optimizations

The current implementation of the shortcode has some tricks to increase the performance. For longer attendees lists, they are loaded in batches of 200. The generated HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. of all attendees is cached in a transient for 1 hour (24 hours after the WordCamp).

To help with the attendees GravatarGravatar Is an acronym for Globally Recognized Avatar. It is the avatar system managed by WordPress.com, and used within the WordPress software. https://gravatar.com/. images, a lazy loading mechanism was implemented. This is very useful not only on desktop, but also helps on mobile saving bandwidth.

Improvements with the new shortcode

For the new default theme the WordCamp Europe team is working on, “CampSite 2017”, we first thought about implementing an archive page for the attendees page. But this would be inflexible and it would also only help the new default theme. The current shortcode also offers some attributes to show content gathered from attendees through additional questions. This would not be as easy with an archive page template. So we instead are trying to improve the shortcode.
Adding pagination to the shortcode
Although the current shortcode has an posts_per_page attribute, this does not add a pagination to the shortcode, but only reduces the number of visible attendees. So that doesn’t help. But we changed this attribute to enable pagination links, if present:

Attendees list with pagination links

The pagination use function paginate_link with accessible links.

Adding a search for attendees

One benefit of having all attendees on a single page is an easy search for them using the browser search. On a paginated page, a search makes it also easy to search for friends and colleagues on the attendees list. Adding the search field can be done with the new with_search attribute set to true:

Attendees list with search field

The search result is also paginated with the same number of attendees per page.

Keeping backward compatibility

As changing the shortcode will affect any WordCamp site, we implemented the new features in a way, that they are only active, if the attributes posts_per_page and/or with_search are set. We also kept the image lazy loading and we still cache the resulting HTML (per page/search) in a transient.

Feedback

For the upcoming WordCamp Europe (June), we would really like to see this new feature available as soon as possible. Please feel free to give us your feedback on the new functionality so we can move forward.

#wordcamps #feature-request