IR Hero Banner with Stock Price

บล็อกหัวหน้านักลงทุนสัมพันธ์สไตล์ widget3

บล็อกหัวหน้านักลงทุนสัมพันธ์สไตล์ widget3 — แบนเนอร์รูปพร้อมหัวข้อ โลโก้วงกลมคาบขอบแบนเนอร์ คำอธิบายบริษัท ชื่อย่อหลักทรัพย์ และสรุปราคา (สูงสุด/ต่ำสุด/เปลี่ยนแปลง) พร้อมปุ่มดูราคาย้อนหลัง

Set widget3Category heroScope .stk-w3-card-parallelSet base widget3

Examples

แต่ละหัวข้อคือ UI คนละรูปแบบ ส่วนขนาดคอลัมน์เป็น layout ของรูปแบบเดียวกัน

แบนเนอร์ + ราคาหลักทรัพย์

UI รูปแบบที่ 1

1 layout

PreviewOpen

defaultแบนเนอร์ + ราคาหลักทรัพย์Grid 12/12 · Measuring UI… · JavaScript

Composition

โครงสร้างส่วนประกอบหลักที่สรุปจาก HTML ของแต่ละ variant โดยตัด layout wrappers ออก

Variantdefault

Loading composition…

Content Schema

อ่าน schema เต็มและตัวอย่างค่าจาก get_widget ฟิลด์หลัก:

hero_title
logo_image
logo_alt
company_description
ticker
company_name
history_link
history_label
last_update
update_note
price_high
price_high_label
price_low
price_low_label
price_change_sign
price_change
price_change_label

Asset URLs

CSS: https://stackui-cdn.intern-studio.com/widgets/widget3/card-parallel/card-parallel.css
JS:  https://stackui-cdn.intern-studio.com/widgets/widget3/card-parallel/card-parallel.js
Preview: https://stackui-cdn.intern-studio.com/widgets/widget3/card-parallel/preview.html
Set base: ดู dependencies.setBase จาก get_widget และโหลดก่อน widget CSS

ใช้ get_core ก่อนหนึ่งครั้ง จากนั้นเรียก get_widget โดยส่ง id="card-parallel" และ set="widget3" เพื่อรับ HTML, CSS, JavaScript, dependencies และ URL ของ asset ที่ตรงกับ environment