Aim: Produce a slider carousel that displays a list of content items. Lets pick a random slider (why not).
Needed: Orchard.Projections; Unslider
The module can be achieved quite quickly with the following steps:
The module created is Breakout.ItemSlider.
Two files are used for the editor and description of the layout:
If the module is needed in pre 1.7 version this part will need a little change (SliderLayout.cs):
The above state is a dynamic object that will handled by Newtonsoft Json (Orchard v1.7 or current 1.x branch), which is clever enough to work out the types and allows me to write less code. Previous versions of Orchard use the default JSON provider and will fail at parsing string to number, and string to a nullable<bool> on the above lines but is easy enough to write a little more to check the conversion of string to type.
The slider itself it a very simply view:
The shape part is built by SliderLayout.cs and described by the query part (while setting up the layout description) of the projection. Basically the shape display type can be set allowing for different alternates and content templates for the slider. Lets come back to this later.
Unslider describes what the CSS must have:
Replacing .banner for the css class name specified during the layout creation. For this module Im using LESS CSS files to help create and maintain the final CSS files (development and minified production).
and the current output for this theme is Styles/unslider.default.less
After spending a little bit of time on placements and styling the module I've got the projection displaying blog posts like the following:
In this tutorial we will be replacing the default WYSIWYG HTML content editor.
The flavor created is "Kendo", and provided are currently all the tools available in version 2013.1.319 including the Image browser and upload functionality.
Grab the module here
Enable the module.
Install the module from the gallery (Orchard.Module.Kendo.Web)
Enable the feature Kendo Editor:
This will enable all required components automatically.
Set a content item body 'flavor' to 'kendo'
Create a new page to check out how it looks and works. Everything including the image selector should work like the examples on the kendo site.
The current navigation lacks the ability to hide individual menu items easily on the same menu group. A solution would be to create many menu sections and hide them on different menu widget layers. Instead, I have attempted to tackle this limitation by allowing each menu item to have its own rules keeping things down to the minimum amount of menus.
The targets are pretty simple:
This is achieved by creating a filter based on INavigationFilter and evaluating the menu item's rules and settings with the same rule manager (IRuleManager) that is used with layers.
How to use
The part has two settings that allow the navigation to disable the layer rules from:
Disabling either of the two settings removes the editors as well.
Aims: Create a selection filter for the slider projection. Lets say we only want 'feature' items appearing when we select them. We could go and fetch the ids and create a filter that way but having a check-box on the editor page for the content type is far more user friendly.
To achieve this we are going to need to do a bit of work. First we need a part and a record that can be used to define the sql query for the content items.
This part will be used to enable the item to be included in the query.
The Record is as simple:
The above part is attached to the content type which is being displayed in the Query. Time to create and define the filter for the query then...
Second part is a little more fiddly with dynamic forms but should be simple enough.
The two sections that we need to implement are:
The above function is used to define how the filter acts and looks:
Name and Description are how the filter are visibly shown in the group lists. Filter how Describe.For is the section where the item falls into.
filter: ApplyFilter - develop the query by saying how the value is used from the part. When the setting is needed and how to therefore query the data. The filter is creating two options:
display: DisplayFilter - Displays a user hint and describes how the filter is acting when once enabled.
form: "SliderItemFilter" - the dynamic form that the user uses to set the filter. The form is described through the implementation of IFormProvider. The provider creates a dynamic form, where its name matches the above string.
Use this guide to help you navigate some aspects of customizing the search in Orchard. Afterwards you will be able to index fields of a part in the example I will be using price and indexing a quick mock of products.
The key parts are:
AdvancedSearchFormPartDriver - Provides an additional shape for the SearchFormPart. This is to provide the advanced features of the search and to display on the search form widget.
IAdvancedSearchService (AdvancedSearchService) - shows how to search a particular field. There are a few options to begin. Here is a example of searching for products withing a price range 'only'.
AdvancedSearchController - Overrides the default controller for Search as well as provides the views and shapes for the advanced search. Additionally it serves up results by the content type found in the custom settings rather than the default summary, providing a little more flexibility.
Version 1 - 25th June 2013
And Cultures are included.
To enable the scripts and choose a theme: