The building blocks of Bea Theme 🧱

An overview of the technologies behind Bea and an insight into what you can do with Prezly themes

Did you know that the Themes Project has been in the works for almost a year? We've made a lot of changes during this time – some of them big and obvious, while others live entirely on the backend, invisible in your everyday Prezly experience, yet making your newsrooms load quicker, look a touch more polished.

All of these changes, big and small, contributed to the milestone we present to you today.

I'll try to give you a brief overview of the work that was done by our developers and present you with the opportunities that the new Themes project has opened for everyone that uses Prezly, but before we dive in, you can find the basic requirements for developing your own theme here

Modern tech stack with a great developer pool

One of the biggest changes was a move away from rigid PHP application towards a more flexible and modern JavaScript solution powered by the Next.js framework. This was one of the most popular JS solutions in 2021, and looks to have a strong and bright future for years to come.

Next.js has a strong place at the top of web solutions used by the JS community, and is gaining popularity year by year (as reported by The State of JS 2021)
Next.js has a strong place at the top of web solutions used by the JS community, and is gaining popularity year by year (as reported by The State of JS 2021)

The key advantage of moving to the new language is the thriving JS developers community, which opens up more possibilities, both in the number of tools available and overall development experience. Its knowledge base and developer pool is stronger than ever – JavaScript has been the most popular programming language for nine years now!

The combination of Next.js and TypeScript gives you strong community support and a wide developer pool to make working on themes incredibly approachable. And even for developers unfamiliar with Next.js, it still has great documentation, tons of tutorials online and an overall great learning curve.

Most popular programming languages (as reported in the 2021 Stackoverflow Developer Survey)
Most popular programming languages (as reported in the 2021 Stackoverflow Developer Survey)

Moving to a modern tech stack allowed Prezly Themes to be on the verge of web development trends, improving speed, accessibility and mobile device support, while maintaining everything that was great about our legacy newsrooms – quick and reliable page loading, sophisticated multi-language support and top SEO experience.

Flexible infrastructure & self-hosting of themes

A comparison between the old rigid infrastructure and the new flexible infrastructure with independent newsroom applications
A comparison between the old rigid infrastructure and the new flexible infrastructure with independent newsroom applications

Another big change was made under the hood, with lots of time spent on upgrading our newsroom infrastructure. Contrary to our legacy themes, the new theme infrastructure is much more flexible and detached from our main application, which provides many more options for developing new themes for your Prezly Newsrooms.

One of the key benefits of our new infrastructure is that you can now self-host your themes wherever you need. The only requirement for your application is to be able to talk to the Prezly API. This gives you lots of options when choosing the tech stack and hosting for your newsroom, as well as total control over the newsroom itself. It also allows you to more easily integrate Prezly newsrooms into your existing websites and applications.

Where previously you would have had to ask the Prezly team to make even the smallest changes to your newsroom's look and feel, with the new stack you have total freedom to build your newsroom exactly how you like it!

This is made possible with the Headless CMS concept that Prezly fully adopted with the new themes. This basically means that our backend is serving only the data you need, and that you have total control over which data you want to display and how it will look.

And with all this freedom and great opportunities, we still have your back on all the heavy stuff: live search, multi-language features, content fetching, SEO, and much more.

Right now, we're focusing on the JavaScript ecosystem, for which we provide all the necessary tools to make developing themes quick and easy. We plan to create additional documentation for our API based on the feedback you give us, and gradually introduce more tools to help you develop your themes.

Because our API uses regular REST endpoints, you can actually use any language or technology outside of our new JavaScript stack. If your developers prefer using PHP, Python or Ruby – they will still be covered!

Build it how you want, with what you need

Working on the new themes, our focus was to provide powerful tools for any developer to create their own themes quickly and with as little effort as possible, while also lifting off the requirement to deeply understand our internal infrastructure.

These initiatives include our open-source projects, documentation and code examples, as well as providing standalone application for Subscription and GDPR Requests. This list will, of course, grow as we continue to expand the themes ecosystem.

GitHub - prezly/theme-nextjs-starter: Prezly starter kit to create your own newsroom or newsroom theme. No styling included. Made with NextJS, TS, PrezlySDK and Eslint
Prezly starter kit to create your own newsroom or newsroom theme. No styling included. Made with NextJS, TS, PrezlySDK and Eslint - GitHub - prezly/theme-nextjs-starter: Prezly starter kit to creat...
GitHub

Everything about the new themes is totally modular – you can choose as many or as few features as you want, and exclude anything you don't need in your theme.

  • Want to create a standalone media gallery? Easy.
  • Need to integrate your story feed into your existing website? No problem!
  • Want to display content from multiple newsrooms in a single feed? Perfectly doable!

In addition to the content-related tools, we provide easy solutions for the multi-language support of your themes. This includes URL language resolving, adding the necessary meta-tags for SEO and, of course, translations of commonly used text into every language that our current newsrooms support (that's more than 40!).

GitHub - prezly/themes-intl-messages: Translation message files for new Prezly themes
Translation message files for new Prezly themes. Contribute to prezly/themes-intl-messages development by creating an account on GitHub.
GitHub

We're really happy to announce that all these tools are available to all of our customers, and the theme creation tools are fully open-source under an MIT license!

This gives our customers and developers full freedom to use and modify these tools to fulfil their goals in their own projects, as well as contributing to our repositories in any form, be it feedback, a feature request, or help with bug-fixing and code improvements. The MIT license also allows you to use our open-source tools in your closed-source projects, giving you freedom not to share your code if you don't feel like it.

For all the developers reading this – please feel free to check out the repos, play with the code, and give us a star if you like what you see! ⭐️

We will be adding more docs on theme development in the coming weeks, but if you're keen to start playing around with them right now, contact us and we'll give you all the info you need to start :)

Managing subscriptions and GDPR is a pain. Here's something that will help

Our most sophisticated solution for the new themes so far has been the Privacy Portal. We've been gradually introducing it to our customers as an opt-in feature for improved user experience when managing newsroom subscription and privacy requests.

Previously, the subscription and data request pages were a deeply integrated part of the legacy newsroom application, which greatly limited our ability to upgrade its interface and experience. Not to mention that the interface didn’t support any languages other than English – a significant inconvenience, as you might imagine.

Well, no longer!

Privacy Portal provides your newsroom visitors with a great-looking and convenient way to subscribe, unsubscribe, or send personal data requests. The pages are connected to your branding settings and use your newsroom's logo and brand color.

The most exciting thing? Privacy Portal is now a fully standalone application that can be used with any newsroom, no matter where it's hosted. That means you can even use it outside of Prezly – just add a subscription form or simply a link to subscribe to your newsroom updates on your own website!

(Privacy Portal is also available for newsrooms using legacy themes, via an opt-in checkbox in your newsroom Privacy Settings.)

Our future steps

With this project we aim to build an open and collaborative community around Prezly.
We will continue to explore new solutions and ways to improve Prezly Themes even more – in fact, we already see some fascinating developments on the horizon!

One of our key goals for the near future is to build a strong developer community around the Prezly ecosystem. This will bring more people into the conversation, with fresh perspectives and bright ideas, that will help us improve our products and bring even more benefits to our customers.

This is a great new chapter in Prezly history, and we're excited to see what we can build together with you! If you have any questions regarding the development of Prezly Themes, feel free to contact our support team in Intercom, or even hit me up directly!

Oleg Semyonov

Oleg Semyonov

Developer, Prezly

Published March 2022

Get updates in your mailbox

By clicking "Subscribe" I confirm I have read and agree to the Privacy Policy.

About Bea Theme

Bea is an updated spin on our classic themes, Bea showcases your content in a beautiful blocked grid pattern and it's perfect for showcasing your brand's story in high-quality images.

Contact

Tiensevest 100 bus 002 3000 Leuven Belgium

+32 2 793 00 82

hello@prezly.com

www.prezly.com