Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Robert 4 posts 73 karma points
    Apr 20, 2024 @ 21:30
    Robert
    0

    Displaying through a Block Grid

    I'm new to Umbraco, so excuse me if I overlook something simple or altogether impossible.

    I want to create a "library" of reusable content that I can edit once and use in multiple pages whenever I choose.

    I am also trying to use the Block Grid for differing layouts on the page (full, two columns, etc.). I have set these up fine, and with a simple Element Type with an editor for a Rich Text Editor Data Type I can create any areas on the grid and everything displays fine. But I want to reuse some content. This is where i am having trouble.

    For the Block Grid I created a Data Type of Content Block Grid and added the blocks I want to display, including what I describe below. For the top-level Document Type "Test" I have added the Content Block Grid Data Type in the property editor (contentBlockGridTest). In my document template, ~/Templates/Test.cshtml, I have @await Html.GetBlockGridHtmlAsync(Model, "contentBlockGridTest").

    I have tried to render items in the following manner:

    • A plain Element Type (Quote - see below for description). This only allows picking one item, but still cannot display the item.
    • Block List. Cannot display the list of items.
    • An RTE that allows a specific block (Quote Block - see below for description). I tried the RTE with blocks thinking I could achieve the same thing as a Block List when I was looking for alternative ways to do this. But I still cannot display the chosen items.

    For the plain Element Type I created the following:

    • Document Type: Quote Block (with a plain RTE editor to hold the Quote Body).
    • Document Type: Quote Library with child nodes Quote Library and Quote Block. I also created Content for Quote Library and created a few dummy Quote Block entries.
    • Data Type: Quote Picker (selected the common Content Picker in the Property Editor and pointed it at the Quote Library in Content).
    • Element Type: Quote and added the editor for Quote Picker as a property (quoteItems).
    • Partial View: ~/blockgrid/Components/quote.cshtml.

      • Code:

        
             @using Umbraco.Extensions
             @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<Umbraco.Cms.Core.Models.Blocks.BlockGridItem>
             @Model.Content.Value("quoteItems")
        
    • When the page displays, in place of rendering I get Umbraco.Cms.Web.Common.PublishedModels.QuoteBlock

    • Getting this to display won't fulfill my needs as I'd have to keep creating areas to insert more Quote Blocks. This isn't a big deal and I'll take it if it's the only option that would work.

    For the Block List I created the following (in addition to what was created for the plain Element Type, above):

    • Data Type: Content Block List (selected the common Block List in the Property Editor) and added Quote as a block.
    • Element Type: Quote List and added the editor for Content Block List as a property (contentBlockListTest).
    • Partial View: ~/blockgrid/Components/quoteList.cshtml

      • Code:

        
             @using Umbraco.Extensions
             @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<Umbraco.Cms.Core.Models.Blocks.BlockGridItem>
             @Model.Content.Value("contentBlockListTest")
        
    • When the page displays, in place of rendering I get Umbraco.Cms.Core.Models.Blocks.BlockListModel

    • Here I am assuming that I cannot display a Block List within a Block Grid, but I am hoping that I am wrong as it feels like the best way to handle this - unless there are other, better, options.
    • Additionally, although I created a partial view under ~/blocklist/Components/quote.cshtml, it is never called as is similar with the RTE with blocks (see below). Also, I couldn't even figure out what proper code to put in that partial view - assuming it needs to be present.

    For the RTE with Blocks, I thought maybe Block Lists was not the way to go and attempted to circumvent the problem by creating the following (in addition to what was created for the plain Element Type, above):

    • Data Type: Content Selector - Quote (selected the common RTE in the Property Editor and added the Quote Element Type as a useable block).
    • Element Type: Selector Quote and added the editor for Content Selector - Quote as a property (quoteSelector).
    • Partial View: ~/blockgrid/Components/selectorQuote.cshtml

      • Code

        
             @using Umbraco.Extensions
             @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<Umbraco.Cms.Core.Models.Blocks.BlockGridItem>
             @Model.Content.Value("quoteSelector")
        
    • This required the following Partial View: ~/richtext/Components/quote.cshtml

      • Code:

        
             @using Umbraco.Extensions
             @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<Umbraco.Cms.Core.Models.Blocks.RichTextBlockItem<Quote>>
             @using ContentModels = Umbraco.Cms.Web.Common.PublishedModels;
             @Model.Content.QuoteItems<QuoteBlock>
        
    • That last line of code in the ~/richtext/Components/quote.cshtml was my last effort after about three days before I decided to come to the forums to ask for help.

    I have read all the following, but likely have missed something:

    Thank you in advance for any guidance.

  • Robert 4 posts 73 karma points
    May 08, 2024 @ 13:31
    Robert
    0

    Does anyone have any thoughts on whether this could work (and if I'm doing it wrong)?

  • Robert 4 posts 73 karma points
    May 10, 2024 @ 14:10
    Robert
    0

    I was able to work through this in the following manner:

    1. Created Folder under Document Types to act as a Library ("Block Library").
    2. Created an Element Type under the Library, taking note of the Alias.
    3. Under Data Types I have a Block Grid set up. I added the Element Type previously created as a Block. I added several Groups to organize them since I have many blocks (optional).
    4. Created a Partial View under ~/PartialViews/blockgrid/Components/[Alias Name of Element Type from #2].cshtml. Here I place the HTML for my block.
    5. I'm using sections with areas as blocks that one would use to layout content with the Block Grid. In this case I have a right "aside" section that is five columns wide and I added my new blocks there.

    I guess this is the preferred method now that macros are being deprecated in v14. I also notice that there is an RFC for a Global Library, but I'm not sure if that is making its way to v14 immediately or later. Depending on the benefits of a Global Library, I may port this over to that new functionality - which should be easy enough.

    At first, I thought this would be inefficient as I am creating a lot of Partial View files (probably over 25), but upon further reflection there doesn't appear to be much difference between that and creating the content directly the Content Tree.

    I am totally new to Umbraco. And I appreciate the work that's gone into it. I am not a developer. I like creating things, figuring them out, etc. The previous CMS I used was overly complex for a non-developer and it's latest iteration is more geared to those developers that created it and not as flexible, easy to set up and use as Umbraco. So again, thank you for the hard work.

Please Sign in or register to post replies

Write your reply to:

Draft