Discussion on creating and referencing arrays of images in Slack thread
29 replies
Last updated: Mar 5, 2023
C
user P
i can try to help with array of images hereMar 5, 2023, 7:14 PM
C
🧵
Mar 5, 2023, 7:14 PM
B
Thanks
Mar 5, 2023, 7:15 PM
B
Isn't this like referencing
Mar 5, 2023, 7:16 PM
C
yes it utilizes references
Mar 5, 2023, 7:16 PM
B
Hey here you can see how I created an array of strings, Is it possible with images too?
Mar 5, 2023, 7:27 PM
C
Yeah probably!
Mar 5, 2023, 7:29 PM
C
can you change ‘string’ to image and see what happens
Mar 5, 2023, 7:30 PM
B
Checking it right now
Mar 5, 2023, 7:30 PM
B
Yep it's working fine or perfectly as I expected it to be.
Mar 5, 2023, 7:31 PM
C
I think the reason I used references for this was so I could also use the image in other contexts instead of just an array
Mar 5, 2023, 7:33 PM
C
glad it worked tho!
Mar 5, 2023, 7:33 PM
B
Actually referencing is good, I'll try to reference images here too.
Mar 5, 2023, 7:34 PM
B
With referencing I will be able to utilise it at multiple locations.
Mar 5, 2023, 7:35 PM
B
Hey, Do you know what other things I can do with images?
Mar 5, 2023, 7:37 PM
C
yeah check out the sanity docs they are super helpful… I really like the “hotspot” option — https://www.sanity.io/docs/image-type#text=hotspot-,boolean,at%20display%20time.%20The%2[…]e%20for%20hotspot%20is%20false.,-storeOriginalFilename
Mar 5, 2023, 7:37 PM
B
I think hotspot don't work with array, do they?
Mar 5, 2023, 7:38 PM
C
mine does
Mar 5, 2023, 7:38 PM
B
Can you send me the code?
Thank You
Thank You
Mar 5, 2023, 7:39 PM
C
defineField({
name: 'image',
type: 'image',
title: 'Upload Image',
options: {
hotspot: true,
},
}),Mar 5, 2023, 7:39 PM
B
It's not array sir.
Mar 5, 2023, 7:40 PM
C
export default defineType({
name: 'blogImage', // tells the studio that the JSON gets "_type": 'image'
type: 'document', // document tells studio it is possible to make new navBar documents
title: 'Images', // how it looks in the Studio UI
icon: ImageIcon,
fields: [
defineField({
name: 'image',
type: 'image',
title: 'Upload Image',
options: {
hotspot: true,
},
}),Mar 5, 2023, 7:40 PM
C
defineField({
name: 'collectionImages',
type: 'array',
title: 'Add images to this collection',
of: [
{
type: 'reference',
to: [
{ type: 'blogImage' }
]
}
],
}),Mar 5, 2023, 7:41 PM
B
See this, Upper one is a simple image and bottom one is an array of objects.
Mar 5, 2023, 7:41 PM
C
the hotspot option should be the option on the image type . then you reference this image type with your array
Mar 5, 2023, 7:42 PM
B
Lemme ask about in help
Mar 5, 2023, 7:42 PM
B
Hmmm... 🤔
Mar 5, 2023, 7:43 PM
C
I have to sign off for the day. have a great weekend
Mar 5, 2023, 7:44 PM
B
Hey, you too and thanks for helping brother.
Mar 5, 2023, 7:44 PM
B
Do you know anything related to this, It's for an image.
Mar 5, 2023, 7:57 PM
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.