Images from picture library not displayed in IE

Today I discovered a strange behavior in Internet Explorer. I  uploaded some images to my image library and I referred to them in my custom aspx page. All the images displayed correctly except one. In Firefox everything rendered correctly, in IE only the thumbnail and the web image was available. The full image was not available and I received a red cross on my page.

Conclusion: the image was corrupt!

How to use SharePoint’s default modal popup from code behind?

A while ago I needed to create a shopping basket. When you click on an item in that basket it would be nice if that item opens in a modal popup. But how can you access the default SharePoint modal popup dialog if it isn’t in your masterpage?

I used following code:

public static class Helper
{
    public static string GetDialogURL(string url, bool refreshOnClose, double width, double height)
    {
        string str = string.Concat(new object[]
		{
            "SP.UI.ModalDialog.showModalDialog({ url:'",
			url,
			"',tite: 'Move Documents',allowMaximize: true ,showClose: true,width:",
			width,
			",height:",
			height
		});
        if (refreshOnClose)
        {
            str += ",dialogReturnValueCallback: function(dialogResult){SP.UI.ModalDialog.RefreshPage(dialogResult)}";
        }
        str += "});";
        return str;
    }
    public static string GetDialogURL(string url)
    {
        return Helper.GetDialogURL(url, true, 700.0, 800.0);
    }
}

XSL template to obtain all visible fields in Content Query WebPart

When we are editing XSLT for Content Query WebPart, XSLTListViewWebPart or any other WebPart with configurable XSLT, you can obtain all list fields and their values with following template:

<xsl:template name="ShowXML" match="Row[@Style='ShowXML']" mode="itemstyle">
    <xsl:variable name="SafeLinkUrl">
      <xsl:call-template name="OuterTemplate.GetSafeLink">
        <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
      </xsl:call-template>
    </xsl:variable>
    <xsl:variable name="DisplayTitle">
      <xsl:call-template name="OuterTemplate.GetTitle">
        <xsl:with-param name="Title" select="@Title"/>
        <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
      </xsl:call-template>
    </xsl:variable>
    <b>
      Item: <i>
        <a href="{$SafeLinkUrl}" title="{@LinkToolTip}">
          <xsl:value-of select="$DisplayTitle"/>
        </a>
      </i>:
    </b>
    <ol>
      <xsl:for-each select="@*">
        <xsl:sort select="name()"/>
        <li>
          <xsl:value-of select="name()" />
          <xsl:text disable-output-escaping="yes"> </xsl:text>
          <i>
            <xsl:value-of select="."/>
          </i>
        </li>
      </xsl:for-each>
    </ol>
    <br />
  </xsl:template>

Notice that @ is the beginning char of any list field.

SharePoint 2010 Search Center MasterPage with navigation

It’s hard to navigate from a Search Center, so I decided to modify the minimal masterpage to allow you to show the topnavigation of the page. It will also show the site icon and breadcrumb navigation just like the v4.master does.

Minimal masterpage with navigation

SharePoint 2010 Branding: what’s publishing masterpage all about

It’s a real disaster to start branding with the default v4.master. It’s much easier when everything is commented and outlined like it should be. That’s what I did today.

v4.master

Enjoy it!

Transparency settings for all browsers

Transparency css that covers all browsers.

Very handy css class

.transparent
{

/* Required for IE 5, 6, 7 */ /* ...or something to trigger hasLayout, like zoom: 1; */
width: 100%;

/* Theoretically for IE 8 & 9 (more valid) */ /* ...but not required as filter works too */ /* should come BEFORE filter */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

/* This works in IE 8 & 9 too */ /* ... but also 5, 6, 7 */
filter: alpha(opacity=50);

/* Older than Firefox 0.9 */
-moz-opacity:0.5; /* Safari 1.x (pre WebKit!) */
-khtml-opacity: 0.5;

/* Modern! /* Firefox 0.9+, Safari 2, Chrome any? /* Opera 9+, IE 9+ */
opacity: 0.5;

}

Set ribbon smaller via CSS

Thanks to my colleague (Laurent Schoenaers) for following css:

body #s4-ribbonrow {background-color: #FFA113; margin-top: -20px;}
.ms-siteactionsmenuinner {background:transparent;background-color:#FFA113;border-color:#FFA113;}
.ms-cui-topBar2 {border-bottom:0px;}
.ms-cui-TabRowRight {margin-top: -12px !important; padding-top: 36px !important;}
.ms-cui-ribbonTopBars div {border-bottom:1px solid transparent;}
.s4-trc-container-menu {margin:0;} 

before:

after: