Thursday, 15 November 2012

SharePoint 2013 Look & feel in WebApp

Include these files

Copy sp.ui.controls.js from
<15 Hive>\TEMPLATE\LAYOUTS

Also, add SPHostUrl variable to query string, so address is something like:
TestPage.aspx?SPHostUrl=https%3a%2f%2fmyofficethreesixtyfive.sharepoint.com
<head runat="server">
    <title></title>
    <script src="../Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="../Scripts/sp.ui.controls.js" type="text/javascript"></script>
    <script type="text/javascript">
        var hostweburl;
        $(document).ready(function () {
            hostweburl = decodeURIComponent(getQueryStringParameter("SPHostUrl"));
            var scriptbase = hostweburl + "/_layouts/15/";
            $.getScript(scriptbase + "SP.UI.Controls.js")
        });
        function getQueryStringParameter(paramToRetrieve) {
            var queryString = document.URL.split("?")
            if (queryString.length > 1) {
                var params = queryString[1].split("&");
                var strParams = "";
                for (var i = 0; i < params.length; i++) {
                    var singleParam = params[i].split("=");
                    if (singleParam[0] == paramToRetrieve) {
                       return singleParam[1];
                    }
                }
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div
            id="chrome_ctrl_container"
            data-ms-control="SP.UI.Controls.Navigation"
            data-ms-options='{
                "appHelpPageUrl" : "HelpPage.html",
                "appTitle" : "Diff App",
                "settingsLinks" : [
                {
                    "linkUrl" : "Page1.html",
                    "displayName" : "Navigation 1"
                },
                {
                    "linkUrl" : "Page2.html",
                    "displayName" : "Navigation 2"
                }
            ]}'>
        </div>

Snippets can be downloaded from here:
Scripts snippet
Div container snippet


No comments:

Post a Comment