Orchard E-Commerce Website and Media Library

Orchard E-Commerce Website and Media Library

I've been teaching Orchard development classes using an e-commerce website built using Orchard CMS. It's a feature-rich online store showcasing many techniques in building custom Orchard Modules and Widgets for e-commerce purposes. During the holidays I have been upgrading this website to leverage new features in Orchard 1.7, including the Media Library, Media Processing Module, and Workflow Module. I am also using new features in the upcoming Orchard 1.8 regarding Infoset. As I update this Orchard e-commerce example for the new year, I thought I would mention some insights about how new Orchard best practices have improved the website. First, I would like to discuss some of the positive improvements that have occurred through the use of the Media Library and Media Processing Modules.

Orchard Sliders, Carousels, and Portfolios

The Orchard e-commerce website contains sliders, carousels, and portfolios that can be added as widgets to promote and showcase various products. The new media library and media processing modules in Orchard have helped reduce a significant amount of code in my custom widgets through the use of the new Media Library Picker Field and optional media profiles. I'd say the code was reduced by 75% with the new modules.

Since images in Orchard are now their own content type and contain all the properties I need to display sliders, carousels, and portfolios, I no longer needed to create a separate content type and offer custom management. The Media Library Picker Field also provides a convenient and feature-rich way to choose images for the widgets, and optional profiles in the Media Processing Module offer a convenient way to format those images. In addition to reducing the code, the database was simplified with less tables, the performance improved with less table joins, and the extensibility through the use of Orchard built-in types and features greatly improved.

The end result is the same look, but a much better solution using new Orchard best practices.

Orchard Sliders using Media Library

Orchard Carousels using Media Library

Orchard Media Processing Module and Profiles

Although completely optional, the use of media profiles as part of the media processing module offer a nice way to automate the resizing and formatting of images used in the sliders, carousels, and portfolio. This is an added enhancement in the Orchard e-commerce website. One has the ability to specify a custom media profile to be used when creating a slider, carousel, or portfolio.

Included in the Orchard online store are several custom image filters that I have developed since Orchard 1.7.

The custom image filters article mentions several image filters, including: Sepia Image Filter, Noise Image Filter, Flip Image Filter, and Rotate Image Filter.

Image Filters for Media Processing Module in Orchard CMS

Conclusion

This gives you a bit of insight on how the Orchard CMS e-commerce website has improved just through the use of the new media library and media processing modules in Orchard 1.7. The media library and image editor in Orchard CMS are used in several other places, too. Over the next few weeks I will mention other ways that the Orchard online store has improved with improvements in Orchard.

You can view an overview of the e-commerce website at: Orchard E-Commerce and Online Store Example.

I am an Orchard Developer for Hire. Follow me on Google+ and Twitter!