In Sitecore JSS, how can we refer a media item in the front end?(image ,pdf file etc) Can we use Layout Service? Any other way?

  • The Layout service can be used on items for which presentation details (components) defined. To access Media Items directly, you can use the ItemService.
    – Amit Kumar
    Jun 20 '19 at 3:13

There are multiple ways to accomplish this but purely based on your requirement. If you are looking for any image which is part of your web page, I would recommend you to upload the image in media library but refer the same in your page item using an Image field for ex. sampleField. From layout service you could able to access this image field and render in JSS app,

import { Image } from '@sitecore-jss/sitecore-jss-react';
const TestImage = (props) => (
  <Image media={props.fields.sampleField} />
export default TestImage;

Other ways are using Item Service or GraphQL where you no need to worry about your Layout Service or Page Item. You can directly access any media folder/item using Item Service or GraphQL and render wherever you want.

Also you can consider customizing the Layout Service for your need, but it's up to you to pick a right approach for your need.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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