List View Web part in Cross Site SharePoint 2013

List View Web part in different Site

 In SharePoint there is no technique of showing a list view web part in another site whether it is parent or sub or different site. It can only be shown in current site only until and unless you are using SharePoint Designer.

So here is some CSS and ECMA script tricks, through which we can hijack SharePoint and make a Cross Site List View web part and use it anywhere.

Here are steps for this:

1     First go to your document Library and edit the page. Open Developer Tool and try to find out your Document Library. You can search for “allowexport” and check if it belongs to your document Library. Set it to true.

Note : There should not be grouping in the current view while exporting the List View web part.

2     When you will set it to true, you will get an option of exporting the List View web part. Click on Export and Save the web part.

3       The next step is to get the current web ID .Go to the current site where your library is present and a test page. Now add a script editor web part and paste the below code:

<input onclick="javascript:init();" type="button" value="GetWebID"/>

<SharePoint:ScriptLink ID="ScriptLink1" Name="sp.js" runat="server" OnDemand="true" Localizable="false" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script type="text/ecmascript">

function init()        {

            var context = new SP.ClientContext.get_current();

            this.Web = context.get_web();

            context.load(this.Web);

            context.executeQueryAsync(Function.createDelegate(this, this.onSuccess),

                Function.createDelegate(this, this.onFail));

        }

        function onSuccess(sender, args)        {          console.log(this.Web.get_id());        }

        function onFail(sender, args) {      console.log('Failed:' + args.get_message());

        }</script>

Save the page. Now open the developer tool and click on button “GetWebID”. This will give you web ID in console log. Copy It.

4      Now edit the web part file in Notepad/Notepad++.  Search for “WebId” and paste the web id we got in step 3. Save the file.

5        Upload it to the web part gallery and add it to any sub site.

 Let me know how it goes.