In Sharepoint you can use <WebPartPages:AllowFraming runat="server" /> to disable the SAMEORIGIN for X-FRAME-OPTION giving you the opportunity to call your page from an iframe (see this other article).

However you cannot use the same trick to preview a file into the browser with WopiFrame.aspx. But there is a way to do it, using the parameters into the URL.

You need to replace action=default with action=embedview, AND you need to call WopiFrame2.aspx instead of WopiFrame.aspx (which will lead to a Something Went Wrong - Sorry, you don't have access to this page).

So the URL to use for your iframe will be:https://my.company.com/sharepoint/_layouts/15/WopiFrame2.aspx?sourcedoc=/files/Demo.docx&action=embedview

Sometimes you want to modify the options for a dropdown box by removing some existing options, however you want to be able to keep these old values for reporting or whatever reasons.

Below is a way to do it by using jQuery and SharepointPlus. It will hide the “Specify your own value” stuff, and add the old value (if any) into the dropdown selection.

For example if you have a Choice field with options “A”, “B”, “C”. Your item ID #1 has value “B”.
After a while you decide to delete “B” and add “D”, but you want to be able to find items with the “B” value.
So you choose “Choice with Fill-In” and apply the below code:

// For flexibility reasons we create them as a Choice with Fill-In option,
// however we hide the free text field and we show only the dropdown
// in case of the fill-in has a value, then we add it into the list of options
$SP().formfields("My Field"]).each(function() {
var $e = this.elem();
// hide all except the dropdown
//$e.not('select').hide().filter(':radio:last').closest('tr').hide(); // SP2010
$e.eq(0).closest('table').find('tr:gt(0)').hide(); // SP2013
// if we have a value into the fill-in box, then:
// - add it into the options
// - when another value is selected we check the first checkbox
var fillValue = $e.last().val();
if (fillValue) {
$e.filter('select').append('<option data-fillin="true">'+fillValue+'</option>').each(function() {
var $this=$(this);
$this.find('option:last').prop("selected", true);
$this.removeAttr("onclick").on('change', function(event) {
var $opt = $(this).find(':selected');
if ($opt.data("fillin")) {
$e.filter(':radio:last').prop("checked", true);
} else {
$e.filter(':radio:first').prop("checked", true);
}
});
});
}
})

So now, if you create a new item you’ll see a dropdown with “A”, “C”, and “D” only.
But if you edit your item #1, you’ll have a dropdown with “A”, “C”, “D” and “B”.

This article has been VERY useful. But I wanted something lightly different: I wanted to add a custom action, but also have the “EDIT” button (but not the “SHARE”), and to use the current item info for my custom action.