Sunday 2 March 2014

Add Banner background in SharePoint 2010

Add Banner background in SharePoint 2010

1.Create a simple custom CSS file
2.You will then use the Alternate CSS feature of SharePoint Server to attach it to the site
Note: This feature is not available in SharePoint Foundation, so you would need to customize the master page to reference a custom CSS file
I have downloaded one image from below site
Saving it in JPEG format
Upload your banner image to the images folder in the style library in your site
My Image path:
Create new CSS file to reference your banner. CSS files are just plain text, so open NotePad and copy in the following:
.ribbonbackground, .s4-title {
background:url(‘/Style%20Library/images/MC900441701.jpg’) no-repeat 0 0 !important;
}
This applies the background image to page elements tagged with styles “ribbonbackground” and “s4-title”.These are the banner areas in the nightandday and v4 master pages respectively.
The “!important” seems to be required to override the style in nightandday, because it has its own stylesheet which otherwise takes priority over the site’s alternate CSS. Edit the URL of the background image as required if you called your background image something different.
Save this file as “Custom.css” on your computer, then upload it to the top level of your style library. Then go to Site Settings and select Master page in the Look and Feel section. At the bottom you will find the option to enter a URL for an alternate CSS for the site. You can use the Browse… button to locate the CSS file you uploaded to the style library.
If you are not able to find “Master page” option, then click below link
Change your server name at SERVER
/Style Library/Custom.css
Select OK and your new banner will appear on system and list view pages