SharePoint 2010 OOTB Note Board Web Part item display form

SharePoint 2010 OOTB Note Board Web Part item display form


Well this is a very nice and simple OOTB customization I just learned to use, it allows users to add comments in a document library using the out of the box Social Note Board Web Part.

What is surprisingly great about it is that the comments are specifically related to the document you comment on.

So just follow these simple steps to add the Note board capability to your document library:

  1. Go to your document library and choose to edit your display item form:

    SharePoint 2010 OOTB Note Board Web Part item display form

    Edit Display item Form

  2. From the social collaboration category add the Note Board web part preferably beneath your view item Web Part:

    SharePoint 2010 OOTB Note Board Web Part item display form

    Add Note Board WP

  3. Save your changes.
  4. Choose to view one of your documents properties:

    SharePoint 2010 OOTB Note Board Web Part item display form

    View Item Properties

  5. Add a comment in the Note Board WP, and see the magic…

    SharePoint 2010 OOTB Note Board Web Part item display form

    View Note Board

Easy and useful CSS trick to replace Image

Check out this Easy and useful CSS trick to replace Image

I used this Easy and useful CSS trick today, we are using the Bamboo Survey Web Part in my company, and I got a request to hide the survey vote results from the users and show a thank you message instead of the votes Pie chart. So what I did was adding this code to the page in a hidden Content Editor Web Part replacing the image. but since you cannot replace the Img src by using css what you do is you resize the image to zero height and width and add a background image to replace it, and the magic part is you add a padding attribute to the image to set your new backgroung image size.. here is the css code I used:


{code type=css}

<style>

#myImageID

//or .MyImageClass

{
width:0px;
height:0px;
padding: 50 px;
background-image: url (‘MyNewImageUrl’);
}

</style>

{/code}

Before Web Part With PieChart Img

The Web Part With Original PieChart Img

 

 

 

 

 

 

 

 

 

 

 

After adding the Css The Same Web Part showing a Thank You message Image

After adding the Css The Same Web Part showing a Thank You message Image