How Do I Include My Own Custom Types In A Slice

Developing with Prismic
1

Hi there,

We are (potentially) running two very similar websites from the same Prismic CMS.

site-A is a big bloggy, promotional thing with lots of company info, a signup flow and account mgt sections.

site-B is a vastly reduced / minimised version with way less pages, no blogs etc.

So on the homepage, we want to be able to offer 'slices' of content (hero image, links to blogs, some text etc) that do appear on site-A, but do NOT appear on site-B.

Solution:-
From the research i've done 'slices' might be a good way to achieve this.

We would add in the 'slice' to the custom type of 'page'.

So then 'page' custom type might be:
uid
slug
name
then a 'slice'

Within the slice would be 'hero-image' [custom type] and 'header' [custom type].

Editors could then add in the 'slice' if they wanted to, on the "home page" instance of 'page' custom type.

And because both site-A and site-B are taking the slug '/' (root) and rendering the 'home page' document, they would then read the content within it accordingly.

AND in the homepage document, Editors could give the sliced content a 'label' of 'siteA' or 'siteB', depending on which site they wanted this hero-image and/or header to be seen on.

I hope i've understood correctly that slices could achieve this ^^

Problem:

I cannot find a way to add my custom types to the 'slice'.

I am just offered 6x options in 'Use an existing slice' (eg. 'Quote', 'List of Articles', 'Image Gallery' etc)

If i select 'Create a new slice', i just have the option to name it something, assign labels, give it an icon.. there's nowhere to drag in existing custom-types from. There is also nowhere i can edit the json of this slice - other than the json of the main 'page' custom type. And so then it is not clear how to add it and have it surface as my previously generated custom type, for example 'hero image'.

How can i achieve this?

2

Hi @adrian.thompson. Unfortunately it isn’t possible to use an existing Custom Type as the model for a Slice. But you can save your slices and copy them into other Custom Types.

After you click to ‘Create a new slice’ then fill in the information in the right-hand panel, you should see an empty slice in the main panel. Here you can drag and drop the fields you need for your slice.

Then you can save the slice to re-use it in another Custom Type’s slice zone. Here’s an article that explains how to do this:

I hope this clarifies things for you :grinning:

3

Hi@Levi - I dont think that’s going to solve our problem. We want a slice, or a section that is dynamically rendered on two different websites.

Whats the next best way of achieving that?

4

@adrian.thompson My apologies, in that case, I don’t fully understand what you are hoping to do.

If you simply want content that appears on two different websites, then there shouldn’t be any issue. Your content is available via your API, so both websites can consume the same endpoint and retrieve the same content.

Or is it more complicated than that? If so, can you clarify what you’re trying to do?

5

If I understand correctly

  • you have a single repository which contains documents of various custom types
  • none of your current custom types use slices
  • you want to render the same documents differently on two different domains

In this case I would suggest redesigning your existing custom types to actually use slices
Then add labels to the slices which should only appear on the A domain (conversly for B domain if there is B specific content) and make sure the rendering code knows which domain it is rendering for and to filter out slices labelled for other domains :slight_smile:

So basically you would define what a Hero image is, make that into a slice. You can save that slice to a shared slice library within the repository. When you add a slice to a custom type you can define a new one or reuse one from the library.

On the down side : as far as I am aware the shared slices are not “linked” in the custom types but “copied” (actually the json of the shared slice is copied into the json of the custom type) which means if you update the shared slice template, you have to go though all the custom types which use that slice and update it manually. I haven’t found a way to list which custom types use a given shared slice either.

You can probably achieve this kind of conditional rendering without slices by adding labels to whatever fields in the types should be rendered conditionnaly but it’s a huge pain as there is no UI for this and you need to edit the json directly and I’m not sure it’s available on all the fields…

6

This issue has been closed due to inactivity.