Category: Using Word to HTML

If you would like to check English grammar and spelling in the Visual Editor we recommend adding the free Grammarly extension to your browser of choice.

Once you add the Grammarly extension you will see it in Visual Editor like this:

Today’s issue with photos taken by mobile phones or cameras is that their file size is too large if you plan to use them on web pages or in emails.

We’ve added a feature to quickly resize uploaded or pasted images. Also, you can resize already uploaded images.

Word to HTML will detect if an uploaded or pasted image is too big and automatically allow you to make the image file size smaller.

You can see the resolution and file size of the original and resized image. Big photos taken by mobile phones or cameras that are a few megabytes will load much slower than smaller images.

It’s up to you to decide how big an image you want to show on your website or email. Just drag the size slider. By default, Word to HTML will set the % size slider value based on your browser width.

If you upload a big image and you will increase the image size slider too much, your image will go outside of browser width – it will just not fit into the browser window and a web page. If you’re uploading a JPEG image, you can change the quality of it too. The lower quality value will make the file size smaller, but photo quality will also decrease.

We recommend using 60-70 quality photos, but it’s up to you to decide if you want to decrease the quality. Once you are OK with your image size, click the blue ‘Insert Resized Image’ button to upload that image. You can always upload the original image, but we do not recommend this.

If you’re uploading an image that is not a JPEG format (PNG, GIF, WEBP etc.) you will see a switch that will allow you to change the format to JPEG. We recommend running it on to make your image file size smaller, but only if your image has no transparent areas. If your image has transparency, then you will see it in back color if you switch to JPEG mode.

 

 

You can make existing images smaller by clicking it in Visual Editor and then clicking the following icon:

Now select your image size in % and optional quality and click the blue ‘Insert Resized Image’ button:

 

To do this click the drop-down arrow to the right of the Save button, then select the share option.

In the new window, you can select the team members that can access the document. You can also choose if they have the ability to overwrite the document, if you keep this unticked they will have to save the document as a new file in their own storage.

If your HTML has the same span tags in a row like in the code sample below and you would like to have just one span tag then you can use custom JavaScript code that will fix your HTML.

<p>
   <span lang="en">This is span</span> <span lang="en">This is span 2</span>
</p>
<p>
   <span style="font-size: 12px">This is span</span>
   <span style="font-size: 12px">This is span 2</span>
   <span style="font-size: 12px">This is span 3</span>
</p>

Please try the following custom JavaScript code that will process your HTML span tags:

var htmlLength = 0;
while (htmlLength != html.length )
{
   htmlLength = html.length;
   html = html.replace(/(<span[^<>]*>)([\s\S]*?)(<\/span>)(\s*)\1([\s\S]*?)\3/gi, "$1$2$4$5$3");
}

Just copy and paste it into Custom JavaScript editor and click Cleanup HTML green button under HTML editor.

After you click Cleanup HTML button all the same span tags will be merged into one <span..> tag like below:

<p>
   <span lang="en">This is span This is span 2</span>
</p> 
<p>
   <span style="font-size: 12px">This is span This is span 2 This is span 3</span>
</p>

We have a settings screen to let you easily style your tables. To use it all you have to do is click anywhere in your table. On the floating menu that comes up click the brush icon.

On the table styling screen, you can control all aspects of the table style like color, font, padding, border and table height and width.

 

 

If you’re using Chrome browser you can paste content as plain text please right click with mouse in Visual Editor and click ‘Paste as plain text’ option:

If you’re using other browser then you can paste your content into empty HTML Editor which will show text instead of HTML and then select all that text in HTML Editor and then copy it back to clipboard and paste it into Visual Editor.

 

To create an HTML email signature fast you can use our built-in templates.

Templates are the easy way for you to create the text you need fast. This feature is only for PRO users.

All you have to do is click the insert template icon from the menu:

Then select your template:

Once you have selected the template you can edit the content in the Visual Editor:

Replace the placeholder picture with your own in jpg or png format. We do not recommend embedding images or using SVG format because some email clients do not support it.

If you want to add more icons to your signature (like the social media links) we recommend you use icons from Icons site or you can download PNG icons from Icon Finder and upload it to our website.

Once you have created your signature you can then copy and paste it into your email application:

You can use Word To HTML to create descriptions for Amazon seller listings.

Amazon restricts the code you can use for listings so we have created a simplified version of the Visual Editor that will create code that is Amazon compatible.

To get started all you need to do is click the ‘Amazon Editor mode’ link above the Visual Editor:

 

You will notice that the toolbar icons switch to simplified controls:

 

Amazon has a limit of 2000 characters for the description field, our system will warn you if your text is over 2000 characters. We also have a character count tool in the bottom right of the Visual Editor that will help you keep track but be aware you might see different numbers in the count vs our warning message. The issue is Amazon counts every HTML character not just the text, so for example, if you add a new line with just one character in it eg <p>X</p> this is actually 8 HTML characters.

 

Once you have edited the text, copy the HTML from the HTML Editor box and paste it into the Amazon listing display field.

The Word to HTML Visual Editor is able to customize CSS styles for specific HTML tags and allows you to add your own CSS classes that can be used to format your content.

You can add/paste custom CSS from your website if you want to style the content the same way as on your website.

In order to add your custom CSS you have to go to the Settings page:

h1 { color: blue }
p { padding: 20px 0 }
.redBoldStyle { color: red; font-weight: bold }

This is how you can have custom styles for tags in your Visual Editor content. In the example above you can set a blue color to all <h1> tags, custom padding for all <p> tags and add a custom class style called ‘redBoldStyle’ that styles are then available for your use under the Formats menu in Old editor or under icon shown below for the New Editor.

To apply the style in New Editor please select your content and click the Paragraph Style icon, and then click the style you want to apply.

To apply the style in Old Editor please select your content and click the Formats menu, and then click the style you want to apply.

Visual Editor will add the class to your selected content:

To create sub lists under Visual Editor you have to follow these steps.

1. Create a list by entering first list item:
   
2. Then once you want to create a sub list please hit Enter to create new empty list item and click Increase Indent icon:
   
3. Visual Editor will create a new sub list item (1), optionally you can change list type by clicking list type icon (2):
   
4. If you want to end that sub list, then just create new sub list item and click Decrease Indent icon:
   
5. Now you can enter new items for your top list:
   

If you want to change sub list type, just click at the first item on your sub list to place editor cursor (1) there and click either numbered (2) or not list type icons:

Clicking Lower Roman will change list type like this: