OllysCoding
commented
7 months ago Revisiting Tag Fronts? Here's what you need to know
What are they? Tag fronts are automatically generated fronts that exist alongside a tag created in tag manager. They are paginated pages which display all the content published to a tag in date order.
Stories on tag fronts are grouped into containers much like on pressed fronts, however since there's no curation, containers are date based, a container will either show all the stories for a given day, or a given month, depending on the frequency content is being published to that tag.
The standard URL for a tag front is www.theguardian.com/<tag ID>. Tags IDs generally contain a forward slash /, e.g tone/minutebyminute. When both sides of the tag is the same, e.g politics/politics, the url would only contain the one part, e.g www.theguardian.com/politics.
Tag fronts can be overwritten by pressed fronts, e.g in the case of https://www.theguardian.com/tone/recipes. In this case, the tag front can be found at www.theguardian.com/<tag ID>/all, e.g https://www.theguardian.com/tone/recipes/all.
There are a few other variants of tag fronts as well:
- Date pages: Gives you all articles published for a tag on a specific day, using
www.theguardian.com/<tag ID>/<year>/<month>/<day>/alle.g https://www.theguardian.com/tone/minutebyminute/2023/nov/14/all - Tag combiners: Pages where two tags are combined and resulting matching articles are shown, using the url
www.theugardian.com/<tag 1 id>+<tag 2 id>, e.g https://www.theguardian.com/tone/minutebyminute+politics/politics - Custom pages: Pages which follow a similar structure but are on custom URLs, the known example of this is: https://www.theguardian.com/theguardian
There are a few others that will be detailed later.
What has been done so far?
PRs: https://github.com/guardian/frontend/pull/26149 https://github.com/guardian/dotcom-rendering/pull/7752 https://github.com/guardian/frontend/pull/26233 https://github.com/guardian/dotcom-rendering/pull/8056 https://github.com/guardian/dotcom-rendering/pull/9336 https://github.com/guardian/dotcom-rendering/pull/9340 https://github.com/guardian/dotcom-rendering/pull/9344 https://github.com/guardian/dotcom-rendering/pull/9405 https://github.com/guardian/dotcom-rendering/pull/9450
In frontend we have defined a datamodel for tag fronts, and set up the ability for frontend to send requests to DCR with that model, and created a 'TagFrontPicker' that decides what rendering tier to render tag fronts on.
In DCR we've created a tag front layout, all the accomanying types, models & data transformation as well as pagination & ad support.
What does this result in?
We support the following URLs
www.theguardian.com/<tag ID>www.theguardian.com/<tag ID>/all
We don't support the following URLs
www.theguardian.com/<tag ID>/<year>/<month>/<day>/allwww.theguardian.com/<tag ID 1>+<tag ID 2>www.theguardian.com/theguardian
What to do first
The best first step is to work toward launching a 1% test. This will allow you to test that everything that's been implemented up and till now is working as expected, before investing further effort in the other tag front URLs.
Before launching a 1% test, you'll need to identify which tag fronts should be excluded. Some tag fronts have extra data injected by Frontend, which won't yet be supported by DCR. Some known examples of this are the accessibility help page: https://www.theguardian.com/help/accessibility-help and football teams: https://www.theguardian.com/football/paris-fc.
Once this is complete, you should be good-to-go with the usual 1% DCR migration approach (set up 0% test in order to check everything, talk to d&i, notify Central prod & user help, launch)
What to do second
Once the 1% test launch is complete, you can start to migrate the other 'types' of tag pages, for each of these you'll generally want to follow a formula along the lines of:
- Investigate differences: What makes this page different that normal tag fronts, e.g different pagination, different data, etc.
- Determine how much can be re-used, e.g the data model, DCR endpoint, DCR layout & components
- Build frontend side, hook up the json datamodel or adjust as required
- Build DCR side, make necessary adjustments to support any different data, or visual changes.
Subjects / Contributors
This seems like a good time to migrate the subjects & contributors pages as well. They can be found here:
https://www.theguardian.com/index/subjects https://www.theguardian.com/index/contributors
cemms1
Fronts can generally be separated into two categories:
facia-pressin Frontend.DCR's pressed front rollout is (almost) complete - but tag fronts need their own data model & features, which need to be built & supported.
What's left to do?