当前位置: 首页 > 文档资料 > tinyMCE 帮助文档 >

Paste from Word

优质
小牛编辑
122浏览
2023-12-01

Improve your productivity & writing experience

TinyMCE PowerPaste automatically cleans up content from Microsoft Word and other HTML sources to ensure clean, compliant content that matches the look and feel of your site or app.

TinyMCE PowerPaste is a Premium Plugin from TinyMCE. We have flexible purchase options: as a stand-alone plugin, to OEM and custom enterprise pricing.

Customers: we have full documentation explaining how to install and configure TinyMCE PowerPaste. Go to the docs.

Example use cases

Content from Microsoft Word

If you paste content from Microsoft Word into your app, you probably know the published page usually doesn’t match the site’s style. Fonts can be different, images missing and formatting not the same as their original document.

This can be time consuming for users to fix, and usually involves manually editing HTML. It can also increase support requests.

TinyMCE PowerPaste automatically “cleans” pasted content, fixing these issues. It can also automatically upload images to a server, helping you spend time on more productive tasks.

Content from Microsoft Excel

TinyMCE PowerPaste also makes light work of pasting Excel content into your app, automatically creating HTML compliant tables in the process.

While developers are very familiar writing HTML tables, most content creators literally don’t know where to start. And then there’s the issue of manually entering their Excel data into the table. This isn’t a fun experience either.

For users of both Word and Excel, PowerPaste will dramatically improve the content production experience you deliver to your clients.

Content from the internet

If you cut and paste content from the internet into your app – which includes almost everyone – PowerPaste also works its auto-magic.

Just as it cleans up rogue formatting from sources like Word, it does the same for internet content. Need to grab a quote from a website for your blog post? PowerPaste removes classes, minimizing the chance of unwanted CSS overriding your stylesheets.

It also does the same for images, automatically linking to the source image URL. Perfect content, every time.

Buy TinyMCE PowerPaste

Start with our dedicated product page to see our flexible pricing options. OEM and enterprise customers should contact sales directly. Still not sure? Check out the demo below.

PowerPaste demo

TinyMCE HTML JS Edit on CodePen

<textarea id="paste-from-word">
  <h2>
    <span class="span">
        <img src="//www.tiny.cloud/images/glyph-tinymce@2x.png" alt="TinyMCE Logo" width="110" height="97" style="float: right">
    </span>
    <span style="color: #828282; font-size: 35px; font-family: avenir; font-weight: 200;">TinyMCE demo: PowerPaste plugin!</span>
</h2>
<p style="color: #7e7e7e; font-size: 15px; font-family: avenir;font-weight: 500;">PREMIUM PLUGIN: The TinyMCE  <a  href="https://www.tiny.cloud/docs/enterprise/paste-from-word/">PowerPaste plugin</a> automatically cleans up and transfers content & images from Microsoft Word and HTML sources to ensure clean, compliant content that matches the look and feel of the site.</p>
  
<p style="color: #7e7e7e; font-size: 15px; font-family: avenir;font-weight: 500;">COPY AND PASTE FROM WORD or EXCEL</p>
<ol style="color: #7e7e7e; font-size: 14px; font-family: avenir;font-weight: 500;">
<li>Copy and paste content from MS Word or Excel into this editor.</li>
<li>Choose Remove Formatting (remove inline styles) or Keep Formatting (keep inline styles)</li>
</ol>
<p style="color: #7e7e7e; font-size: 15px; font-family: avenir;font-weight: 500;">COPY AND PASTE FROM WEBSITE OR HTML SOURCES</p>
<ol style="color: #7e7e7e; font-size: 14px; font-family: avenir;font-weight: 500;">
<li>Copy and paste content from website content into this editor.</li>
<li>Choose Remove Formatting (remove inline styles) or Keep Formatting (keep inline styles)</li>
</ol>
<p style="color: #7e7e7e; font-size: 15px; font-family: avenir;font-weight: 500;">DRAG AND DROP IMAGE</p>
<ol style="color: #7e7e7e; font-size: 14px; font-family: avenir;font-weight: 500;">
<li>Drag a local image into this editor.</li>
</ol>
  <p>---------------------------------------------------------------------</p>
  <h2 style="color: #7e7e7e; font-size: 20px; font-family: avenir;font-weight: 500;">Got questions or need help?</h2>

  <ul style="color: #7e7e7e; font-size: 14px; font-family: avenir;font-weight: 500;">
    <li>Our <a href="https://www.tiny.cloud/docs/">documentation</a> is a great resource for learning how to configure TinyMCE.</li>
    <li>Have a specific question? Visit the <a href="https://community.tinymce.com" target="_blank">Community Forum</a>.</li>
    <li>We also offer enterprise grade support as part of <a href="https://www.tiny.cloud/pricing">TinyMCE Enterprise</a>.</li>
  </ul>

  <p style="color: #7e7e7e; font-size: 14px; font-family: avenir;font-weight: 500;">
    Thanks for supporting TinyMCE! We hope it helps you and your users create great content.<br>All the best from the TinyMCE team.
  </p>
</textarea>
tinymce.init({
  selector: 'textarea#paste-from-word',
  height: 400,
  menubar: true,
  plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks advcode fullscreen',
    'insertdatetime media table contextmenu powerpaste'
  ],
  toolbar: 'undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image code',
  powerpaste_allow_local_images: true,
  powerpaste_word_import: 'prompt',
  powerpaste_html_import: 'prompt',
  content_css: [
    '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i',
    '//www.tiny.cloud/css/codepen.min.css'
  ]
});