Page properties through java script in source code | Community
Skip to main content
varuns46785756
Level 5
Jul 30, 2018 7:27 PM UTC
Solved

Page properties through java script in source code

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,

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
shivamurthym775Accepted solution
Level 2
Jul 30, 2018 9:11 PM UTC

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.

4 replies

varuns46785756
Level 5
Jul 31, 2018 7:06 PM UTC

thank you so much , its working fine.

Regards,

Translate
smacdonald2008
Level 10
Jul 30, 2018 10:32 PM UTC

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

Translate
arunpatidar
New Participant
Jul 30, 2018 10:31 PM UTC

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

Translate
Arun Patidar
shivamurthym775Accepted solution
Level 2
Jul 30, 2018 9:11 PM UTC

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.

Translate