Building Pages in Groupon with Wolfhound

Jonathan Blood
Dec 14, 2020 · 7 min read

What is Wolfhound?

Wolfhound is a Content Management System (CMS) that provides a one-stop solution for Groupon employees to create, edit, and publish pages to the Groupon website. This service is managed by the Merchandising Experience & Intelligence team in the Dublin Groupon office. This CMS tool provides the ability to create a number of different type of pages in Groupon such as:

  • Local pages that are built specifically for SEO which we will talk about later in more detail.
  • Landing pages have a fixed URL that can contain whatever content you choose (deals, text, video, etc). This type of page is usually used for creating landing pages for marketing campaigns.
  • Article pages are tailored towards editorial pages whose primary focus is on rich text and image content rather than simply displaying purchasable deals. Articles are intended to attract SEO traffic to the Groupon website because of their quality informational content which is designed to match what people look for when using search engines like Google.
  • Vertical Home Pages are article aggregation pages, intended to act as a homepage for articles of a specific vertical, such as Style & Beauty.
  • Coupon Blog Pages are blog pages created by the coupons team and sit under the /coupons/blog route.

Why Wolfhound?

Wolfhound was built so that marketing and editorial teams could quickly create and publish pages to the Groupon website across multiple domains without the need for engineers to be involved.

Local Pages

In this post, we are going to look specifically at local pages. “Local” pages are pages specific to SEO, which display listings of deals for cities, categories, or combinations of cities and categories. Examples of local pages for North America:

Local pages are designed to take a location and/or category from the URL, at run time, before deciding what content to display. Therefore there is no need to create a new Wolfhound page for every city in the US. A single page can be created in Wolfhound, with the desired layout for a “city” page, and this single page can be published and used to serve traffic for every city URL on the Groupon website such as https://www.groupon.com/local/:city. When the page is rendered, the city is parsed from the URL and is then used as a filter to fetch deals from an internal relevance and recommendations API. The same applies to URLs that contain a category name.

The pictures below show a high-level view of how a page is created and then eventually published in Wolfhound:

Editing a page vs published page

Supported Platforms

Wolfhound currently supports publishing pages to the following platforms:

A single Wolfhound page layout can be used to render on all platforms. However, it is also possible to have a dedicated version of a page layout specifically for use on a particular platform.

Wolfhound powered page rendered out on different platforms

Supported Widgets

In Wolfhound a container is a structural element on a page that has the ability to render a content widget. The containers are created in a template. The user cannot add or remove containers from a page, but they can leave them empty and they will not be visible to end-users. In addition, a container can only contain at most one widget. A widget is the UI element that displays content on a web page. The below image shows how a user can add a widget to a page in the Wolfhound Editor:

Adding a widget to a page via Wolfhound Editor

Some of the different kind of widgets that Wolfhound support are:

  • Deal widgets such as carousels, lists, featured deal cards
  • Video widgets
  • Text widgets
  • Category widgets
  • Article widgets
  • and more
Wolfhound supports over 30+ widgets

Supporting Dynamic Pages

One of the most powerful aspects of Wolfhound is the ability to create page layouts and have the content of the pages be dynamic based on a number of different features or dimensions such as:

  • Page URL: From the page URL we can get information such as location or category which can be used as a filter that is applied to relevance and recommendations API. For example, https://www.groupon.com/local/boston/things-to-do matches the following rule https://www.groupon.com/local/:location/:category which can be used to apply filters on category and location.
  • Dynamic Categories: This feature uses performance metrics and trends to override what categories of deals we may recommend in a particular location.
  • Scheduled Containers: The ability to swap out containers based on a schedule (date and time). For example, we could tailor a container (or multiple containers on a page) to react to the different stages of a day such as for a page related to restaurants we could change the page based on breakfast, lunch, and dinner times. Or even for special events such as Valentine’s Day.
  • User Location: Can use a user’s location to find deals nearby (as long as the user has opted to share location)
  • User Purchase Affinity: We can use the user’s purchase affinity to recommend tailored page layouts based on their affinity of (local, getaways, or goods).

Architecture

Groupon follows SOA (Service Oriented Architecture). In this approach, we have a concept of services and sub-services (services can consist of one or more sub-services). In the figure below we can see how Wolfhound is broken up into its different sub-services (in blue) and how it interacts with services which are managed by other teams in Groupon (yellow):

Publishing Pages

For advanced users, Wolfhound provides fine-grained controls to publish new page layouts across all URLs, a subset of URLs, or a specific URL. In Groupon, we have an internal service called Landing Pages API (LPAPI) which is the source of truth for determining if a local URL is valid or not. On top of this LPAPI also provides a mechanism for associating data with a URL or a rule (which matches a collection of URLs). As a result, Wolfhound integrates with LPAPI for:

  1. Associating a page layout to a URL or rule. This happens during the publishing of a page in the Wolfhound editor. So when a user navigates to a local URL, Wolfhound will call LPAPI to determine what page layout to render.
  2. In addition to this, LPAPI also stores SEO metadata which can be used to override certain SEO-related content found on the page such as if a page is indexable or not.

The rule mechanism in LPAPI is a powerful tool that provides the ability to roll out a single page layout to a collection of pages. For example, we can set a particular page ID on the following rule: https://www.groupon.com/local/:city/:category which would mean that this page layout would be applied to the following count of pages:

number of pages = (number of cities in US) x (number of categories in Groupon)

It’s worth noting that this is just an approximate number of pages that would be changed since finer granular rules such as (https://www.groupon.com/local/chicago/:category) will win out over less granular rules.

Rendering Pages

When a Groupon customer visits a Wolfhound Powered page through the Groupon website or Mobile applications, the first thing that is done is a call to LPAPI is made to determine if this is a valid local page or not. If the page is valid then LPAPI will return a response which will contain some crucial fields for determining what page layout Wolfhound will use to render the page:

GET /lpapi/pages?id=https://www.groupon.com/local/chicago
{
"attributes":{
"whPageId":"26c7bd92-500d-4f53-8c48-b533dca7d862",
"whMobileId":"1cbfe373-7045-4e5d-8ddd-164dacbebefd",
"whNativeMobileId":"83a17dc9-5a74-41f6-a930-f2e11cf17a23",
"amp":true
}
}

In the above response, this means that we will render out a different layout for desktop, touch, and native mobile. However, if we wanted to only render out one template for all platforms then we would only need to provide the whPageId field.

After the response from LPAPI is retrieved a call to the Wolfhound API is made requesting a specific page (for example for desktop we would use the WhPageId field as the identifier). The Wolfhound API will return a response which informs the rendering application on how to render the page such as:

GET /wh/pages?id=26c7bd92-500d-4f53-8c48-b533dca7d862
{
"created_author":"Jonathan Blood",
"name":"Chicago Restaurants",
"published":"PUBLISHED",
"templateId":"61738389-67cd-4571-979d-a3686070d6df",
"containers":{
"c8":{
"type":"article",
"fragmentId":"6936472f-c549-49e4-a453-4e8accca267b",
"params":{
"locale":"en_US",
"permalink":"best-chicago-pizza-crust-sauce-cheese-toppings",
"sub_directory_name":"article"
}
},
"c9":{
"type":"deal",
"fragmentId":"2a83153b-28a3-4597-bf59-c2083ba5e137",
"params":{
"category":{
"guid":"de167e83-e730-43c1-85d6-60a323825e9d",
"depth":3,
"name":"Pizza",
"chain":[
"food-and-drink",
"restaurants",
"pizza"
],
"uuidPath":[
"c09790ba-a6b9-40fc-ad81-4cdf25260b5e",
"f052f491-36c2-406f-a196-be2c59d281f4",
"5b99fc65-2d2f-48d8-ac26-c4b629c0a439"
]
},
"limit":5
}
}
}
}
This shows how the page data is stored and rendered in the Editor vs Published Page

Conclusion

That’s it… this is a high-level overview of the Wolfhound service in Groupon and how teams such as SEO and Merchandising teams create and build pages using this service.

If looking at some of the images of food made you hungry then you can check out some restaurants in your area via pages powered by Wolfhound:

Groupon Product and Engineering

All things technology from Groupon staff