How to create lookups (Content lists by Content Group) for all sites

[Pt4r]

Hello,

We are implementing Piranha CMS to be used as a headless CMS and provide content for our eshop website. I was trying to find a way to create lists of any content that can be created in a single place at the Manager and can be used by any page in any site. An example of this is a content type list of Banners which can be created once and can be used in our homepage and also in some other pages. I couldn't find any documented way to implement this or how to create content type groups and content type lists so i'm creating this Q&A to help anyone else who is in the same place and also my forgetful future self.

The way we did it is by:

1. Created a new Content group

    [ContentGroup(Title = "Banners", Icon = "fas fa-flag")]
    public abstract class Banner<T> : Content<T> where T : Banner<T> { }

2. Created a new Content

[ContentType(Title = "Banner", UseExcerpt = false, UsePrimaryImage = false)]
    public class BannerContent : Banner<BannerContent>
    {
        [Region(Title = "Content",
                Display = RegionDisplayMode.Content)]
        public BannerContentRegion Content { get; set; }

        public class BannerContentRegion
        {
            [Field(Title = "Desktop Image", Options = FieldOption.HalfWidth)]
            public ImageField Image { get; set; }

            [Field(Options = FieldOption.HalfWidth,
                   Placeholder = "Label for the call to action link",
                   Title = "CTA Label")]
            public StringField CTALabel { get; set; }

            [Field(Options = FieldOption.HalfWidth,
                   Placeholder = "Action link href. Must be an absolute link",
                   Title = "CTA URL")]
            public StringField CTAUrl { get; set; }
        }
    }
}

3. Created a new Content Item

    public class BannerItem
    {
        // The id of the page
        public Guid Id { get; set; }

        // The model
        public BannerContent? Content { get; set; }

        // Gets a single item with the provided id using the
        // injected services you specify.
        static async Task<BannerItem> GetById(string id, IApi api) {
            var banner = await api.Content.GetByIdAsync<BannerContent>(new Guid(id));
            return new BannerItem {
                Id = new Guid(id),
                Content = banner
            };
        }

        // Gets all of the available items to choose from using
        // the injected services you specify.
        static async Task<IEnumerable<DataSelectFieldItem>> GetList(IApi api) {
            var banners = await api.Content.GetAllAsync<BannerContent>();
            return banners.Select(p => new DataSelectFieldItem {
                Id = p.Id.ToString(),
                Name = p.Title
            });
        }
    }

4. Create a new Block with a DataSelectField of the new type (the secret sauce)

    [BlockType(Name = "Banner", Icon = "fas fa-cubes", Category = "Content", IsUnlisted = true)]
    public class BannerBlock : Block
    {
        [Field]
        public DataSelectField<BannerItem> Banner { get; set; }

        public override string GetTitle() {
            return Banner?.Value?.Content?.Title ?? string.Empty;
        }
    }

5. Create a new BlockGroup

    [BlockGroupType(Name = "Banners",
                    Category = "Content List",
                    Icon = "fas fa-flag")]
    [BlockItemType(Type = typeof(BannerBlock))]
    public class BannersBlockGroup : BlockGroup, ISearchable, ITranslatable
    {
        public string GetIndexedContent() {
            return string.Join(",", Items.Select(x => x.GetTitle()).ToList());
        }
    }

That way we provide the user a new Content type (of type Banner) on the sidebar where they can create a list of banners (or any other content which inherits the same Content Group).

Then, we have a new BlockGroup (inside of the "Content List" category as set at the BlockGroup attributes) available on any page where we can select and sort any content of the specific type.

Inside that BlockGroup we can select the previously created content item and also sort them accordingly.