Hide custom code within SP 2010 modal windows


If you have ever added custom elements to your master page above or below the standard DIV tags you will notice that they start appearing in the SharePoint 2010 Modal windows when you don’t want them to.
The simple fix is to use the class “s4-notdlg” on your custom element to hide it when viewing the modal pop up windows.
To give you a better idea of what I am talking about I added in a simple DIV tag right above the s4-ribbon row DIV: The inline CSS below is just to make it stand out.

Here is my custom header


Here is what the site looks like with the custom header applied:
image
If I create a new list item or upload a document, the Modal Window shows my custom div above the input form. Not good…
image
To fix this you simply have to add the “s4-notdlg” CSS to the custom DIV tag to hide it from the modal window.
Example:
Here is my custom header

Now the modal window will not show my custom DIV:
image

Comments

Post a Comment

Popular posts from this blog

SharePoint: Group By on more than 2 columns in a view (SP 2010)

Image
An expanded version of this article, along with many other customization examples and how-tos can be found in my book,  SharePoint 2007 and 2010 Customization for the Site Owner . This is an update of an  article written for SharePoint 2007 . Many of the steps are the same in both 2007 and 2010, but both the SharePoint Designer steps and the default web part used for views have changed. Group By on more than 2 columns in a view In my SharePoint classes I have often been of asked how to group on more than two levels in a view. I have always given the quick answer of "use SharePoint Designer"!  But, some of you have asked "How?". You may be sorry you asked… but here goes…  Goals:  Create a view with nested groups deeper than just 2 levels Put the counts and totals at the bottom of each section. Do the above with no custom web parts, custom XSLT or anything that has to be deployed to the server. Sample:       Secrets and Tricks needed:  It can't be done &
Read more

Configure Form Based Authentication (FBA) in SharePoint 2010

Image
Steps to Configure FBA in SharePoint 2010  Below are the steps required to configure FBA in SharePoint 2010. I will be using MS SQL database as membership store for users.   A) Setting up ASP.NET Forms Authentication User and Role Data Source  1. Create Database  2. Configure Membership and Role Provider  3. Create User B) Create Web Application and Site Collections C) Configure Web.Config file  1. Configuring FBA web application web.config file 2. Configuring Central Administration web application web.config file 3. Configuring Security Token Service web.config file D) Adding User Policy to the FBA Web Application E) Verification Steps  A) Setting up ASP.NET Forms Authentication User and Role Data Source  This section explains creation of database which is used to store user's information such as credentials and roles which is used for Form Authentication. This section also explains the configuration of Membership and Role providers in the web.
Read more

SharePoint 2010 Windows PowerShell Interview Questions

Q. What is Windows Powershell ? Ans.  Windows PowerShell is a new Windows command-line shell designed especially for system administrators. In the SharePoint administration context, Windows PowerShell is another administration tool that supersedes the existing Stsadm.exe. Q. How is Windows Powershell different from Stsadm ? Ans.  Unlike stsadm, which accept and return text, Windows PowerShell is built on the Microsoft .NET Framework and accepts and returns .NET Framework objects. In addition to that it also gives you access to the file system on the computer so that you can access registry,digital signature certificate etc.. Q. What are cmdlet's? Ans.  Windows PowerShell introduces the concept of a cmdlet which are simple build in commands, written in a .net language like C# or VB. Q. Can you Create PowerShell scripts for deploying components in SharePoint ? Ans . If you are creating a webpart with VS 2010 then you can deploy it using ctrl + f5. However, to activate the
Read more