apologies for the likely silly question, but I've been unable to find an answer that makes sense, or at least one that marries up with my understanding of the SP terminology.

I'm trying to get access to Page Properties from within an SPfx Extension and I'm not entirely sure how to go about it, at first I thought I could query it using something like:

var list = await pnp.sp.web.lists.getByTitle("Site Pages").get();

then I could simply find the row by the Site Page ID that I'd get using:

var idString: string = this.context.pageContext.listItem.id.toString();

and then knowing the column names:

'FooterLink1', 'FooterLink2', 'FooterLink3'.

I could then pull out the hyperlink and create my footers link menu with this information.

Am I missing something, or just completely missing the point? Any help would be appreciated. Thank you.

1 Answer 1


You are on the right track. Based on the code that you posted in the question, am assuming that you are using pnpjs.

Using that, we can get the page properties as below:

      .then(d => {
        // do stuff using the received data

Also, using the built-in SPHttpClient, you can get that data as:

let selectProps = "$select=Footer1,Footer2,Footer3";
let endpoint = this.context.pageContext.web.absoluteUrl + `/_api/web/lists/getbytitle("Site Pages")/items(${this.context.pageContext.listItem.id})?${selectProps}`;
let getItemResponse = await this.context.spHttpClient.get(endpoint,SPHttpClient.configurations.v1);
    let itemData = await getItemResponse.json();
        // do some stuff here
  • I think this is correct, but I think for whatever reason the URL it's trying to use looks a bit off. In fiddler it looks like this: "https://[tenant].sharepoint.com/sites/[CollectionName]/_api/web/lists/getbytitle(%22Site%20Pages%22)/items(6)?$select=Footer1,Footer2,Footer3"
    – JoeTomks
    Feb 5, 2019 at 17:22
  • i typed it in VS code, can you copy it in notepad and make changes and then try in fiddler or directly in the browser ? We are simply making http request to <your-site-collection-url>/_api/web/lists/getbytitle("Site Pages")/items(6)?$select=Footer1,Footer2,Footer3 endpoint Feb 5, 2019 at 17:27
  • It's ok it was me being daft, I had missed some steps in the pnp.setup() configuration, once I'd amended that, it worked a treat. Thank you kindly, will mark as the answer now.
    – JoeTomks
    Feb 5, 2019 at 17:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.