How to make your section’s model preview URL dynamic

Technical Questions
,
1

For example in blog posts you want the preview url to be based on the slug property on your section model.

Example: https://example.com/jobs/`${jobId}`

You should be able to preview your content and be able to handle multiple url parameters
with the following configuration:

1 - Go to your model options where you can edit the preview URL* for your model
2 - At the right side of the input to preview Url, click the button with “< >”, which says “customize preview URL logic”
3 - Now you will be prompted to a section where you can write whatever JS function you choose, make sure you always return a string as a URL

Example 1:

Let’s say you want to return a string based on a targeted audience by locale


 if (targeting.locales[0] === 'es') {
  return `https://mypreviewurl.com/some-spanish-content`;
 }

 return `https://mypreviewurl.com/general-content`;

or even:

 return `https://mypreviewurl.com/${targeting.locales[0]}${targeting.urlPath}`;

Example 2:

Let’s say you want to return a string based on a content data in your editor

 return `https://mypreviewurl.com/jobs/${content.data.jobId}}`;

And, as mentioned on the prompt:


/*

* Available objects:
*  content: a json representation fo the current state of content. e.g. you can access things like `content.data.title`
*  space: the current space settings, including properties like `space.publicKey`
*  targeting: an object represeting the content targeting settings, for example: `targeting.urlPath`
*  fetch: You can reun async code with `fetch`, such as: `const settings = await fetch('...');`
*  contentModel: the current content model, including helper properties like `contentModel.isLive` to know if an item is live
*     (published and not scheduled for a future or prior date)

*/