I am using
Sitecore Experience Accelerator 1.4 and I do not want to use
Bootstrap, Foundation or Grid960. I have my
custom CSS framework. Anyone can provide me a solution that how I can add a new Grid?
I am using
It is easy. The implementation steps are low complexity.
See how bootstrap is configured
Create Grid Theme
/sitecore/media library/Feature/Experience Accelerator/Bootstrap/Bootstrap
It is your custom grid theme. The most important thing is to include your css file with all your grid classes
Create Grid Definition
/sitecore/system/Settings/Feature/Experience Accelerator/Bootstrap/Grid Definition
This item contains children which defines your devices (Phone, Desktop). Each device can have different properties (Size, Push, Pull, Offset) and each property can have different values (css classes, for example
Phone Device->Size->1, you will use your grid classes here)
RenderingParametersFieldType- I assume you are not doing anything custom here, so you can use default field renderer:
Sitecore.XA.Foundation.Grid.Fields.FieldRenderers.GridRenderingParametersFieldRenderer, Sitecore.XA.Foundation.Grid. Once you fill this field and save an item you should see
DefaultGridParametersrendering your configuration.
DefaultGridParameters- provide default values here
Grid Theme- link to your grid theme defined in step 1
GridFieldParserType- link in first point, use default:
Sitecore.XA.Foundation.Grid.Parser.GridFieldParser,Sitecore.XA.Foundation.Gridif you are not going to customize anything.
GridBodyViewPath- path to your
cshtmlfile which contains your grid layout. Remember to include all necessary placeholders (
Create Scaffolding Setup
/sitecore/system/Settings/Feature/Experience Accelerator/Bootstrap/Grid Setup
This item contains only link to a
Grid Definition and
Name that will appear in a new Site Dialog in the tab with grid selection