Fixes #1 ### Summary of Changes - Modernized architecture documents to establish DBK Platform as the canonical multi-tenant commerce platform identity, treating HomAroma as the reference tenant. - Updated frontend comparison to accurately reflect apps/spa (React 19 + Vite) vs apps/website (Next.js 15 SSR) instead of legacy names. - Cleaned typos in PRISMA7_GUIDE and added cross-references to docs/PLATFORM_OVERVIEW.md. - Updated docs/DOCUMENTATION_MIGRATION.md completion tracking. --------- Co-authored-by: Your Name <you@example.com> Reviewed-on: #5 Co-authored-by: antigravity-bot <bot@kittisak.com>
6.4 KiB
6.4 KiB
DBK Platform Admin Section Guide
Platform scope: This guide describes shared CMS administration capabilities. Product and content examples are tenant-specific; HomAroma is the reference tenant. See
docs/PLATFORM_OVERVIEW.md.
This guide explains the dynamic page blocks available in the Page Builder and what each block contains.
Field Shape Legend
localized string= plain text or{ th, en, ja, zh, vi, ko }plain string= one string onlyoptional= can be omitted
Available Blocks
HERO
- Purpose: Main hero banner for a page
- Contains:
taglinelocalized stringtitlelocalized stringdescriptionlocalized stringimageUrlplain stringbuttonTextlocalized stringbuttonLinkplain string
- Best for: Landing pages, featured campaigns, page introductions
BANNER
- Purpose: Image banner with optional CTA
- Contains:
imageUrlplain stringlinkUrlplain stringtitlelocalized string optionaldescriptionlocalized string optionalbuttonTextlocalized string optional
TEXT
- Purpose: Simple content block
- Contains:
titlelocalized string optionalcontentlocalized stringtextAlignplain string optional:left,center,right
ANNOUNCEMENT_BAR
- Purpose: Rotating announcement strip
- Contains:
slidesarray of localized stringsbackgroundColorplain string optionaltextColorplain string optionalspeednumber optional
NEWSLETTER
- Purpose: Newsletter signup panel
- Contains:
titlelocalized stringdescriptionlocalized stringbuttonTextlocalized stringplaceholderTextplain string optionalshowPrivacyCheckboxbooleanprivacyTextplain string optional
EDITORIAL_TILE
- Purpose: Side-by-side editorial story tile
- Contains:
titlelocalized stringdescriptionlocalized stringimageUrlplain stringimagePositionplain string:leftorrightbuttonTextplain string optionalbuttonLinkplain string optionalbackgroundColorplain string optionaltextColorplain string optional
EDITORIAL_CAROUSEL
- Purpose: Multi-slide editorial storytelling block
- Contains:
titlelocalized stringslidesarray of:categorylocalized stringtitlelocalized stringdescriptionlocalized stringimageUrlplain stringbuttonTextplain string optionalbuttonLinkplain string optional
PRODUCTS
- Purpose: Product list/grid section
- Contains:
titlelocalized stringsubtitlelocalized string optionaltypeplain string:featured,scent, orcustomscentIdnumber optionalproductIdsnumber array optionallimitnumber optionallayoutplain string optional:gridorcarouselenableQuickShopboolean optional
CATEGORIES
- Purpose: Category showcase block
- Contains:
titlelocalized stringsubtitlelocalized string optionalcategoryIdsnumber array optional
HERO_ARTICLE
- Purpose: Editorial hero/article header
- Contains:
titlelocalized stringsubtitlelocalized string optionalauthorlocalized string optionalcategorylocalized string optionalpublishDateplain string optionaldateplain string optionalimageUrlplain stringbackgroundImageUrlplain string optionaloverlayColorplain string optional
- Notes:
- The image is set by entering an image URL in
imageUrl - In the Admin UI, the image picker stores the URL for you
- The image is set by entering an image URL in
RICH_TEXT
- Purpose: Flexible HTML/text content block
- Contains:
titlelocalized string optionalcontentlocalized string required
- Notes:
- HTML is allowed
- Use language tabs to translate each version
SCENT_NOTES_BREAKDOWN
- Purpose: Fragrance layer breakdown (reference tenant vertical block; pattern for multi-tier attribute breakdowns)
- Contains:
titlelocalized string optionaldescriptionlocalized string optionaltopNotesarray of strings or localized string objectsheartNotesarray of strings or localized string objectsmiddleNotesarray of strings or localized string objectsbaseNotesarray of strings or localized string objects
- Notes:
heartNotesandmiddleNotesare mirrored together by the backend
QUOTE_CALLOUT
- Purpose: Highlighted quote block
- Contains:
quotelocalized string requiredauthorlocalized string optionalrolelocalized string optional
PRODUCT_CAROUSEL
- Purpose: Featured product carousel
- Contains:
titlelocalized string optionaldescriptionlocalized string optionalcollectionIdplain string optionallimitnumber optionalshowPriceboolean optionalshowAddToCartboolean optionalproductsoptional explicit product list
- Notes:
- If
productsis omitted, the backend can auto-populate products on read-back
- If
ACCORDION
- Purpose: FAQ-style expandable block
- Contains:
titlelocalized string optionalcategoriesrequired array- each category has:
namelocalized stringiconplain string optionalquestionsrequired array- each question has:
qlocalized stringalocalized string
- each question has:
- each category has:
CONTACT_INFO
- Purpose: Contact details block
- Contains:
titlelocalized string optionaladdresslocalized string requiredemailplain string requiredlineplain string requiredhourslocalized string required
CONTACT_FORM
- Purpose: Contact form header block
- Contains:
titlelocalized string optionalsubtitlelocalized string optional
- Notes:
- This block has no extra fields beyond title and subtitle
Recommended Admin Workflow
- Create or open a page.
- Add blocks in the order you want them rendered.
- Fill localized fields per language.
- Use the media picker or image URL fields for image-based blocks.
- Save the block, then verify the rendered page.
Quick Tips
- Use
HERO_ARTICLEfor editorial-style stories. - Use
RICH_TEXTfor long-form content. - Use
SCENT_NOTES_BREAKDOWNfor fragrance layer storytelling. - Use
PRODUCT_CAROUSELwhen you want featured products without manually listing each one. - Use
ACCORDIONfor FAQ content. - Use
CONTACT_INFOandCONTACT_FORMtogether for contact pages.