Skip Ribbon Commands
Skip to main content

Dynamic Page Layouts in SharePoint 2013 - Part 4

Rendering the Dynamic Page

James Strugnell

02/11/2016

​This is the 4th (and likely final) part of our series on how we built a dynamic page template in SharePoint 2013, enabl​ing content managers to configure a custom grid layout within the page. You can find the previous articles in the series here:

In this article we're going to cover the code which consumes the current page level configuration and renders out the user-configured rows, including the web part zones, which comprise the page.​

​​Custom Page Layout and Web Control

Firstly, we created a custom Page Layout called "Dynamic Page Template". We then added to that page a custom ASP.Net web control, DynamicWebPartZoneRenderer.cs. The entire page template can be viewed ​here:

https://github.com/jstrugnell/SharePointDynamicPageLayouts/blob/master/DynamicPageLayouts/Common/Branding/PageLayouts/dynamic.aspx

The custom web control can be viewed here:

https://github.com/jstrugnell/SharePointDynamicPageLayouts/blob/master/DynamicPageLayouts/Common/WebControls/DynamicWebPartZoneRenderer.cs

Loading the Current Page Configuration

As established in the previous articles, the page configuration data is stored as a JSON string in a SharePoint field for the current page. For a quick recap, the first action performed by the DynamicWebPartZoneRenderer control is to pull the configuration JSON data out of the page field, and de-serialize into a C# object, of type "PageWebPartZoneConfiguration". This class is essentially a collection of "Row Configurations" each of which represents s single row as configured by the page editor. Each Row has the following available settings (we actually implemented more in the real solution):

  • Id – This is a unique ID (GUID)
  • Order – This number enforces the sequence in which the rows are added to the page
  • BackgroundColour – This is used as the background colour of the entire row
  • MarginTop – This is the gap that should be injected above the current row
  • MarginBottom – This is the gap that should be injected below the current row
  • PaddingTop – This is the gap that should be injected between the content and the top of the row
  • PaddingBottom – This is the gap that should be injected between the content and the bottom of the row
  • Layout – Perhaps the most important setting, this field represents the layout for the row. We have defined a number of pre-defined layouts that content editors can choose from. Each layout is implemented as a "User Control", made up of one or more Web Part Zones, and is loaded dynamically on to the page.

So once we have the configuration data de-serialized, we can then loop over each row and dynamically render the User Control associated with the "Layout" property. Some of the configuration for each Layout is hard coded in the HTML, for example the number of columns that exist. Other aspects, such as the margin, padding and background colour, need to be set at run-time. This is done in the Base Control from which each Layout User Control inherits - BaseWebPartZoneLayout.

BaseWebPartZoneLayout

Each Row Layout User Control inherits from a single base user control called "BaseWebPartZoneLayout". Each User Control is implemented consistently with known conventions. This allows the Base Control to manipulate the layout elements according to the configuration set for the current Row. For example, every Row User Control has an ASP.Net Panel with an ID of pnlRow. We then reference that Panel from the Base Control and configure its background colour, margin and padding according to the applied configuration.

We also implement the "Edit" button from this Base Control. We detect if the page is currently in Edit mode and then render out a link for each Row which enables the logged-in user to open up and manage the settings for each row.

Configuring the Web Part Zones

If you recall from the first article in this series (all those months ago...), the first hurdle we had to overcome was whether we could dynamically add Web Part Zones to a page. We now know that this is indeed possible but we never fully explained quite how. The big issue was that every Web Part Zone needs to have a unique ID. It also needs to maintain that ID through page postbacks and reloads. Each Web Part Zone also needed to maintain the same ID even if its parent Row was repositioned within the page. So how did we ensure all of this?

Each Web Part Zone is statically added in to its parent User Control. They are purposely not assigned an ID at this stage as they need to be unique to the whole page. So how do we assign these IDs uniquely and consistently?

After the Layout Control has been loaded and initialised (e.g. Colour, Padding, Margins assigned) we then pass an instance of the User Control (via a handle on the Base Control) into a method called "ConfigureChildWebPartZones". This method also receives the "ID" (GUID) for the current Row.

We then loop over each "Control" inside the User Control recursively hunting for any Web Part Zones. When we find one, we then set its ID to a concatenated string comprising of the literal string "dynamicZone_" plus the row ID, plus the index of the Web Part Zone (i.e. if it's the first Web Part Zone we hit, this will be number 1).

Once this process has finished every Web Part Zone is assigned a unique ID, and one that persists even when the Row is moved around the page. If the Content Author changes the designated Layout configuration then any Web Parts within will potentially move. This is not a big problem however, and can be resolved by the editing user.

Please review the code on Github for a complete picture of the process outlined above.

Conclusion

That brings us to the end of this series. Hopefully it has served to present a number of useful techniques that have been brought together to build a much-used feature on our custom web platform. The customisable row settings detailed in this series are really just a starting point. Any number of other possible settings could be applied further enhancing the options and opportunities to page editors.

We have placed a cut down working version of this solution on Github which can be found here: https://github.com/jstrugnell/SharePointDynamicPageLayouts

If you have any questions or suggestions for other enhancements or improvements please get in touch.

Thanks.​





 About us

Fuse Collaboration Services is a Cloud Solution Provider and Microsoft Gold Partner specialising in delivering SharePoint, Skype for Business, and Azure cloud-based solutions. Based in Northampton, UK.

Microsoft Gold Partner Logo showing 5 competencies

Read more

 Latest Tweets

 Latest Blog

 

 

How to use SaaS solutions to identify sensitive data1497<p class="lead">​​​​​​​​​​​This article is going to look specifically at how we implement the use of software (SaaS) to enable your organisation to become ready for the GDPR quickly and easily, without interruption to your end users.</p><p> <strong>The first step in getting ready for the GDPR is to know what data your organisation holds</strong>. At the time of writing this article, the new legislation is only <strong>268 </strong>days away and the four main questions you n​eed to be able to answer to ensure your organisation is ready are&#58;</p><ul><li>What data does your organisation hold?</li><li>Where is the data kept?</li><li>Why do you need to use or keep the data?</li><li>Do you have consent to use the data?​</li></ul><div class="thumbnail"> <img class="img-responsive" alt="A padlock on a background of binary data" src="/ourblog/PublishingImages/Pages/How-to-use-SaaS-solutions-to-identify-your-data,-ensuring-your-organisation-is-ready-for-the-GDPR/shutterstock%20Data%20protection%20GDPR%20blog.jpg" style="max-width&#58;500px;" />​</div>​ <h3>What is defined as sensitive data under the GDPR?</h3><p>In terms of the GDPR, sensitive data is defined as personal data, but goes further than the Data Protection Act and includes online identifiers such as an IP address. The GDPR applies to both automated personal data and manual filing systems. You can be held responsible for breaching the GDPR by allowing personal data to be compromised either by&#58;</p><p>Misuse - using data for purposes other than that defined and recorded&#160;consent given for;</p><p>or </p><p>for data breaches, even if the breach was a malicious act (hacking), if you can't prove you had adequate data security measures and processes.&#160;​</p><div class="row"><div class="col-md-6"><h4>Will my company have GDPR sensitive data?</h4><p>Data that can identify any individual, such as a name, National Insurance number, passport, IP address or even biometric data - a soon as this is recorded in any system, in a file, a database record, or even on paper - that data then falls under the remit of the GDPR. As every organisation has staff records, every company will be affected by GDPR to some extent. </p><p>However, the more individuals you deal with, and the longer you hold that data for, the more prone you are to breaches of the legislation. Companies that perform data processing, even on behalf of other companies, and particularly those that use personal data records for multiple purposes (for example re-marketing) are at most exposure to GDPR.</p></div> <div class="col-md-6"><h4>​Examples of who will be most affected&#58;&#160;</h4><ul><li>Retailers – High street shops and online retailers storing customer profiles</li><li>Health Sector -&#160; Hospitals, doctor’s surgeries, scientific research organisations, pharmaceutical companies, with patient records</li><li>Education sector - Schools, colleges and universities, storing current and past student records</li><li>Financial sector – Banks, mortgage and insurance providers, with customer accounts</li><li>Recruitment companies - candidate records</li><li>Charity organisations - records of donors and recipients</li><li>Estate Agents - vendor and client records </li><li>Legal profession – Solicitors, CPS and courts - client records.</li></ul> ​</div></div><hr />​ <h3>​How to identify data and ensure all your data is GDPR compliant?&#160;</h3><p>There is an easy and quick way to find out what data you hold and you will be relieved to know we work alongside companies that are currently releasing SaaS solutions that are designed purely to scan, discover and analyse your data, to ensure you only hold data that is GDPR compliant.&#160;&#160;<br></p><p>Our Partners have solutions that use metadata to scan and analyse data which has enabled the migration of data to SharePoint for some time. It’s this technology that’s enabled these new solutions to be <strong>created specifically for the use of identifying what data you have and if it is GDPR compliant</strong>. Using NPL (Natural programming language) such as “name”, “address” or “credit card number”) this process can be done in days not months and can easily identify documents in unstructured databases, file shares and SharePoint. </p><p>The discovery phase of the SaaS tool is an important part of the new solutions as they are designed around common datatypes that can be tagged easily e.g. names, addresses, age of document, author of document, credit card numbers, postcodes IP addresses. The solution we use comes with predetermined taxonomies which can be edited easily, to reflect the sector that your organisation works within. Dashboards are then accessed with detailed data analysis which identifies the data that will not be compliant with the GDPR. Additional columns appear alongside your files with a “true” or “false” label showing whether the files are compliant with the GDPR and our team of consultants are experienced in using this technology and can advise you depending on your specific IT infrastructure.</p><hr /><h3>Hype around the GDPR&#160;</h3><p>There is a lot of hype around the new GDPR coming out in May which appears to be fairly negative but instead of viewing it as a tiresome challenge that your organisation must overcome, I would advise viewing it as an excellent opportunity to gain a competitive edge within the market. Whatever your opinion is and I doubt there are many companies that relish the additional resources that will be needed to comply; from a customer’s perspective, it <strong>must </strong>be a good thing. The trust in any business relationship is one of the fundamental reasons why you have a successful company. In an age where we frequently see headlines describing yet another data breach, damage to a business’s brand and reputation is an expensive result of avoiding being compliant with the new regulations.</p><hr /><h3>What to do right now!&#160;</h3><p>The key decision makers in your organisation need to be made aware of the GDPR. They need to know that the first thing they need to do is to find out what data their organisation holds. This is where we come in.</p><p>Although GDPR isn’t an IT issue as it will ultimately fall to the responsibility of who is currently responsible for your Data Protection E.g. Compliance Managers, Data Protection Officers, Data Controllers and Office Managers, the team at Fuse will be able to provide a technical solution to determining what data is held.</p><p>Before any amendments to existing internal procedures, policies or customer facing documentation such as websites and application forms can be changed they must know what is relevant to the GDPR. It may be the case that a lot of the data you hold is ROT and this can simply be deleted. If you have a completely unstructured filing system and want to take the opportunity to improve the efficiency of your business we don't just offer technical expertise, we are experienced in developing proofs of concept, functional and technical specifications. We can either then take responsibility for delivering the project or work alongside your IT departments providing a technical lead.</p><p>It doesn’t matter whether you have an inhouse IT department or not as we can work alongside existing IT managers, Compliance or HR managers. An IT consultancy needs to be your first port of call as they can advise you as to which is the best SaaS solution for your business depending on the size of your business and your budget. Having expert knowledge of your IT infrastructure and how it works is important to ensure that the right solutions are used. The benefits of using SaaS is that your end users are not interrupted and your IT departments are not impacted either. </p><p>You need to weigh up the cost of using an IT consultancy who can implement the right tools against the extra resources it will take to trawl through and analyse your data manually. This can seem daunting, but it’s a great opportunity to get your data in order and have confidence that your organisation can be proud of its commitment to protecting the data of its employees, customers and suppliers.​</p><div class="well well-lg"><p class="lead">If you want further advice or a quote on how we can help you get ready for the GDPR call Fuse today on 01604 797979 or <a href="/_layouts/15/FIXUPREDIRECT.ASPX?WebId=4fc45909-2b6d-48b9-bcf9-a446e9d472d6&amp;TermSetId=c98895cd-d37f-4406-9cff-5480b4f829b6&amp;TermId=218eb0be-10f6-490a-82a7-a7fd47c8de90">contact us​</a></p></div>​l.ozier@fusecollaboration.com | Louise Ozier | 693A30232E777C6675736563735C6C2E6F7A696572 i:0#.w|fusecs\l.ozier28/08/2017 23:00:002017-08-28T23:00:00Z Ensuring your organisation is ready for the GDPR21/11/2017 00:16:476228htmlFalseaspx

 Contact us

Our address
12-14 Brookfield, Duncan Close
Moulton Park, Northampton
NN3 6WL
P: +44(0)1604 797979
Contact Us