How to create a custom module in 5.0
GOAL:
To create a redistributable module that contains multiple front-end
widgets that is compiled into a .dll for easy installation across
multiple sites.
I am writing this post after hours of searching and frustration with either not being able to find examples/blogs/posts on what I am trying to accomplish or finding docs or posts that are for older versions of sitefinity and are no longer relevant. I am fairly new to sitefinity and that might also be why I am having trouble wrapping my head around the framework and how everything works. So below is my plea for help. I looked at the intra-site modules video which gave me a understanding of how to create a module and install it using a aspx page. I was able to install the module but never got the widgets to show in the content toolbox. Then I searched and found pluggable modules which looked like the option to go with until I read further and realized that the doc was only for 3.x installations. Then I looked into the SDK and opened up a couple of the samples like Jobs and Locations and those seemed to do much more than what I am trying to accomplish.
I have searched through most of the blogs/documentation and can't seem to find what I am looking for or at this point I might have missed it because my eyes are crossed. Can someone please point me in the right direction?
Couple ways you can do it...
1) Install the SDK, have a look at the "Products" sample module
2) Install the sitefinity thunder visual studio addin. Then when you go Add->New->Sitefinity->Module you can just add the bones for a new module.
You can also use the Sitefinity Module BUILDER in the backend UI. Once done it then has an export\import function if you need to move it across instances. Its the easiest (codeless) way to store data in sitefinity...everything gets generated for you :)
I do this for all of my modules and I did struggle with it at first because I was also really new to Sitefinity. What widgets aren't installing? The Admin pages or the widgets that you drag onto your front end pages?
Brett, the front end widgets were not being installed.
Steve, I'm trying out #2 but can't seem to find the Add -> New -> Sitefinity -> Module. I can only add a new project.
Try right-clicking the SF project
Steve,
I know I can add the custom module to the Sitefinity project and have already tried that route but what I am trying to do is to compile my module into a dll so that I can redistribute it do multiple sites. If I create a new class project and add the Sitefinity Custom Module to that project I might be able to do it, correct?
I have never created one from scratch, but in theory, yes that seems MAYBE right? :)
Like SF is a webapp anyway, so itself all compiles into a DLL. So even if you took something create in the webapp project and copied it out to an external library project that should work too. (obviously fix references\template paths)
Whenever, I had issues with this its because the widget registration section of of class inheriting from ModuleBase was missing or was erroring out.. If you have a class that inherits from ModuleBase, I'd recommend debugging it to see where the exception is occurring. Here is a sample from one of my modules. The name looks weird because I have to change the original name.
/// <summary> /// Installs this module in Sitefinity system for the first time. /// </summary> /// <param name="initializer">The Site Initializer. A helper class for installing Sitefinity modules.</param> public override void Install(SiteInitializer initializer) #region Install Pages // get page manager var pageManager = initializer.PageManager; // create Module Landing Page if doesn't exist var landingPage = pageManager.GetPageNodes().SingleOrDefault(p => p.Id == this.LandingPageId); if (landingPage == null) // create admin list view control and add to new landing page var ctrl = pageManager.CreateControl<PageControl>("~/Modules/ModuleAreas/Admin/ModuleAreasAdminView.ascx", "Content"); CreatePage(pageManager, LandingPageId, SiteInitializer.ModulesNodeId, ModuleAreasModule.ModuleName, true, ModuleAreasModule.ModuleName, ctrl); // create ModuleAreas "Create" Page if doesn't exist var createPage = pageManager.GetPageNodes().SingleOrDefault(p => p.Id == this.CreatePageId); if (createPage == null) // create admin control, set properties var ctrl = pageManager.CreateControl<PageControl>("~/Modules/ModuleAreas/Admin/ModuleAreasAddEditView.ascx", "Content"); var prop = ctrl.Properties.FirstOrDefault(p => p.Name == "Mode"); if (prop == null) prop = new ControlProperty(); prop.Id = Guid.NewGuid(); prop.Name = "Mode"; ctrl.Properties.Add(prop); // set control to "Create" mode prop.Value = InstalledWebComponents.Modules.ModuleAreas.Admin.ModuleAreasAddEditView.AdminControlMode.Create.ToString(); // create backend page and add control CreatePage(pageManager, CreatePageId, LandingPageId, "Create", false, "Create Module Area", ctrl); // create ModuleAreas "Edit" Page if doesn't exist var editPage = pageManager.GetPageNodes().SingleOrDefault(p => p.Id == this.EditPageId); if (editPage == null) // create admin control, set properties var ctrl = pageManager.CreateControl<PageControl>("~/Modules/ModuleAreas/Admin/ModuleAreasAddEditView.ascx", "Content"); var prop = ctrl.Properties.FirstOrDefault(p => p.Name == "Mode"); if (prop == null) prop = new ControlProperty(); prop.Id = Guid.NewGuid(); prop.Name = "Mode"; ctrl.Properties.Add(prop); // set control to "Create" mode prop.Value = InstalledWebComponents.Modules.ModuleAreas.Admin.ModuleAreasAddEditView.AdminControlMode.Edit.ToString(); // create backend page and add control CreatePage(pageManager, EditPageId, LandingPageId, "Edit", false, "Edit Module Area", ctrl); #endregion #region Register Toolbox Widget // Install configuration // get section from toolbox var config = initializer.Context.GetConfig<ToolboxesConfig>(); var pageControls = config.Toolboxes["PageControls"]; var section = pageControls .Sections .Where<ToolboxSection>(e => e.Name == ToolboxesConfig.ContentToolboxSectionName) .FirstOrDefault(); // create section it if it doesn't exist if (section == null) section = new ToolboxSection(pageControls.Sections) Name = ToolboxesConfig.ContentToolboxSectionName, Title = "ContentToolboxSectionTitle", Description = "ContentToolboxSectionDescription", ResourceClassId = typeof(PageResources).Name ; pageControls.Sections.Add(section); // add widget to section if it doesn't exist if (!section.Tools.Any<ToolboxItem>(e => e.Name == ModuleAreasView.ViewName)) var tool = new ToolboxItem(section.Tools) Name = ModuleAreasView.ViewName, Title = "Module Areas View", Description = "Public control for the Module Areas module", ControlType = "~/Modules/ModuleAreas/ModuleAreasView.ascx", CssClass = "sfModuleAreasWidget" ; section.Tools.Add(tool); #endregion Ok, I see that you check if the section is null and if it is you are creating a new section for your widgets, correct?
if (section == null) section = new ToolboxSection(pageControls.Sections) Name = ToolboxesConfig.ContentToolboxSectionName, Title = "ContentToolboxSectionTitle", Description = "ContentToolboxSectionDescription", ResourceClassId = typeof(PageResources).Name ; pageControls.Sections.Add(section); It depends on what section you want your widgets to be displayed. The code corresponds to the following section in Sitefinity (Attached)
After installing the module, I added one of my widgets to a page and clicked on the Edit and my custom designer is not showing. I deleted the designer and recreated it but it is still not loading when I click edit on my widget. Any ideas?
So your widgets are now showing in your toolbox? If so, awesome!
It will be tough to know without seeing code but a few things that come to mind:
1) Are you getting Javascript Errors?
2) Does your Sitefinity Log show in exceptions?
3) Is your designer's file (javascript, .ascx) set as embeded resource instead of content? (you can check this under the build action)
The widgets are in the toolbox. Im not seeing any javascript errors or errors in the log file/s. Im not sure I understand what you are saying in question #3. How do I set a designer to be a embeded resource? build action?
I just noticed that none of my widgets are working when installed as a part of the module. I can upload some code snippets if needed.
Code is always good. Can you describe what isn't working? Is your edit button giving an exception? If it is, you should be able to find out what line is giving you trouble.
If you have a special widget beyond what is normally shown when click edit you typically have a designer that is attached to your control with a javascript file. These files need to be installed as an embedded resource. To do this, right click on those files, click properties. There should be a build action property, you can set this to embedded resource.
There was no exception being thrown it was just opening the Edit to the regular edit window when you do not have a designer attached. Im trying to set these items as a embedded resource but now the main widget can't find the reference to the Designer. Seems like everything I do, I hit a wall.
Since I wasn't able to create the module correctly, I tried just implementing the widgets themselves, but I am having another issue with one of the designer's not reading the updated javascript file. When I first registered the widget the javascript file had a bad reference in it causing it to error out. Now after fixing the bad reference, its reading a cached version that has the error in it. I've fixed the file and it should be working but its not. Any ideas?
Thanks for all the help by the way. I appreciate it very much.
Without seeing code or knowing your exact error message, I cannot offer anymore advice on what to do. If you can provide these items, I might be able to get you over the next wall.
Hi,
In order to investigate the problem can you please use Developer Tool for Internet Explorer (it is built in the browser, click F12) or use Firebug (it is a plugin for Firefox) and tell us what errors you are getting. Maybe the problem is caused by some JavaScript that is conflicting the scripts of our page editor. Please review the NET tab for any specific Java Script errors.
Kind regards,
Stefani Tacheva
the Telerik team