How to use a simple HTML component dynamically | Community
Skip to main content
sanzstark
New Participant
Jun 17, 2022 9:54 AM UTC
Solved

How to use a simple HTML component dynamically

I created a simple HTML component also I entered the embed google map HTML iframe script, But i have to use in dynamically in multiple pages. Could you please suggest a way.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
BipinCh1Accepted solution
Level 3
Jun 17, 2022 7:06 PM UTC

Hi @sanzstark ,

 

  One of the easiest way to do this to create an content wrapper/include component that uses data-sly-resource to render the resource and take resource path(page path) as an input. 

 

 

You had to create an page with just your map iframe in AEM and pass the page path to the wrapper/include component. You can either include(path/to/resource) till resource at root(can be useful for the rendering other pages content Disadvantage: Components becomes authorable in the wrapper/include component) or at the component level(yours's map iframe component resource path Advantage: Component is not authorable in wrapper/include components). You can customize the same as per your requirements.

View reply

3 replies

BipinCh1Accepted solution
Level 3
Jun 17, 2022 7:06 PM UTC

Hi @sanzstark ,

 

  One of the easiest way to do this to create an content wrapper/include component that uses data-sly-resource to render the resource and take resource path(page path) as an input. 

 

 

You had to create an page with just your map iframe in AEM and pass the page path to the wrapper/include component. You can either include(path/to/resource) till resource at root(can be useful for the rendering other pages content Disadvantage: Components becomes authorable in the wrapper/include component) or at the component level(yours's map iframe component resource path Advantage: Component is not authorable in wrapper/include components). You can customize the same as per your requirements.

Translate
    arunpatidar
    arunpatidar
    New Participant
    Jun 17, 2022 11:25 AM UTC

    You can try to build using experience fragment and reuse it using ajax call or directly included using Experience Fragment component in the page

    Translate
    Arun Patidar
      HariDo
      Level 3
      Jun 17, 2022 11:02 AM UTC

      @sanzstark  hi Sanz 

       hope this link helps you : https://experienceleague.adobe.com/docs/experience-manager-htl/using/getting-started/getting-started.html?lang=en

      If you are not sure how deep your content structure is, you can use infinity.json to get data at all level.

      It looks like current implementation returns all level response instead of actual data (Which could be huge).

      For performance reason and security reason avoid using .infinity.json.

      Translate
        Terms & ConditionsAccessibility statement

        Loading footer...