WordPress Development for the ANIJ

CarteJeunes.lu Client: ANIJ - Agence Nationale pour l'Information des Jeunes a.s.b.l.

Plugin

Extended user profile

Building on existing plug-ins and native WordPress functionality, TenTwentyFour1024 built a system for the Luxembourgian Centre Information Jeunes to manage CarteJeunes members entirely using the WordPress system they've come to know and like in the past couple of years.

Statistics

The CIJ CarteJeunes plug-in extends registration forms, user-profiles as well as filters, actions, and bulk-actions on the user-list in WordPress' admin back-end. It tracks payment information, generates unique Membership IDs for several organisations across a WordPress multisite installation, and allows to create PDFs for cards conforming to the ISO/IEC 7810 ID-1 standard individually or in batches.

Each generated card sets a time-stamp on the respective user, further allowing to filter out people who already have a card, select all the remaining users, and batch-generate either cards, or even labels for postage. A cron-job checks expiry dates on memberships tracked through the plug-in and notifies administrators of that pending expiry.

2019

The plugins functionality was extended to directly register new youth cards as well as synchronize discounts with the European Youth Card Association (EYCA) databases using the two different APIs provided for that purpose.

The youth card enables holders to profit from a variety of discounts and other advantages throughout the european union. Each local EYCA member organization coordinates the creation and communication of new special offers in their country and forwards them to the EYCA. To simplify this process, TenTwentyFour1024 augmented the existing WordPress plugin to allow creating and updating youth card discounts directly from the WordPress administration interface.

The EYCA provides their national members with a GraphQL API to create and manage the different discounts offered locally as well as a REST API for managing youth card identification codes and validity periods.

The same endpoint was used to load categories, tags and vendor data from the EYCA database ensuring hassle-free synchronization of all stored data between the ANIJ and the EYCA.

Theme

cartejeunes.lu as
            seen on mobile phones

In 2019 ANIJ tasked TenTwentyFour1024 to implement a new look and feel for the CarteJeunes website.

The theme is based on a design by SO Graphiste which combines the vibrant colors of the European Youth Card brand with graffiti-style elements to grab the attention of the websites young audiences. Different user-modifiable post, page and element titles had to be split in two parts to achieve the desired graffiti-style which provided an additional challenge on the content managment side, solved with custom Gutenberg blocks.

Frontpage of cartejeunes.lu

As the website had been updated to run on the latest version of WordPress a while ago, as part of a maintenance contract, theme development was able to take full advantage of the extended page building capabilities of the Gutenberg editor introduced in late 2018.

TenTwentyFour1024 developed a set of customized blocks, pieces of content that you insert onto your WordPress post or page, for the new website. This provides our customers with a never before seen flexibility when modifying and re-structuring the content on their website without the need of extended technical knowledge.

EuroDesk.luClient: ANIJ - Agence Nationale pour l'Information des Jeunes a.s.b.l.

Plugin

Search for opportunities to go abroad

For the same organisation, TenTwentyFour1024 built a plug-in to synchronize program entries from the European EuroDesk database through their OAuth-protected API, then list and display them directly on the national EuroDesk website, eurodesk.lu.

This WordPress Importer/Visualizer plug-in imports all contents retrieved from the EuroDesk database into WordPress Custom Post Types and Taxonomies, thus allowing to use and manipulate the data just like any other WordPress content, using it in widgets, including it in site-wide searches, etc.

Theme

eurodesk.lu as seen on mobile phones

In late 2020 TenTwentyFour1024 started the implementation of a design refresh for the EuroDesk website. As for CarteJeunes the design was created by SO Graphiste following the EuroDesk brand guidelines.

The design uses a mobile friendly full-width layout featuring a set of content sliders on the front-page.

Frontpage of eurodesk.lu

The custom theme is completed with a small plugin simplifying the content management task with additional taxonomies and post meta fields.

Technologies used in building this application

PHP

PHP is a popular general-purpose scripting language that is especially suited to web development. Fast, flexible and pragmatic, PHP powers everything from your blog to the most popular websites in the world. (+)

Pimple

Pimple is a simple PHP Dependency Injection Container used – for instance – at the core of the Silex micro-framework. We use Pimple to decouple the interfaces that we use from our concrete implementations and thus improve maintainability and testability of our code. (+)

WordPress

WordPress is a free and open-source content management system (CMS) based on PHP and MySQL. Based around hooks and filters, the core WordPress application can be extended to do almost anything. (+)

TCPDF

TCPDF is an Open Source PHP class for generating PDF documents that does not require any external libraries, supports standard and custom page formats, and brings full support for UTF-8 Unicode. (+)

SASS

Sass (short for syntactically awesome style sheets) is a preprocessor scripting language that is interpreted or compiled into Cascading Style Sheets (CSS). (+)

Bootstrap

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web. Bootstrap makes creating good-looking website easy and allowed us to focus on the functional aspects of the application. (+)

jQuery

jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. (+)

OAuth 2.0

OAuth 2.0 is a protocol for authentication and authorization that focuses on client developer simplicity while providing specific authorization flows for web applications, desktop applications, mobile phones, and living room devices. (+)

GraphQL

GraphQL is an open-source data query and manipulation language for APIs, and a runtime for fulfilling queries with existing data. (+)