Landing Page
Dynamic pages on site fall into 3 categories: Product pages, Search pages and Listing Pages. Listing pages come in 2 varieties: Landing pages and Product List pages. Both are just pages that display a list of widgets.
Listing pages are built using widgets which take data and display them based on how the Frontend widget is defined. This could be a simple image, where the widget is just the image URL and a link, or a more complex widget like a carousel.
A carousel widget has an array of widgets as one of its values, each with images and links. We flatten these child widgets so the queries don’t become recursive. They can then be matched based on the widget IDs.
query PageWidgets {
page(path: "/") {
widgets {
... on MyParentWidgetType {
banners {
id
}
}
}
flattenedChildWidgets {
id
... on MyChildWidgetType {
title
}
}
}
}
Here MyParentWidgetType and MyChildWidgetType would be replaced with specific widget types for your site. For example GlobalTabbedWidgetSet and GlobalWaitListSignUpWidget.
New widgets are named and defined in the THG Tooling then become available to use in both the API and for assigning to pages.
Landing pages are usually a list of different widgets like the homepage of a website. Product list pages are usually a page with a single ProductListWidget.
Widgets can be defined on a per site basis depending on what the client supports. For THG built websites, we will support our global list of widgets on all of them.
query LandingPage {
page(path: "/") {
title
metaDescription
metaSearchKeywords
widgets {
... on GlobalPrimaryBanner {
id
imageSmall
imageMedium
imageLarge
bannerURL
}
... on GlobalBrandLogos {
id
itemOneURL
itemOneImage
itemTwoURL
itemTwoImage
itemThreeURL
itemThreeImage
itemFourURL
itemFourImage
itemFiveURL
itemFiveImage
itemSixURL
itemSixImage
}
... on GlobalSectionPeek {
id
title
numberOfProducts
url
productList(input: {
currency: GBP
shippingDestination: GB
limit: 30
offset: 0
sort: RELEVANCE
facets: []
}) {
total
hasMore
products {
url
title
images {
thumbnail
largeProduct
zoom
}
reviews {
total
averageScore
}
defaultVariant(options: {
currency:GBP,
shippingDestination: GB,
}) {
title
price(currency: GBP,
shippingDestination: GB) {
price {
currency
amount
displayValue
}
rrp {
currency
amount
displayValue
}
}
}
}
}
}
... on GlobalThreeItemEditorial {
id
widgetTitle
itemOneUrl
itemOneImage
itemOneTitle
itemTwoUrl
itemTwoImage
itemTwoTitle
itemThreeUrl
itemThreeImage
itemThreeTitle
}
... on GlobalGeneralImageBanner {
id
smallImage
mediumImage
largeImage
linkUrl
}
... on GlobalTwoItemEditorial {
itemOneURL
itemOneTitle
itemOneDescription
itemOneImage
itemOneCTAText
itemTwoURL
itemTwoTitle
itemTwoDescription
itemTwoImage
itemTwoCTAText
}
}
}
}