Ability to change the layout of a PDP (modifying product-details block) - #1291
Draft
emipallares wants to merge 1 commit into
Draft
Ability to change the layout of a PDP (modifying product-details block)#1291emipallares wants to merge 1 commit into
emipallares wants to merge 1 commit into
Conversation
…youts - Introduced new templates for product details: editorial and mirrored. - Implemented corresponding CSS styles for both templates. - Enhanced the product-details.js to load and apply templates based on configuration. - Added functionality to dynamically load template styles and structure product details accordingly.
|
Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
Commits
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Adds layout customization to the
product-detailsblock via a small in-block template registry. The block reads atemplateconfig and dispatches to a layout function defined alongside the block.Ticket: https://jira.corp.adobe.com/browse/USF-4109
Wiki: https://wiki.corp.adobe.com/x/2hs_6Q
Related to #1290.
How
templateconfig property on the block selects which layout to apply.TEMPLATES[template]and callsapply(context)with references to the wrapper, columns and key DOM nodes (gallery, header, options, wishlist toggle, etc.) — the same context shape as the extension hook.blocks/product-details/templates/<name>/as a plainasync (context) => voidfunction plus a sibling CSS file. The block lazily injects a deduped<link rel="stylesheet">for only the active template.Included example templates
Notes
templateis missing or unknown, no custom layout is applied and the block renders with its default markup — identical fallback behavior to the extension solution.<name>/<name>-template.{js,css}pair undertemplates/and register it intemplates/index.js.How to test
template: mirroredin the block config → buy-box on the left, gallery on the right (desktop).template: editorial→ description and attributes appear under the header, and the wishlist toggle sits next to the title.Test URLs: