私のエンタープライズWikiサイトのために、リッチテキストエディタの中に写真を貼り付ける方法はありますか?
質問
Enterprise Wikiテンプレートを使用してパブリッシングサイトコレクションを持っています。現在、テキストとイメージを含む単語文書を持っていて、すべてのWord文書コンテンツをコピーした後、リッチテキストエディタ内のコンテンツを貼り付けてから、テキストのみがコピーされます(イメージがない)。
だから私の質問リッチテキストエディタの中に写真を貼り付ける方法がある場合は?
ありがとう
解決
画像をSharePointページに直接貼り付けることはできません。貼り付けられないように画像をレンダリングできません。
画像をSharePointにアップロードする必要があり、その後、必要なページ/場所に挿入する必要があります。
またはこれにはサードパーティ製のツールを試すことができます。
http://www.kwizcom.com/harepoint.-add-ons / sharepoint-clipboard-manager /概要/
または
他のヒント
Base64エンコード画像を編集可能なコンテンツに貼り付ける機能を利用できます。しかし、SharePointの編集者がBase64のイメージをストリップして以来、汚れたトリックを使用して、画像の内容を隠されていない隠しプレースホルダーに保存し、その後ページ負荷時のこれらのプレースホルダーから画像をレンダリングします。
このソリューションのプロセス(その使いやすい)と短所(大きなインライン画像、画像を1つずつ貼り付け、追加のJSイベントなど)を追加します。
では、このJavaScript(マスターページなどに埋め込みコードとして挿入)してください(SharePoint 2013 Enterprise Wikiでテスト済み)は、(SharePoint 2013 Enterprise Wikiでテスト済みですが、コード調整を使用したSharePointコンテンツ編集フォームでは動作する必要があります)。編集者DIVのIDを最初に設定する必要があります。
<script type='text/javascript'>
//set your editable content (editor) client id here:
var editorClientId = "ctl00_PlaceHolderMain_PageContent_RichHtmlField_displayContent"
_spBodyOnLoadFunctionNames.push("renderImages()");
function getImagesByAlt(alt) {
var allImages = document.getElementsByTagName("img");
var images = [];
for (var i = 0, max = allImages.length; i < max; ++i)
if (allImages[i].alt == alt)
images.push(allImages[i]);
return images;
}
//if page is in edit mode, delay for other scripts to finish first
function renderImages() {
if (window.location.href.indexOf("ControlMode=Edit") > -1)
setTimeout(function () { renderImagesStart(); }, 1500);
else
renderImagesStart();
}
//apply data-imgrefs attribute to stripped image contents
function renderImagesStart() {
var allSpans = document.getElementsByClassName("imgrefs");
for (var i = 0, max = allSpans.length; i < max; i++) {
var img = getImagesByAlt(allSpans[i].title)[0];
if (img != null)
img.src = "data:image/gif;base64," + allSpans[i].getAttribute("data-imgref");
}
}
//chrome paste handler
var IMAGE_MIME_REGEX = /^image\/(p?jpeg|gif|png)$/i;
var loadImage = function (file) {
var reader = new FileReader();
reader.onload = function (e) {
var img = document.createElement('img');
img.src = e.target.result;
var range = window.getSelection().getRangeAt(0);
range.deleteContents();
range.insertNode(img);
};
reader.readAsDataURL(file);
};
document.onpaste = function (e) {
var items = e.clipboardData.items;
for (var i = 0; i < items.length; i++) {
if (IMAGE_MIME_REGEX.test(items[i].type)) {
loadImage(items[i].getAsFile());
return;
}
}
}
//if page is in edit mode apply onblur (leave editor) event to hide images base64 content to spans
//class name, data- and alt attributes are used because sharepoint doesn't strip them
if (window.location.href.indexOf("ControlMode=Edit") > -1)
document.getElementById(editorClientId).onblur = function () {
var editor = document.getElementById(editorClientId);
var childNodes = editor.childNodes;
//remove spans
for (var i = childNodes.length - 1; i >= 0; i--) {
var childNode = childNodes[i];
if (childNode.className == 'imgrefs')
childNode.parentNode.removeChild(childNode);
}
var imgs = editor.getElementsByTagName("img");
var id = 0;
//for each base64 image: hide its content to span data-imgref attribute and append span to editor
for (var i = 0, max = imgs.length; i < max; i++) {
var img = imgs[i];
if (img.src.indexOf("data:image") > -1) {
id += 1;
img.alt = id & 0xffff;
img.alt = 'img' + img.alt;
var src = img.src.replace('data:image/gif;base64,', '').replace('data:image/png;base64,', '').replace('data:image/jpg;base64,', '');
var span = document.createElement("span");
span.className = "imgrefs";
span.title = img.alt;
span.setAttribute("data-imgref", src);
span.innerText = '';
editor.appendChild(span);
}
}
}
</script>
.
さらに、SharePointのWebサービスを使用してサーバー上のファイルとして貼り付けられたBase64イメージをアップグレードすることができます。 copyintoItems 直接JavaScript(貼り付けまたは一部の保存イベント時)、次にBase64をサーバー上のイメージファイル名に置き換えます。
私は私がディスカッションボードリストエディタをコンピュータから少なくとも挿入>に使用し、テキスト内に埋め込まれた画像を操作するためにエディタツールを使用することができました。その後、そこから通常のSharePointリスト項目に富んだテキストフィールドにカットして貼り付けます。編集に使用したディスカッションリストの投稿を保存する必要さえありません。カットしてから貼り付けた後に投稿をキャンセルしてください。あなたがより洗練された画像操作(画像を回転させるような)を必要とするなら、あなたのディスカッションボードリストに電子メールを送ることができるならば、あなたのOutlookの電子メールエディタを使ってテキストとイメージを作成し、そのディスカッションボードリストに送信することができます。