DYNAMIC PICTURE Library Slideshow and embedded with image link by Using SPServices and JQuery Cycle Plugin

<table width="940px" border="0" cellspacing="0" cellpadding="0">
    <tbody>

        <tr>
            <td width="260px">
            <div id="BGLStaticContentArea" style="display: block" >
                <img width="260px" height="175px" align="left" src="/sites/BGL/BGLBannersLibrary/BGLStaticBanner.jpg" border="0" alt="" /></div>
            </td>
            <td width="680px">
                <div id="slideshowContentArea" style="display: block"></div>
            </td>
        </tr>
    </tbody>
</table>
<script src="/sites/BGL/SiteAssets/jquery-1.6.1.min.js" type="text/javascript"></script>
<script src="/sites/BGL/SiteAssets/jquery.SPServices-2014.01.js" type="text/javascript"></script>
<script src="/sites/BGL/SiteAssets/jquery.cycle.all.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

    $(document).ready(function () {
        $().SPServices({
            operation: "GetListItems",
            async: false,
            listName: "BGLBanners",
            CAMLRowLimit: 10,
            completefunc: function (xData, Status) {
                $("#slideshowContentArea").html("");

                $(xData.responseXML).SPFilterNode("z:row").each(function () {
                    var title = $(this).attr("ows_Title");
                    var pictureURL = '/' + $(this).attr("ows_RequiredField");
                    var bannerLinkURL = $(this).attr("ows_BannerLinkURL");
                    var n = bannerLinkURL.indexOf(',');
                    bannerLinkURL = bannerLinkURL.substring(0, n != -1 ? n : s.length);

                    var liHtml = "<div padding=0><a target=_blank href=" + bannerLinkURL + "><img align=left border=0 height=175 width=680 src=" + pictureURL + "></a></div>";

                    $("#slideshowContentArea").append(liHtml);
                });
                $("#slideshowContentArea").css("display", "block");

                $('#slideshowContentArea').cycle({
                    fx: 'fade',
                    timeout: 6000,
                    delay: -3000
                });
            }
        });
    });
</script>

Image sliding Using JQuery Cycle plugin

<table width="100%"><tbody><tr><td width="70%" valign="top"><div id="slideshowContentArea" style="margin: 5px; display: block">&#160;</div></td></tr></tbody></table>
<script src="/sites/BGL/SiteAssets/jquery-2.1.1.js" type="text/javascript"></script><script src="/sites/BGL/SiteAssets/jquery.SPServices-2014.01.js" type="text/javascript"></script><script src="/sites/BGL/SiteAssets/jquery.cycle.all.js" type="text/javascript"></script><script language="javascript" type="text/javascript">
 $(document).ready(function () {
         $().SPServices({
            operation: "GetListItems",
            async: false,
            listName: "BGLBanners",
            CAMLRowLimit: 10,
            completefunc: function (xData, Status) {
                $("#slideshowContentArea").html("");
               
                $(xData.responseXML).SPFilterNode("z:row").each(function () {
var title = $(this).attr("ows_Title");
                  var pictureURL = '/' + $(this).attr("ows_RequiredField");
                    var bannerLinkURL = $(this).attr("ows_BannerLinkURL");
                    var n = bannerLinkURL.indexOf(',');
                    bannerLinkURL = bannerLinkURL.substring(0, n != -1 ? n : s.length);
                 
var liHtml = "<div><a target=_blank href=" + bannerLinkURL + "><img align=left border=0 height=150 width=680 src=" + pictureURL + "></a><a href=" + bannerLinkURL + "><p><strong>" + title + "</strong></p></a></div>";

                   $("#slideshowContentArea").append(liHtml);
                });
 $("#slideshowContentArea").css("display", "block");

                $('#slideshowContentArea').cycle({
                    fx: 'scrollDown',
                    timeout: 6000,
                    delay: -3000
                });
            }
        });
});
    </script>

Dynalmivallly update

<table width="100%">

<tbody>

<tr>

<td width="30%"><img width="250" height="135" src="/sites/BGL/Banners_homepage/_t/BGLStaticBanner_JPG.jpg" alt=""/></td>

<td width="70%" valign="top"><div id="imgRotator">&#160;</div></td>

</tr>

</tbody>

</table>

<script src="/sites/BGL/SiteAssets/jquery-2.1.1.js" type="text/javascript"></script>

<script src="/sites/BGL/SiteAssets/jquery.SPServices-2014.01.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript">

var newBanner =0;

function rotateimages(){

var bannerImg = new Array();

var bannerLink = new Array();

$().SPServices({

operation: "GetListItems",

async: false,

listName: "BGLBanners",

CAMLRowLimit: 10,

completefunc: function (xData, Status) {

var i=0;

$(xData.responseXML).SPFilterNode("z:row").each(function() {

var pictureURL= '/' + $(this).attr("ows_RequiredField");

var bannerLinkURL = $(this).attr("ows_BannerLinkURL");

var n = bannerLinkURL.indexOf(',');

bannerLinkURL = bannerLinkURL.substring(0, n != -1 ? n : s.length);

bannerImg[i]=pictureURL;

bannerLink[i]=bannerLinkURL;

i++;

});

}

});

var totalBan = bannerImg.length;

if (newBanner == totalBan)

{

newBanner = 0;

}

document.getElementById('imgRotator').innerHTML="<a target=_blank href="+bannerLink[newBanner]+"><img height=135 width=650 src="+bannerImg[newBanner]+"></a>";

newBanner++;

setTimeout("rotateimages()", 3*1000);

}

window.onload=function(){

rotateimages();

}

</script>

Dynamically Sliding Picture Library Images using SPService in CEWP (Content Editor Web part)

<div class="ama-outerwrapper"><table width="100%"><tbody><tr><td width="30%" class="ama-newsbox1"><img width="250" height="135" src="/sites/BGL/Banners_homepage/_t/BGLStaticBanner_JPG.jpg" alt=""/></td>
<td class="ama-newsbox2" valign="top"></td>
<td width="70%" class="ama-newsbox3" valign="top"><div class="ama-topnewsimage" id="imgRotator">&#160;</div></td></tr></tbody></table></div>
<script src="/sites/BGL/SiteAssets/jquery-2.1.1.js" type="text/javascript"></script><script src="/sites/BGL/SiteAssets/jquery.SPServices-2014.01.js" type="text/javascript"></script><script language="javascript" type="text/javascript">


var curImgIndex=0
function rotateimages(){
var bannerImg = new Array();
var bannerLink = new Array();
$().SPServices({
operation: "GetListItems",
async: false,
listName: "BGLBanners",
CAMLRowLimit: 10,
completefunc: function (xData, Status) {
var i=0;
$(xData.responseXML).SPFilterNode("z:row").each(function() {    
var pictureURL= '/' + $(this).attr("ows_RequiredField");
var bannerLinkURL = $(this).attr("ows_BannerLinkURL");
var n = bannerLinkURL.indexOf(',');
bannerLinkURL  = bannerLinkURL.substring(0, n != -1 ? n : s.length);
bannerImg[i]=pictureURL;
bannerLink[i]=bannerLinkURL;
i++;        
});  
}
});
var totalBan = bannerImg.length;

 
  if (newBanner == totalBan)
    {
    newBanner = 0;
    }
document.getElementById('imgRotator').innerHTML="<a target=_blank href="+bannerLink[newBanner]+"><img height=135 width=650 src="+bannerImg[newBanner]+"></a>";
newBanner++;
setTimeout("rotateimages()", 3*1000);
}

window.onload=function(){
rotateimages();
}</script>

Getting SharePoint List Items from Picture Library in CEWP

Step 1:

Add CEWP on page and GO to Edit Webpart and then click on html on top of the page and Add Jquery and SPservice Reference

<script src="/sites/BGL/SiteAssets/jquery-2.1.1.js" type="text/javascript"></script><script src="/sites/BGL/SiteAssets/jquery.SPServices-2014.01.js" type="text/javascript"></script><script type="text/javascript">

Step 2:-

Add below simple code to get the list items, Don't forget to provide your listName

$(document).ready(function(){
alert("CEWP inside");
            $().SPServices({
                operation: "GetListItems",
                async: false,
                listName: "BGLBanners",
                CAMLRowLimit: 6,
                completefunc: function (xData, Status) {
  $(xData.responseXML).SPFilterNode("z:row").each(function() {
         var _url = '/' + $(this).attr("ows_RequiredField");
  alert(_url);
   var img_Size= $(this).attr("ows_ImageSize");
               alert(img_Size);
       
      });            
                }
            });
        });
</script>


All the best :)

Get all Site and Subsites collection from other Web Application within the server

<div id="divContainer"></div>
<script src="/jquery.js/" type="text/javascript"></script><script src="//SPAPI_Core.js" type="text/javascript"></script><script src="/SPAPI_Webs.js" type="text/javascript"></script>

<script type="text/javascript">
s = new SPAPI_Webs(siteURL);
var xmlhttp= webs.getAllSubWebCollection();
if(xmlhttp.status == 200){
var xmlDoc = xmlhttp.responseXML;
var Webid= xmlDoc.getElementsByTagName("Web");
var html= '<table>';
for (i=0;i<Webid.length;i++) {
   var linkTitle = Webid[i].attributes.getNamedItem("Title").nodeValue;
   var linkURL = Webid[i].attributes.getNamedItem("Url").nodeValue;
   html = html + '<tr><td>';
   html = html + '<p style="border-radius:10px;background-color:Silver;border:2px solid black"><a href="' + linkURL + '">' + linkTitle + ' <img src="PlayButton.jpg" style="height:15px;width:15px;float:right" alt="linkButton"/></a></p>';
   html = html + '</td></tr>';
   }
}
html=html + "</table>";
document.getElementById("divContainer").innerHTML=html;

</script>

Get DDM values from SharePoint List in CEWP

Get DDM values from SharePoint List in CEWP

<div id="divContainer" ></div>

<script src="jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="SPAPI_Core.js" type="text/javascript"></script>
<script src="SPAPI_Lists.js" type="text/javascript"></script>
<script type="text/javascript">

function getDDMValues() {
var pcSites = new SPAPI_Lists(siteUrl );
var pcList = pcSites.getList(listName);
html = '<table width="100%">';
$(pcList.responseXML).find("Field[DisplayName='Community Type'] CHOICE").each(function () {
var fieldValue = $(this).text();
html = html + '<tr>';
html = html + '<td  onclick="getByType(this.innerText);">' + fieldValue + ' <img  src="/sites/myparagon/MIX/ImageLibrary/PlayGreen.jpg"
style="height:20px;width:20px;border:none;float:right;" alt=""/></td>';
html = html + '</tr>';
html = html + '<tr><td></td></tr>';
});
html = html + '</table>';
document.getElementById("divContainer").innerHTML = html;
}
</script>

How TO GET THE CURRENT SITE in CEWP using SPServices

How TO GET THE CURRENT SITE in CEWP
<script src="//JSFiles/jquery-1.11.1.min.js"></script>
<script src="//JSFiles/jquery.SPServices-2014.01.min.js"></script>

<script type="text/javascript">      

            var thisSite = $().SPServices.SPGetCurrentSite();
          alert(thisSite);
            document.write("The Current Site is " + thisSite);

</script>

Hide DIV when click outside of the specific div with jQuery

Hide DIV when click outside of the specific div with jQuery

<html>

<head>

    <title>GETTYPES</title>

</head>

<script src="\JSFiles\jquery-1.11.1.min.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript">

    var imageClicked = 0;

     document.onclick = function () {

        var menuList = document.getElementById("divMenuListContainer");

        if (imageClicked == 1) {

            //do nothing

            imageClicked = 0;

        }

        // Click was outside the box, hide it.

        else {

            //hide specific div

            html = '<p></p>';

            document.getElementById("divMenuListContainer").innerHTML = html;

        }

    }

    function getCommunitiesByType(type) {

         imageClicked = 1;

        var html = '<table width="100%">';

         html = html + '</table>';

         document.getElementById("divMenuListContainer").innerHTML = html;

        

    }

    function getCommunitiesChoices() {

        var html="<table onclick='getCommunitiesByType(this.innerText)'>";

           html = html + "</table>";

        document.getElementById("divContainer").innerHTML = html;

    }

</script>

<body>

<button onclick="getCommunitiesChoices();" type="button" value="button">Click ME to Get PC types</button>

<table id="tableID">

<tbody><tr>

<td valign="top"><div id="divContainer" style="border-top: cadetblue 1px solid; border-right: 1px solid; border-bottom: 1px solid; border-left: 1px solid"></div></td>

<td valign="top"><div id="divMenuListContainer"></div></td>

</tr></tbody></table>

</body>

</html>

Google Analytics

Google Analytics is a rich web app that allows website owners to get a huge range of statistics and reports on traffic.

How to Use Google Analytics with SharePoint 2010

http://mossseo.wordpress.com/2010/08/04/how-to-use-google-analytics-with-sharepoint-2010/

SPGoogleAnalytics - Google Analytics connector for SharePoint 2010

http://spgoogleanalytics.codeplex.com/

To Install on Android:-  https://play.google.com/store/apps/details?id=com.google.android.apps.giant&hl=en

Google-Analytics-Add-in-for-Microsoft-Excel/

:- http://download.cnet.com/Google-Analytics-Add-in-for-Microsoft-Excel/3055-20429_4-75452847.html?tag=pdl-redir

Excellent Analytics— free Google Analytics Addin for Microsoft Excel

http://download.cnet.com/Google-Analytics-Add-in-for-Microsoft-Excel/3055-20429_4-75452847.html?tag=pdl-redir

http://www.outfox.com/excellentanalytics/#ixzz37bv0JvVv