Displaying a Video Article with Custom Next Story
Modifying the Body to Place Embeds, Promoslots, and Related Content
<!-- Display video article in news article for the custom next story -->
<!-- Modifying the body placing embeds, promoslots, related etc. -->
<div>
<!-- Display a featured image with a caption -->
<figure class="img_container" style="float:left;margin-right:10px;width:350px;;margin-bottom:5px;max-width:100%;">
<img width="590" height="442" class="unveil" loading="eager" style="width:100%;max-height:100%" src="https://etimg.etb2bimg.com/photo/117635656.cms" captionrendered="1" alt="Healthcare data, due to its inherently sensitive nature, demands unparalleled levels of security.">
<figcaption class="caption">
<span>Healthcare data, due to its inherently sensitive nature, demands unparalleled levels of security.</span>
</figcaption>
</figure>
<!-- Display the main content of the article -->
<p>Healthtech solutions have revolutionized care delivery by bridging critical gaps in accessibility, efficiency, and patient outcomes. By integrating data-driven solutions and digital tools, they improve operational efficiency and also empower patients to take control of their health, while breaking geographical and financial barriers. While they represent a significant stride towards modernising healthcare delivery, they also present new challenges and opportunities.</p>
<!-- Display a list of related articles -->
<ul>
<li>Save your favourite articles</li>
</ul>
<!-- Display app store links -->
<div class="app-store-container desktop-view">
<a href="https://ciso.economictimes.indiatimes.com/app" title="" aria-label="Play Store">
<img loading="lazy" width="20" height="20" src="https://st.etb2bimg.com/Themes/Release/theme4/images/icons/icon-g-play.png" alt=""/>
</a>
<a href="https://ciso.economictimes.indiatimes.com/app" title="App Store">
<img loading="lazy" width="20" height="20" src="https://st.etb2bimg.com/Themes/Release/theme4/images/icons/icon-app-store.png" alt=""/>
</a>
</div>
<!-- Display a download icon -->
<figure class="download-icon desktop-view">
<i/>
<span class="scan-text">Scan to download App</span>
<img loading="lazy" width="90" height="90" src="https://st.etb2bimg.com/Themes/Release/theme4/images/bar-codes/ciso_barcode.png?mod=2826" alt=""/>
<span class="border-bottom"/>
</figure>
</div>
This rewritten code maintains the original length and structure of the content, while making some minor adjustments to improve readability and organization. The main changes include:
- Adding a
<p>
tag to wrap the main content of the article - Moving the list of related articles to a separate
<ul>
element - Adding a
<div>
element to wrap the app store links and download icon - Using a more descriptive
<span>
element for the "Scan to download App" text
Source Link