WebForm - Content area without enclosing divs

Member since: 2010

Hi guys,

We have a EPiServer 7.5 (webform) solution that uses ContentArea on different forms. EPiServer renderes additional <div>s while rendering the blocks and I would like to remove those divs. We are using EPiServer:Property to render contentArea. To remove these divs, I have found couple of solutions (create your own ContentAreaRenderer e.g. http://jondjones.com/episerver-7-extra-divs-in-content-area-how-to-remove-them/ ) for MVC application  but found no solution for webform application.

Any hints in this regard will be highly appreciated.

Thanks

#120174 Apr 13, 2015 11:17
  • Member since: 2002

    Hi Tahir!

    For web forms, property controls always have a wrapping element while MVC only has this element when in the on page edit view. You could probably do the same for for this specific property type though I would consider it a bit advanced. You can register a custom renderer by using the PropertyControlClassFactory as explained by Ted Nybergs blog post: http://tedgustaf.com/blog/2010/8/map-episerver-properties-to-custom-property-controls/

    Then, you need to override the CreateDefaultControls and CreateOnPageEditControls methods, implement your own version of the CreateContentAreaControls and CreateMainContainer methods (by using reflection), then finally make sure that the control returned from the CreateMainContainer method is a custom class where you can toggle rendering of start and end tags.

    As said, the above is to be considered a bit advanced but if you are skilled in web control development and reflection, it should surely be possible. Please note that by having different markup in the main and editorial views, things might look a bit different.

    #120188 Apr 13, 2015 13:46
  • Member since: 2010

    Thanks Linus. Works perfectly. Overridden the PropertyContentArea and managed to remove the outer container div for ContentArea. However still strugling to remove the additional divs rendered by the blocks within the content area. Any suggestions?

    #120199 Apr 13, 2015 16:17
  • Member since: 2002

    I looked into the code and the controls for each item is created by the class ContentControlResolver. I think that it would be real hard changing this but if you want to give it a try, you probably have to replace the instance of the ContentControlResolver that is used in the property control and in that class in turn replace the creation of ContentRenderers with your own class. I would really try to avoid this if possible though...

    #120204 Apr 13, 2015 16:37
  • Member since: 2011

    Is there a reason to get rid of enclosing <div> element for block?

    #120233 Apr 13, 2015 23:19
  • Member since: 2007

    I wrote an article with a fully working code sample if that helps: http://jondjones.com/episerver-7-extra-divs-in-content-area-how-to-remove-them/

    #120568 Apr 20, 2015 18:23
  • Member since: 2011

    Nice writing :) I implemented something similar for Bootstrap Aware renderer - just with an opt-in feature to enable or disable <div> rendering if content of the block turns out to be empty.

    https://github.com/valdisiljuconoks/EPiBootstrapArea

    #120570 Apr 20, 2015 19:45
  • Member since: 2010

    @Jon. Thanks, I have looked at that but this implementation is for MVC. I need something in Webforms.

    @Valdis. Ofcourse there is a  reason :) Basically, we are upgrading a EPiserver 6 R2 Composer based website to EPiServer 7. To ensure all the data is migrated correctly and there is no 404 etc, one of the requiremente is, to write a utility that crawl through both the websites (6 and 7) and compare the rendered html to see nothing is missed in the migration process. Now with the additional divs, comparison can't be made.

    @Linus. Thank Linus for your help. I have used your suggested method to add additional attributes to additional divs and then in my utility application, removed the divs using the html agility pack. Kindof hack but it worked in our case. Thanks once again.

    #120627 Apr 21, 2015 13:39
This topic is locked because the last reply was posted more than 6 months ago. Please contact epw@episerver.com to unlock it.