LogoLogo
  • Manifesto
    • What is YOM?
      • State of Gaming
      • Decentralizing Cloud Gaming
    • Technology
      • YOM DePIN
      • YOM Webapp
      • YOM SDK
    • 🏆Ecosystem
      • Value Flow
      • Tokenomics
      • Reputation
      • Governance
      • Programs
  • 🏗️BUILD
    • 📄Overview
      • Key Components
    • 🚀Getting Started
      • Import the UE5 SDK
      • Configure your Stream
      • Test your Stream
      • Package your Stream
      • Deploy your Stream
      • Integrate your Stream
        • Custom Authentication
        • Event Handling
        • Multi-Stream Setup
        • Dynamic Layouts
    • 🛠️SDK Features
      • Responsive Design
      • Custom Characters
      • Registering Events
      • Push Events
      • Optional
        • SDK Assets
        • Inventory
        • Portals
        • Nameplates
        • Gated Access
        • Airdrops
        • Counters
        • Control Hints
    • ⚡Stream Optimization
  • 💎EARN
    • 💻Node Rewards
    • ⚖️YOM vs Aethir
    • ⚡Node Operators Manual
      • Understanding Your Role as a Node Operator
      • Self-Hosted vs. Delegated Nodes
        • Delegation
        • Self-Hosted
          • Disk
          • Code
      • Hardware Requirements & Rig Optimization
      • Getting Started: Choosing Your Node Type & Obtaining a Node License
      • Installation Guide
      • Monitoring Your Node
      • The $YOM Reward System
      • The Role of $YRX (XP Points)
      • Staking $YOM for Enhanced Rewards
      • Troubleshooting Common Issues & FAQs
      • Community & Support Channels
      • Understanding Network Dynamics & Updates
      • Security Best Practices
      • $YOM Token Economy & Burn Mechanism
      • KYC & Compliance
      • Minimum Payout Program & Stay Online Incentives
      • Potential Risks & Considerations
      • Glossary of Terms
  • Node Owners
  • Compliancy
    • Token Disclaimer
    • Terms and Conditions
    • Privacy Policy
  • About
    • Token Allocation
    • 🙋Social Media
    • ⁉️FAQ
Powered by GitBook
On this page

Was this helpful?

Export as PDF
  1. BUILD
  2. Getting Started
  3. Integrate your Stream

Dynamic Layouts

To dynamically toggle element visibility in response to stream interaction, you can directly utilize the .toggle-on-yom-{targetId}:

<div class="additional-info toggle-on-yom-1">
    Information that should show after a user joins the stream.
</div>

If you want to apply custom css, you can use the data-hook to associate specific UI elements with the stream, allowing for broader layout adjustments when the stream is activated or deactivated:

<div id="yomTarget-1" data-hook="#{somediv}" data-streamurl="${STREAM_URL}"></div>
PreviousMulti-Stream SetupNextSDK Features

Last updated 11 months ago

Was this helpful?

🏗️
🚀