New AddDataMigration extension, show the container's header for List Part - This week in Orchard (13/10/2022)

Gábor Domonkos's avatar
Admin UI, Announcement, Documentation, This week in Orchard

Add notes in the documents on how to configure YesSql, and show Bag Part content when the post request generates errors in the Bag Part. New AddDataMigration extension method, demo about showing the container's header for List Part, and many more are waiting for you in our current post!

Orchard Core updates

Add notes in the documents on how to configure YesSql

We have a page in the Orchard Core documentation that describes how you can run SQL queries by creating a DbConnection instance and obtaining a custom ISqlDialect from IStore from the YesSql namespace in the YesSql.Abstractions package. Or how you can handle prefixed tables. Now this page has been updated with a new section that describes how you can configure YesSql by configuring YesSqlOptions.

Documentation about configuring YesSql

Show Bag Part content when the post request generates errors in the Bag Part

Assume we have a content type (ex., Product) with a Bag Part attached. The user creates new or edits existing products and provides invalid data for items within the Bag Part. The post request fails validation which is great! However, the Bag Part will be rendered in a collapsed state. So, the user is left wondering where the error is until the user uncollapses the Bag Part and sees the highlighted error. The solution here is when rendering the Bag Part, we should uncollapse the Bag Part if there is an error in any of its contents.

We can try this one out easily. Let's say we have a site set up with the Agency recipe (that recipe contains the Landing Page content type which has several Bag Parts attached) and edit the content definition of the Service content type. Here we edit the Icon Class Text Field and make it required. Now it's time to edit the predefined Landing Page content item and remove the value of the Icon Class from one of the attached Services. And as you can see here, the Service content type is uncollapsed, making it easier to identify where the error comes from.

Show the content of the Bag Part when request generates error

New AddDataMigration extension

The goal of the new AddDataMigration extension is to shorten code like services.AddScoped<IDataMigration, CustomMigrations>(); to services.AddDataMigration<CustomMigrations>();. And if you open up a given Startup.cs file (in our case the one that sits in the AdminDashboard module), you will see the usage of this new extension.

Using the new AddDataMigration extension method


Show the container's header for List Part

There is a need to extend the look of the default List Part. This would mean that the buttons that allow you to edit the container content item itself and to add contained content items now will be placed in a new line on the top to make the search text box wider. These navigation buttons now appear on every page where List Part or Contained Part are used for easier navigation. Here you can see the updated page of the predefined Blog content item. And if you would like to edit the given Blog content item or create a new Blog Post, you will see these new buttons there as well on the top.

The blog content item with the new buttons

But now let's edit the content definition of the Blog content type and hit edit near the attached List Part to edit the List Part itself. Here you can find a new checkbox with a hint "Check this option to show a header for the owning content." Let's put a tick in this checkbox and see what will happen when we navigate back to the list item's view.

The new show container's header option

As you can see, now we have a new line here that shows the header for the owning content, meaning the header of the Blog content item, which just shows "Blog" in this case. This new line is also available on the page where you edit the blog content item itself and on the page where you create a new blog post.

The blog content item with the new header

But let's do some tricks now! Let's say that we edit the definition of the Blog content type and add a new Media Field to it, called Logo. After we can edit our predefined blog content item and upload an image using our new Media Field. The header is simple by default, but we can override it easily using shapes! Let's say that we want to display that logo in this new line!

Overriding the header of the blog content item

To do that, we needed to create a new shape template called Content-Blog.Header.cshtml (we are using Razor and the technical name of this content type is Blog). Here you can see that this row contains two columns, and we would like to display the image that is selected by our Media Field called Logo in the first column. And now, the only thing to do is to navigate back to the admin UI of Orchard Core and check out the brand-new look of our Blog!

Displaying the logo of the blog in the header

If you want to try this out right now, you will find the code in this pull request. And as always, if you want to see a recording about this feature, this will be your video on YouTube!

News from the community

Orchard Core Commerce is now available on all DotNest sites

Orchard Core Commerce is now available on all DotNest sites! A few weeks ago, we mentioned the current state of the Orchard Core Commerce module and one of the hugest improvements of adding Stripe Payment to the solution. And now you can start building your e-commerce site on DotNest! Check out our announcement for details here.

DotNest e-commerce announcement

Orchard Dojo Newsletter

Lombiq's Orchard Dojo Newsletter has 355 subscribers! We have started this newsletter to inform the community around Orchard of the latest news about the platform. By subscribing to this newsletter, you will get an e-mail whenever a new post is published to Orchard Dojo, including This week in Orchard of course.

Do you know of other Orchard enthusiasts who you think would like to read our weekly articles? Tell them to subscribe here!

If you are interested in more news around Orchard and the details of the topics above, don't forget to check out the recording of this Orchard meeting!

No Comments

Add a Comment