Expand my Community achievements bar.

Join expert-led, customer-led sessions on Adobe Experience Manager Assets on August 20th at our Skill Exchange.

Mark Solution

This conversation has been locked due to inactivity. Please create a new post.

SOLVED

Page properties through java script in source code

Avatar

Level 5

Hi,

For tracking purpose on different page , I need to display page properties( page title, tags, publication date) in source code of the page through javascript function.

My Client wants to add one javascript function on parent page and add variables for all three page propertie.By USE api I can handle this but how can i display the page properties by javascript in source code .

Something like this:

<script>

function tackingData() {

title: "Abc home page",

tags: "abcpagetag",

publisheddate: "2018-04-30T14:02:56.421Z"

}

</script>

Please suggest.

Regards,

1 Accepted Solution

Avatar

Correct answer by
Level 2

You can use the properties object directly in the script

<script>

function tackingData() {

title: "${properties.propertyname}",

tags: "${properties.propertyname}",

publisheddate: "${properties.propertyname}"

}

</script>

and put this in any html and make a data-sly-include of that html in head.html of page component.

View solution in original post

4 Replies

Avatar

Correct answer by
Level 2

You can use the properties object directly in the script

<script>

function tackingData() {

title: "${properties.propertyname}",

tags: "${properties.propertyname}",

publisheddate: "${properties.propertyname}"

}

</script>

and put this in any html and make a data-sly-include of that html in head.html of page component.

Avatar

Community Advisor

Hi,

No need to write Use API,

you can put below snippet in your page component,

<script>

function trackingData() {

   var jsonData = { "title": "${pageProperties.jcr:title @ context='scriptToken'}",

                     "tags": "${pageProperties.cq:tags @ context='unsafe'}",

                     "publisheddate": "${'MM/dd/yyyy HH:mma' @ format=pageProperties.cq:lastReplicated,  context='unsafe'}"

                    }

      return jsonData;

}

</script>

Thanks

Arun

Arun Patidar

AEM LinksLinkedIn

Avatar

Level 10

Great Answer. That is the correct answer - you can access any component prop using HTL syntax as shown above.

Avatar

Level 5

thank you so much , its working fine.

Regards,