How can I resize the size of the Excel web part?

Question

_{Monday, July 28, 2014 6:58 PM}

I have a spreadsheet that i want to use to populate a page in my SharePoint site.  i copied the workbook to the site, created the page and added the excel web part. then i linked the workbook to the web part and submitted.  it displays but only about 25% of the sheet shows. i dont want to use the thumbs to scroll inside the web part. i want the web part sized to show the entire spreadsheet.  cant seem to find how to size the web part. Can some kind soul help me out here.

thanks

All replies (8)

_{Monday, July 28, 2014 7:53 PM ✅Answered}

Hello,

If you open the web part settings panel by clicking "Edit Web Part", in the "Appearance" section you can choose to specify the web part's height and width instead of having it adjust to fit the zone.

_{Tuesday, July 29, 2014 7:08 AM}

Hi,

According to your post, my understanding is that you wanted to resize the size of the Excel web part.

Per my knowleadge, most of the time excel web parts turn out ugly, due to the fact that they’re rendered in an iframe and therefore the browser doesn’t resize the container to fit the content.

As a workaround, we can edit the page where you want the resizing to happen, add in a content editor web part, and paste the following code into the source editor.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () { // resizes excel webparts
    $("td[id^='MSOZoneCell_WebPart']").each (function (i, e) {
        var findIframe = $(e).find ("iframe:first");
        if (findIframe &amp;&amp; findIframe.attr ("scriptforiframecontent"))
            bindEwaLoaded ("#"+e.id);
    });
});
 
function bindEwaLoaded(obj) { // bind event to the web part
    $(obj).bind ("ewaLoaded", function (e) {
        var b = $(e.target).find ("iframe:first").attr ("postedbackalready");
        if (b == undefined) // loop until iframe is ready
            setTimeout (function() { $(e.target).trigger ("ewaLoaded"); }, 1000);
        else // try to resize now
            ewaSetSize (e.target);
    }).trigger ("ewaLoaded"); // first trigger now
}
 
function ewaSetSize(obj) { // resize elements
    // configure paddings
    var excelObjectWidthPadding = 50;
    var excelObjectHeightPadding = 50.
    var w, h, div1, div2;
    var e = $(obj).find ("iframe:first").contents().find ("table.ewrnav-invisibletable-nopadding:last");
    if (e.length != 0) { // excel table
        w = e.width ();
        h = e.height ();
        div1 = $(obj).find ("table:first> tbody:first> tr:eq(1)> td> div> div");
        div2 = $(div1).find ("table:first> tbody:first> tr:eq(1)> td> div");
    } else {
        e = $(obj).find ("iframe:first").contents().find ("div.ewrchart-img-div");
        if (e.length != 0) { // excel chart
            w = e.width ();
            h = e.height ();
            div1 = $(obj).find ("table:first> tbody:first> tr:eq(0)> td> div> div");
            div2 = $(div1).find ("table:first> tbody:first> tr:eq(1)> td> div");
        }
    }
 
    if (w == 0 || w == undefined) { // loop until content is ready
        setTimeout (function() { ewaSetSize (obj); }, 1000);
    } else { // do resize
        w += excelObjectWidthPadding;
        h += excelObjectHeightPadding;
        div1.width (w);
        div2.height (h);
    }
}
</script>

For more information:

Automatically resizing Sharepoint Excel Web Parts

JQuery for Everyone: Dynamically Sizing Excel Web Parts

Dynamically re-sizing excel services webparts

Thanks,

Jason

Jason Guo
TechNet Community Support

_{Tuesday, July 29, 2014 4:05 PM}

I didn't have much luck with Jason's jQuery but was inspired to try doing something similar with native JavaScript and CSS. Here's what I came up with:

This script will allow Excel Web Access web parts as much height as they want, but limits their width to the web part zone's boundary as normal:

<script>
var ewa_wps = document.querySelectorAll(".ewa-webpartroot");
for(var i = 0; i < ewa_wps.length; i++){
    ewa_wps[i].parentElement.removeAttribute("class");
    ewa_wps[i].parentElement.style.height = null;
}
</script>

This script will resize Excel Web Access web parts to make them more-or-less fit within the boundaries of the browser window at the time the page is loaded:

<script>
var ewa_wps = document.querySelectorAll(".ewa-webpartroot");
var ewaheight = document.documentElement.clientHeight - document.getElementById("s4-bodyContainer").clientHeight - document.getElementById("s4-ribbonrow").scrollHeight - 50;
for(var i = 0; i < ewa_wps.length; i++){
    ewa_wps[i].parentElement.removeAttribute("class");
    ewa_wps[i].parentElement.style.height = "" + ewaheight + "px";
}
</script>

(That's assuming you don't have a wildly different masterpage/css setup.)

Either script should be added to a Content Editor web part via the content link property (the actual script should be a text file uploaded to a library on the site). The Content Editor web part should be placed below the Excel Web Access web parts on the page.

_{Tuesday, July 29, 2014 6:52 PM}

Thanks so much!  This is exactly what I wanted, simple and effective.  Now if I can just figure out my refresh problem I can release this to the business!

_{Wednesday, October 15, 2014 5:50 PM}

Hello,

Can you provide me the steps to fix this issue.

I have followed the the steps and added the content editor with the script (from a text file). However, the scroll bars are still appearing and resize is not happening.

I am using SharePoint 2013 with Excel 2013.

Regards

Selva



_{Wednesday, October 21, 2015 2:38 PM}

Hi,

I am also looking for a solution for SharePoint 2013, as the different options above do not work for me either.

Kind regards,

Muz

_{Tuesday, June 14, 2016 6:09 PM}

I am using SharePoint 2013 with Excel 2013.

I am also looking for a solution for SharePoint 2013, as the different options above do not work for me either.

I recommend searching for or posting a new question in the SharePoint 2013 forum.

_{Thursday, March 23, 2017 2:57 AM}

Auto height is not usable on EWA web part, 

it will be replaced by 400 pixels after saved.