Skip to content

Commit 9b73416

Browse files
emilysaffronemilysaffron
committed
Expose 1200px wide image for seo markup and metadata for podcast episodes
1 parent 7107ab1 commit 9b73416

File tree

5 files changed

+51
-12
lines changed

5 files changed

+51
-12
lines changed

‎src/app/components/LinkedData/index.tsx‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,7 @@ const LinkedData = ({
7373
imageLocator,
7474
bylineLinkedData,
7575
mainEntityId,
76+
metadataImageProps,
7677
}: LinkedDataProps) => {
7778
const {
7879
brandName,
@@ -93,7 +94,6 @@ const LinkedData = ({
9394
const AUTHOR_PUBLISHER_NAME = isTrustProjectParticipant ? brandName : 'BBC';
9495
const LANGUAGE_TYPE = 'Language';
9596
const isNotRadioChannel = type !== 'RadioChannel';
96-
9797
const brandedIndexImage = imageLocator
9898
? getBrandedImage(imageLocator, service)
9999
: null;
@@ -133,11 +133,19 @@ const LinkedData = ({
133133

134134
const publisherLogo = choosePublisherLogo();
135135

136+
const {
137+
image: imageUrl,
138+
imageWidth,
139+
imageHeight,
140+
} = metadataImageProps || {
141+
imageWidth: 1024,
142+
imageHeight: 576,
143+
};
136144
const image = {
137145
'@type': IMG_TYPE,
138-
width: 1024,
139-
height: 576,
140-
url: brandedIndexImage || defaultImage,
146+
width: imageWidth,
147+
height: imageHeight,
148+
url: imageUrl || brandedIndexImage || defaultImage,
141149
};
142150

143151
const thumbnailUrl = promoImage || brandedIndexImage || defaultImage;
@@ -213,7 +221,6 @@ const LinkedData = ({
213221
seoTitle,
214222
type,
215223
});
216-
217224
const linkedData = {
218225
'@type': type,
219226
url: canonicalNonUkLink,

‎src/app/components/LinkedData/types.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,4 +36,17 @@ export interface LinkedDataProps {
3636
coverageStartTime?: string;
3737
coverageEndTime?: string;
3838
mainEntityId?: string;
39+
metadataImageProps?: MetadataImageProps;
3940
}
41+
42+
type MetadataImageProps =
43+
| {
44+
image: string;
45+
imageWidth: number;
46+
imageHeight: number;
47+
}
48+
| {
49+
image?: undefined;
50+
imageWidth?: undefined;
51+
imageHeight?: undefined;
52+
};

‎src/app/legacy/containers/OnDemandImage/index.jsx‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,14 @@ const getSrcSet = ({ imageUrl, sizes }) =>
3232
const smallImageSize = 128;
3333
const mediumImageSize = 256;
3434
const largeImageSize = 480;
35+
const xlImageSize = 1200;
3536

36-
const OnDemandImage = ({ imageUrl, alt: altFromProps, className = '' }) => {
37+
const OnDemandImage = ({
38+
imageUrl,
39+
alt: altFromProps,
40+
className = '',
41+
isPodcastEpisodePage = false,
42+
}) => {
3743
const { defaultImageAltText, dir } = use(ServiceContext);
3844
const { isLite } = use(RequestContext);
3945

@@ -44,7 +50,12 @@ const OnDemandImage = ({ imageUrl, alt: altFromProps, className = '' }) => {
4450
const src = getSrc({ imageUrl, size: mediumImageSize });
4551
const srcset = getSrcSet({
4652
imageUrl,
47-
sizes: [smallImageSize, mediumImageSize, largeImageSize],
53+
sizes: [
54+
smallImageSize,
55+
mediumImageSize,
56+
largeImageSize,
57+
...(isPodcastEpisodePage ? [xlImageSize] : []),
58+
],
4859
});
4960
const sizes = '(min-width: 1008px) 228px, 30vw';
5061

‎ws-nextjs-app/pages/[service]/onDemandAudio/OnDemandAudioLayout.tsx‎

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -132,11 +132,14 @@ const OnDemandAudioPage = ({
132132

133133
const shouldSetMainEntity = Boolean(podcastEntities);
134134

135+
const imageHeight = isPodcastEpisodePage ? 675 : 400;
136+
const imageWidth = isPodcastEpisodePage ? 1200 : 400;
137+
const image = `https://${imageUrl?.replace('$recipe', `${imageWidth}x${imageHeight}`)}`;
135138
const metadataImageProps = is(String, imageUrl)
136139
? {
137-
image: `https://${imageUrl.replace('$recipe', `400x400`)}`,
138-
imageWidth: 400,
139-
imageHeight: 400,
140+
image,
141+
imageWidth,
142+
imageHeight,
140143
}
141144
: {};
142145

@@ -182,6 +185,7 @@ const OnDemandAudioPage = ({
182185
alt={imageAltText}
183186
css={styles.image}
184187
className="imageStyles"
188+
isPodcastEpisodePage
185189
/>
186190
</div>
187191
{mediaIsAvailable ? (
@@ -196,6 +200,10 @@ const OnDemandAudioPage = ({
196200
seoTitle={metadataTitle}
197201
entities={linkedDataEntities}
198202
mainEntityId={shouldSetMainEntity ? episodeId : undefined}
203+
{...(isPodcastEpisodePage &&
204+
metadataImageProps && {
205+
metadataImageProps,
206+
})}
199207
/>
200208
</main>
201209

‎ws-nextjs-app/pages/[service]/onDemandAudio/__snapshots__/index.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4613,7 +4613,7 @@ exports[`OnDemand Radio Page should match snapshot for podcast episode page wit
46134613
<script
46144614
type="application/ld+json"
46154615
>
4616-
{"@context":"https://schema.org","@graph":[{"@type":"WebPage","url":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","publisher":{"@type":"NewsMediaOrganization","name":"BBC News Gahuza","publishingPrinciples":"https://www.bbc.com/gahuza/institutional-49283343","logo":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"}},"thumbnailUrl":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png","image":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","name":"Baza Muganga 15/11/2024 - Baza Muganga - Gahuza"},"inLanguage":{"@type":"Language","name":"Kinyarwanda","alternateName":"rw"},"mainEntity":{"@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#episode"}},{"@type":"PodcastSeries","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb#series","name":"Baza Muganga"},{"@type":"PodcastEpisode","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#episode","name":"Baza Muganga 15/11/2024","description":"Baza Muganga 15/11/2024","datePublished":"2024-11-15T00:00:00.000Z","partOfSeries":{"@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb#series"},"associatedMedia":{"@type":"AudioObject","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#audio","name":"Baza Muganga 15/11/2024","description":"Baza Muganga 15/11/2024","duration":"PT5M58S","thumbnailUrl":"https://ichef.bbci.co.uk/images/ic/1024x576/p082wk67.jpg","uploadDate":"2024-11-15T17:09:00.000Z"}}]}
4616+
{"@context":"https://schema.org","@graph":[{"@type":"WebPage","url":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","publisher":{"@type":"NewsMediaOrganization","name":"BBC News Gahuza","publishingPrinciples":"https://www.bbc.com/gahuza/institutional-49283343","logo":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"}},"thumbnailUrl":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png","image":{"@type":"ImageObject","width":1200,"height":675,"url":"https://ichef.bbci.co.uk/images/ic/1200x675/p082wk67.jpg"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","name":"Baza Muganga 15/11/2024 - Baza Muganga - Gahuza"},"inLanguage":{"@type":"Language","name":"Kinyarwanda","alternateName":"rw"},"mainEntity":{"@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#episode"}},{"@type":"PodcastSeries","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb#series","name":"Baza Muganga"},{"@type":"PodcastEpisode","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#episode","name":"Baza Muganga 15/11/2024","description":"Baza Muganga 15/11/2024","datePublished":"2024-11-15T00:00:00.000Z","partOfSeries":{"@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb#series"},"associatedMedia":{"@type":"AudioObject","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm#audio","name":"Baza Muganga 15/11/2024","description":"Baza Muganga 15/11/2024","duration":"PT5M58S","thumbnailUrl":"https://ichef.bbci.co.uk/images/ic/1024x576/p082wk67.jpg","uploadDate":"2024-11-15T17:09:00.000Z"}}]}
46174617
</script>
46184618
</div>
46194619
</main>
@@ -7678,7 +7678,7 @@ exports[`OnDemand Radio Page should match snapshot for when podcastEpisodeLinke
76787678
<script
76797679
type="application/ld+json"
76807680
>
7681-
{"@context":"https://schema.org","@graph":[{"@type":"WebPage","url":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","publisher":{"@type":"NewsMediaOrganization","name":"BBC News Gahuza","publishingPrinciples":"https://www.bbc.com/gahuza/institutional-49283343","logo":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"}},"thumbnailUrl":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png","image":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","name":"Baza Muganga 15/11/2024 - Baza Muganga - Gahuza"},"inLanguage":{"@type":"Language","name":"Kinyarwanda","alternateName":"rw"}},{"@type":"AudioObject","name":"Baza Muganga","description":"Baza Muganga 15/11/2024","thumbnailUrl":"https://ichef.bbci.co.uk/images/ic/1024x576/p082wk67.jpg","duration":"PT5M58S","uploadDate":"2024-11-15T17:09:00.000Z"}]}
7681+
{"@context":"https://schema.org","@graph":[{"@type":"WebPage","url":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","publisher":{"@type":"NewsMediaOrganization","name":"BBC News Gahuza","publishingPrinciples":"https://www.bbc.com/gahuza/institutional-49283343","logo":{"@type":"ImageObject","width":1024,"height":576,"url":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png"}},"thumbnailUrl":"https://static.files.bbci.co.uk/ws/simorgh-assets/public/gahuza/images/metadata/poster-1024x576.png","image":{"@type":"ImageObject","width":1200,"height":675,"url":"https://ichef.bbci.co.uk/images/ic/1200x675/p082wk67.jpg"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://www.test.bbc.com/gahuza/bbc_gahuza_radio/podcasts/p07yh8hb/p0k4x0jm","name":"Baza Muganga 15/11/2024 - Baza Muganga - Gahuza"},"inLanguage":{"@type":"Language","name":"Kinyarwanda","alternateName":"rw"}},{"@type":"AudioObject","name":"Baza Muganga","description":"Baza Muganga 15/11/2024","thumbnailUrl":"https://ichef.bbci.co.uk/images/ic/1024x576/p082wk67.jpg","duration":"PT5M58S","uploadDate":"2024-11-15T17:09:00.000Z"}]}
76827682
</script>
76837683
</div>
76847684
</main>

0 commit comments

Comments
 (0)