Dynamic Pages
Page Template Types
[1] Multiplexer page [2] Dynamic pages
Multiplexer Page Template
If used - always folder start page
- All linked pages have uniform URL: e.g. https://www.egger.com/en/myegger/ (IND & not IND)
- Except for when wildcard is chosen: e.g. https://www.egger.com/en/furniture-interior-design/decors/H1384_40 - path is from FS - Decorcode from PIM (depending on which decordetailpage the user is)
- Needed if you have more than one page with the same url or the last part of the url is from PIM
- Only used to reference the pages in the folder where the multiplexer page is the start page
- No content on this page
Mandatory fields (please simply add placeholder information so that it is clear what kind of multiplexer site it is [e.g. Decors EFP]):
- Page settings
- SEO: Page title, page description, H1, Microfrontend, References
- General Search: Thumbnail
All these fields are overwritten by the Microfrontend.
[1] Microfrontend: Connection to data source (e.g. PIM) - mandatory
Microfrontend | Used for |
---|---|
News | - |
EDP Decorsearch | Decoroview page EDP |
EBP Product | Product group and detail pages EBP |
EFP Decordetail | Articledetailpage EFP |
Case Studies Overview | - |
EDP Decordetail | Decordetailpage EDP |
EFP Decorsearch | Decorview page EFP |
EDP Product | Product group and detail pages EDP |
EFP Product | Product pages EFP |
CMS | - |
[2] Wildcard:
false
= all linked pages have uniform URL
true
= pages have different URLs (path + microfrontend information)
[3] References: link here all pages that are in the folder of the multiplexer page (via internal link). The order of the pages in the folder and the order of the references must match. The pages must be referenced individually for each language.
Order of pages in the multiplexer folder
The pages in the folder of a multiplexer page must be sorted in a specific order. The folder start page is always the multiplexer page, below it are the dynamic pages. The dynamic pages must be sorted from bottom to top from the least restricted page (usually default without restriction) to the most restricted page (e.g. IND).
[1] & [3] Pages without restrictions (default - all page variants with restrictions are above the default variant)
[2] Pages with restrictions (From top to bottom: FS Restictions (e.g. IND Portal) > Custom Restrictions (productcode, decorcode, articlenumber, type > default))
[4] Multiplexer page (always startpage)
Dynamic Page Template
Use if a pages consists of dynamic content.
- Dynamic content from PIM, Messagefiles, …
- Connection FS ↔ PIM via MicrofrontendNeeded if you have a page with data from PIM, Messagefiles, …
- Data is filled automatically according to page settings
- Needs to be referenced in the multiplexer page if there is more than one page for the same topic (e.g. decordetailpages, …) in the same folder
- Dynamic components (Data from PIM, …) and all other components can be used (Content added in FS)
Mandatory fields:
- Page settings
- SEO: Page title, page description, H1, Microfrontend
- General Search: Thumbnail
All these fields are overwritten by the Microfrontend.
[1] Microfrontend: same as for Multiplexer page - mandatory
Custom Restrictions
Determine, which information needs to be used from PIM. Need to be set, if a page contains different content, than the default page (e.g. EDP Productgroup pages ⭢ different „recommended products“ for each productgroup ⭢ default doesn‘t contain „recommended products“). If no (custom) restriction fits, the default page will be shown online.
[1] Standard restrictions: can be set as for the standard pages
[2] Custom Restrictions: new for dynamic page templates, include key & value to restrict the page (to for example specific decors)
Page Type | Key | Value |
---|---|---|
EDP Decordetail | code | DECORCODE (e.g. H1367_40) |
EDP Productdetail | type | product |
product | PRODUCTCODE (e.g. SPLASHBACK) | |
EDP Productgroup | type | category |
product | PRODUCTCODE (e.g. EDGING) | |
EFP Decordetail | code | ARTICLENUMBER (e.g. 1667262) |
EFP Productpage | product | PRODUCTCODE (e.g. DESIGNPLUS) |
EBP Productdetail | type | product |
product | PRODUCTCODE (e.g. OSB2) | |
EBP Productgroup | type | category |
product | PRODUCTCODE (e.g. OSBBOARDS) | |
General Search (All tab) | type | all |
General Search (Tabs) | type | tab |
Dynamic Components
Can be added on the dynamic page template: New section > Dynamic Component > Select component type > Add content
- Different types can be chosen: Accessories, BannerList, BaseProductAvailability, Component Mount Point, ContentSlider, CTA HeroTeaser, DecorData, DecorRecommendation, DecorSlider, DescriptionList, DownloadSearch, FactHeroTeaser, GeneralSearchList, Image, InlineNavigation, Media Stage, ProductComparison, ProductComparisonList, ProductSustainability, PropertyDataList, Search Result Item, SearchHeader, Table, Textblock
- Some are only available within the dynamic component, others are available as „normal“ components as well
- Some work without additional content, others need added content (e.g. headlines, …) that can either be a link, text, localized text or media
- Can be used within a grid – if used without a grid it‘s always fullwidth
- Dynamic contents are not visible in the preview ⭢ as contents come from PIM, system can only determine the correct contents for each mark
[1] Component Type: select from a pool of different components
[2] Content: insert key and value
[3] Tracking information
Content
- Key & type + depending on type other information like the text or a link need to be maintained
- Keys are always determined by COM & DEV teams (cannot be any key)
- Only localized_text, link and media need to be translated & maintained manually:
Localized text
Text
Link
Media
Content Datasources
The link will take you to Figma and an overview of the data sources from which the various components of a dynamic page originate: Content Datasource Overview
Naming Convetion
Eventhough page names/titles/description + H1 might come from PIM, please always name these fields in EN (for all languages) and coherent with the current namings.
How to add a Component to specific pages
1
Bookmark the teaser component
2
Create new page (Name the page: Page - Teaser [e.g. Decordetail default - Interior Match]) > without menu item > copy content (from page where you want to add the teaser) > finish [reload the page if you face an ISE]
3
Move the page at the correct position according to the restrictions
4
Check page settings (identical to copied page) + change name, description and H1 to Page - Teaser (e.g. Decordetail default - Interior Match)
5
Add custom restrictions (e.g. add all decors e.g. code | F021_75,F121_87)
6
Insert bookmarked teaser (maintain translations)
7
Reference page at Multiplexer page (reference position = same as navi position) - needs to be done in every language
8
Release page & multiplexer page
Tip
Alternative: Add custom restriction at component level (step 5)
Example: Interior Match Teaser
Please insert the teaser in the following steps:
-
bookmark the interior match teaser component (last page in your navigation)
-
create new page (Decordetail - default - Interior Match) > without menu item > copy content (Decordetail - default) > finish [reload the page if you face an ISE]
-
move the page above the Decordetail - default page in the navi
-
check page settings (identical to Decordetail default page) + change name, description and H1 to Decordetail - default - Interior Match
-
add custom restrictions (add all decors from the list above with e.g. code | F021_75,F121_87)
-
insert teaser (above DecorRecommendations component) [maintain translations, add the headline to the stickybar via HTML ID + short text, add download link: market specific flyer]
-
reference page at EDP Decors Multiplexer page (reference position = same as navi position)
-
release page & multiplexer page (no yamls required)
The teaser must be installed on all three decor detail pages (default, logged in, IND). Please also note the order of the pages in the navigation (must also be referenced in this order in the multiplexer): Furniture Interior Design > Decors
-
Decors EDP (Multiplexer)
-
Decordetail - IND - default - Interior Match
-
Decordetail - IND - default
-
Decordetail - logged in - default - Interior Match
-
Decordetail - logged in - default
-
Decordetail - default - Interior Match
-
Decordetail - default
last updated: 11/24