<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>SharePoint &#187; Decoration</title>
	<atom:link href="http://www.sharepointboris.net/tag/decoration/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.sharepointboris.net</link>
	<description>and Boris Gomiunik</description>
	<lastBuildDate>Thu, 22 Dec 2011 11:45:36 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Decorate SharePoint HomePage for Christmas</title>
		<link>http://www.sharepointboris.net/2009/12/decorate-sharepoint-homepage-for-christmas/</link>
		<comments>http://www.sharepointboris.net/2009/12/decorate-sharepoint-homepage-for-christmas/#comments</comments>
		<pubDate>Sat, 26 Dec 2009 13:58:51 +0000</pubDate>
		<dc:creator>Boris Gomiunik</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[SharePoint]]></category>
		<category><![CDATA[SharePoint branding]]></category>
		<category><![CDATA[Decoration]]></category>
		<category><![CDATA[Season]]></category>

		<guid isPermaLink="false">http://www.sharepointboris.net/2009/12/decorate-sharepoint-homepage-for-christmas/</guid>
		<description><![CDATA[How about spicing up company’s intranet for the season? Here’s a neat little trick you can make for adding season’s spirit&#160; to your SharePoint homepage. We’ll add some decoration to page’s head. The first thing you need is the images for the decoration. Don’t make them too big, because you can’t click on anything below [...]]]></description>
			<content:encoded><![CDATA[<p>How about spicing up company’s intranet for the season? Here’s a neat little trick you can make for adding season’s spirit&#160; to your SharePoint homepage. We’ll add some decoration to page’s head.</p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image6.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb6.png" width="615" height="218" /></a> </p>
<p>The first thing you need is the images for the decoration. Don’t make them too big, because you can’t click on anything below images. Below is a simple example I got from <a href="http://office.microsoft.com" target="_blank">Office Online</a>, merged it, removed background and reduced its size. Make sure you have a transparent image (a .GIF or .PNG with transparent background).</p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/christmas.gif" rel="lightbox[528]" title="christmas"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="christmas" border="0" alt="christmas" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/christmas_thumb.gif" width="128" height="92" /></a> </p>
<p>The first step is to upload the image to site’s document or picture library and copy the original image’s URL to clipboard. (don’t copy the SharePoint thumbnail or web preview image, as they tend to get white background instead of original transparent).</p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image7.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb7.png" width="244" height="140" /></a> </p>
<p>Next on your homepage add a <strong>Content Editor Webpart</strong> into any zone and edit its source.</p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image8.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb8.png" width="244" height="108" /></a> <a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image9.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb9.png" width="138" height="128" /></a> </p>
<p>And in the source simply type the following code:</p>
<p><strong>&lt;img src=&quot;[your-coppied-image-url]&quot; style=&quot;position:absolute; top: 0px; left: 48%; z-index: 99;&quot; /&gt;</strong></p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image10.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb10.png" width="244" height="205" /></a> </p>
<p>After you click &quot;Save&quot; and &quot;Apply&quot; the page in edit mode will have the decoration in a wrong place. </p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image11.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb11.png" width="244" height="76" /></a> </p>
<p>But not to worry, after you exit edit mode, the image will be in the right position. So final result might look something like below:</p>
<p><a href="http://boris.gomiunik.net/wp-content/uploads/2009/12/image12.png" rel="lightbox[528]" title="image"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="image" border="0" alt="image" src="http://boris.gomiunik.net/wp-content/uploads/2009/12/image_thumb12.png" width="244" height="148" /></a> </p>
<p>There are numerous variations. You can change the position, you can even use a div with a repeating background image,…</p>
<p>Merry Christmas and a Happy New Year to all SharePoint users and admins!</p>
<p>P.S. If you have any good image (appropriate for transparent background and not violating any copyright rules) for season&#8217;s decoration, please drop me a link in this post&#8217;s comments.</p>
<div style="padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; float: none; padding-top: 0px" id="scid:0767317B-992E-4b12-91E0-4F059A8CECA8:621a89fd-abbb-48f2-946a-71a0102154cf" class="wlWriterEditableSmartContent">Oznake ponudnika Technorati: <a href="http://technorati.com/tags/holiday" rel="tag">holiday</a>,<a href="http://technorati.com/tags/decoration" rel="tag">decoration</a>,<a href="http://technorati.com/tags/intranet" rel="tag">intranet</a>,<a href="http://technorati.com/tags/SharePoint" rel="tag">SharePoint</a>,<a href="http://technorati.com/tags/CSS" rel="tag">CSS</a>,<a href="http://technorati.com/tags/CSS+trick" rel="tag">CSS trick</a></div>
<p><!-- PHP 5.x --></p>
]]></content:encoded>
			<wfw:commentRss>http://www.sharepointboris.net/2009/12/decorate-sharepoint-homepage-for-christmas/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

