back to web creation
Zobrazení webu Czechia2026, pro full HD, notebook, tablet a mobil
Technical solution: 

When the Czech Republic was selected as the Guest of Honour (Czechia2026) at the 2026 Frankfurt Book Fair, the Moravian Library needed a website that would worthily present Czech literature to an international audience. The result is a comprehensive presentation platform with advanced filters, three language versions, and hundreds of events distributed across three program sections. The website combines technical solutions with the project's visual identity - including a characteristic animated wave that accompanies navigation.

Brief

The website serves as the main information source for book professionals, media, and the general public from around the world.

Key project requirements:

  • Presentation of authors invited to the fair, their books translated into German, and translators.
  • Comprehensive event calendar divided into three program sections: Year of Czech Culture (before the fair), Frankfurt 2026 (main program), and ECHO (post-fair events).
  • Three full-featured language versions (Czech, German, English).
  • Advanced filtering and search across all sections.
  • Gradual website launch in several phases according to content preparation.
  • Modern design with a characteristic animated wave from the project's visual identity.

The web design was created by Bušek+Dienstbier graphic studio. My task was the technical implementation - converting the design into a functional web application with emphasis on performance, usability, and easy content management for multiple editors.

Solution

Content Organization Using Custom Post Types

The project required structured presentation of various content types with relationships between them. I created custom post types for each category:

Authors and Translators - profiles with biographies, photographs, and lists of works. Connection to their participation in program events.

Contemporary Book Translations into German - database of books translated into German between 2024-2026. Each book contains information about the author, translator, Czech and foreign publishers including links to their e-shops.

Dramaturgy Board and Team - members of the dramaturgy board and organizational team. Simpler structure with photograph, biography, and contacts.

Publishers - Czech publishing houses.

All post types are fully integrated with the Polylang translation plugin. Each language version has synchronized content with the possibility of minor localization adjustments according to the target audience.

Advanced Program Filtering System

Events - the most complex page with a rich structure of ACF fields. Contains date and time, event type (reading, theater, exhibition, concert, debate, lecture, festival), venue, participating authors (as a link to their profiles), and external participants (text field with semicolon as separator). Each event generates a link for adding to Google Calendar.

The event program presented the biggest technical challenge. Hundreds of events distributed across three time periods (Year of Czech Culture, Frankfurt 2026, ECHO) required an intuitive interface for navigation.

I created an AJAX filtering system with four simultaneously functioning criteria:

  • Event Type - select box with options between reading, theater, exhibition, concert, debate, lecture, and festival.
  • Performers - dynamically generated list of all authors from the database and external participants, alphabetically sorted.
  • Date - combination of select boxes and Flatpickr calendar for precise time range selection.
  • Location - filtering by venue.

Beyond these filters is a "current only" checkbox that automatically hides past events. All filters work together - users can, for example, find all readings with a specific author in Berlin during a certain period.

Technical implementation uses:

AJAX loading - changing any filter immediately updates the event listing without page reload. The request contains all active filters and returns only relevant results.

  • URL tracking - filter state is saved to URL parameters. Users can share a link to a specific filtered listing. When loading the page, filters automatically set according to the URL.
  • Intelligent pagination - when browsing pages, all active filters are preserved. Pagination links contain filter URL parameters, so users don't lose their settings.
  • Mutual exclusivity with search - when using search, filters reset and vice versa, to avoid confusing combinations.
  • I implemented a similar filtering system in simplified form on the authors, translators, and contemporary translations pages - everywhere with AJAX loading and preservation of user settings.

Animated Wave in Menu

The visual identity of the Czechia2026 project works with the wave motif - a reference to the project's slogan "country on the coast". The graphic design included an animated wave in the navigation menu, which had to function smoothly without burdening the website.

I implemented a custom JavaScript animation where the wave shape is calculated as the sum of several sine waves - the wave is not a static SVG file but a dynamically generated curve. After each menu slide-in/slide-out, a slightly different animation progression is generated.

Navigation System and Accessibility

The website menu has a multi-level structure - main items contain several levels of nested submenus. This required careful handling of controls and accessibility:

  • Different behavior by device - on desktop, submenu opens on mouse hover (with 300ms timeout against accidental opening), on mobile devices it requires a click. Detection occurs based on the device's touch capabilities.
  • Keyboard navigation - complete support for arrow key control up/down for browsing items, Enter for opening/activation, and Escape for closing the menu. Properly set ARIA attributes for screen readers.
  • Position memory during scrolling - when a user opens the mobile menu, the page remembers their position. After closing, it returns exactly to where they were.
  • Automatic closing - the menu closes when scrolling (on desktop) or clicking outside the navigation, so it doesn't interfere with content browsing.

Performance Optimization

With a large amount of JavaScript for animations, filtering, and navigation, it was critical to ensure it loaded only where needed.

I implemented a selective enqueue system:

  • Menu + animated wave: on all pages (part of global navigation).
  • Carousel: homepage only.
  • Program filtering: program page only.
  • News filtering: news page only.
  • Authors/translators/books filtering: only on respective pages.

JavaScript is structured as ES6 modules with imports and exports. The main file detects the presence of specific HTML elements and initializes only the necessary components accordingly. Unnecessary code is not loaded.

The website runs on WordPress with Oxygen Builder for visual page construction according to the design. For managing complex data structures, I use Advanced Custom Fields - all fields for custom post types (authors, books, events, etc.) are defined through ACF.

Multilingualism is handled by Polylang, which creates separate versions of each post type for Czech, German, and English. ACF fields are synchronized across languages, but content can be localized as needed.

For date selection in the event calendar, I use Flatpickr - a lightweight and flexible JavaScript library with Czech localization.

I handle event export to Google Calendar through a special link format - no library needed, just a properly constructed URL string with event parameters.

Result

The Czechia 2026 website was launched gradually in four phases:

  • February 2025 - zero version with one static page informing about the project.
  • May 2025 - first phase with static pages.
  • June 2025 - launch of dynamic parts: event program with advanced filtering, database of authors and translators, contemporary translations. AJAX filtering fully functional across all sections.
  • July 2025 - completion of all three language versions, translation refinement, and final performance optimization.

As of December 2025, the website contains dozens of events in three program sections, dozens of translator profiles, and a complete database of Czech literature translations into German from 2024-2026.

The Moravian Library obtained a modern presentation platform that worthily represents Czech literature in an international context. Editors easily add new content through an intuitive WordPress interface with ACF fields. Visitors navigate thanks to advanced filters and search.

The website runs on its own VPS with sufficient performance, which can be increased under higher load.

Need a Website for a Cultural Institution or International Project?

If you're looking for a website with advanced filtering, structured content presentation, or custom features beyond standard templates, I'd be happy to help with implementation.

Contact me and we'll discuss your project.