Control component node name if authored multiple times on page | Community
Skip to main content
Anudeep_Kumar
Anudeep_Kumar
July 3, 2023
Solved

Control component node name if authored multiple times on page

  • July 3, 2023
  • 3 replies
  • 1028 views

Hi All,

Is there any way to control the node name of the component on page when same component has been drag and dropped multiple times on page.
Example: there is a custom component named "Product", if I drag and drop same component multiple times on page a random number is appending on component node name i.e "product_2232448". is there any way to control the random number getting appended to have the one of our choice?

if there is any possible solution will this impact all the components at environment level?

Thanks in Advance!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by EstebanBustamante

Why the name matters? You can still target a specific iteration of the same component by using CSS selectors or javascript,

You could do something like this using CSS:

 

 

/* Where "product" is your component name */ div.product:nth-child(2) { background: red; }

 

 

If the name is for some audit or SEO and you really need it you can try to use the SlingPostProcessor.class OR you could add it manually via JS.

3 replies

Rohit_Utreja
Community Advisor
Rohit_UtrejaCommunity Advisor
Community Advisor
July 3, 2023

Hi @anudeep_kumar 

 

Could you please share the use-case?
How are you planning to use the node name after defining it?

    Anudeep_Kumar
    Anudeep_KumarAuthor
    July 3, 2023

    Hi @rohit_utreja , 

    our use case is like on first drag and drop it should be "product" and the next as "product_1", then "product_2".... so on.

    Thanks,
    Anudeep

      aanchal-sikka
      Community Advisor
      aanchal-sikkaCommunity Advisor
      Community Advisor
      July 3, 2023

      Please refer to the discussion on:

       

      https://stackoverflow.com/questions/54602200/how-can-i-change-the-name-of-the-node-aem-creates-when-a-component-is-first-drop 

       

      Please do share your findings with us.

      Aanchal Sikka
        EstebanBustamante
        Community Advisor and Adobe Champion
        EstebanBustamanteCommunity Advisor and Adobe ChampionAccepted solution
        Community Advisor and Adobe Champion
        July 3, 2023

        Why the name matters? You can still target a specific iteration of the same component by using CSS selectors or javascript,

        You could do something like this using CSS:

         

         

        /* Where "product" is your component name */ div.product:nth-child(2) { background: red; }

         

         

        If the name is for some audit or SEO and you really need it you can try to use the SlingPostProcessor.class OR you could add it manually via JS.

        Esteban Bustamante
          Terms & ConditionsAccessibility statement

          Loading footer...