Wednesday 29 November 2017

Hide Social Media share button in Power BI embed code

Recently I was having a task for creating Power BI chart and embedding it in SharePoint. So It is easily available in google. But the tricky part is when you embed it in SharePoint as iframe, it will show share button at bottom of it. Our client do not want that.

Here is the bottom of iframe:








So what is solution:

We add a new div tag and append our iframe within that with little css touch. Below is code for same:

Code sample:

<style>
.iframebox{width:100%; float:left;position:relative; overflow:hidden}
.iframefooter{
    width: calc(100% - 40px);
background: #eaeaea; 
    /*background: #eaeaea;*/
    height: 31px;
    display: block;
    position: absolute;
    bottom: 5px;
    right:40px;
     z-index: 9999999999;
}
.blueborder{
    position: absolute;
    left: 0;
    bottom: 41px;
    height: 1px;
    background: rgb(36, 65, 153);
    z-index: 999999999999999999;
    width: 100%;
}
.ms-dlgContent {z-index: 99999999999 !important;}
</style>


<div class="iframebox">
<!--   Iframe code goes here -->
   <div class="blueborder">&nbsp;</div>
   <div class="iframefooter">
      <br>
      <br>
   <br></div>
</div>

Output:








Happy coding.