Grabbing content from your existing website

Why do this?

If you are doing a major revision of your website – converting to a responsive design for mobiles would be a good example – you may want to take ‘copy’ from your existing website and rework it before it goes into the new layout.

The assumption here is that you are going to paste it into a Microsoft Word document based on your own web content template. See Using Word for content management – practicalities if you want more information about Word templates.

Grabbing text

Selecting text

If you open the page of interest in a browser, triple-clicking on a block of text will select the whole block. This can be faster than placing the cursor at the start of a text block and dragging over it. If you are selecting great chunks, then click and drag is better.

Copying text

You probably know this already: to copy the text, press Ctrl-C or ⌘-C on the keyboard or right-click in the selected area and select Copy from the context menu.

Clever text pasting

If you paste into Word using the default settings, it will attempt to retain the formatting of the website and this is probably not what’s wanted.

So the best approach is to right-click at the insert point in the Word document and you will be presented with a set of paste options (if the options don’t appear, then it’s likely you copied plain text or an image from somewhere so rich text pasting does not apply).

The options are:

  • default – attempt to retain the formatting from the website
  • merge formatting – keep some of the formatting from the website but not all
  • plain text – ignore all formatting and just put in the text

Just click on the appropriate icon to paste your text – the third option ‘plain text’ is recommended.

Reformatting tricks

Changing case

On a website, text can be transformed to upper case or lower case through the use of style directives, so you should always use mixed casing when preparing content.

In Word you can use the Shift-F3 (function key 3) button to change the case of a block of selected text between lower-case, upper-case and proper-case (the first letter of each word is capitalised). An example of this is shown in the Latin text below:

Start Lorem IPSUM dolor est.
Shift-F3 lorem ipsum dolor est.
Shift-F3 Lorem Ipsum Dolor Est.

Note that you never get back to the original style with Shift-F3. You’d have to do an undo (Ctrl-Z or ⌘-Z) one or more times to revert to the original.

Keyboard shortcuts

It can be a nuisance to have to use the mouse to select commands so here are some of the more common shortcuts.

You can modify selected text by pressing and holding the control key (⌘ key on a Mac) and pressing one of the letters shown in the table below. Pressing the key again reverses the operation.

PC Mac Style
Ctrl-B ⌘-B Bold
Ctrl-I ⌘-I Italic
Ctrl-U ⌘-U Underline – only use it to remove an underline because underlines can be confused with links
Home Go to the beginning of the current line
End Go to the end of the current line
Ctrl-End ⌘-↖ Go to the end of the document
Ctrl-Home ⌘-↘ Go to the beginning of the document

Grabbing images

Right-clicking on an image in a browser brings up a context menu allowing you to copy or save a picture. You can just paste a copied image straight into Word but it will lose its filename. Internally Word will call it Image1, Image2, etc. Sometimes it can use Picture1, Picture2 for no special reason we can think of.

Anyway, a better method is to save the image to a file manually and, should you want to, you can rename it during the save.

Once that’s done, go to Word’s Insert tab at the top of the screen and select Picture from there. This method means that Word will retain the ‘proper’ filename of your choice.

Copying content from third-party websites

Images and text can be taken from a third-party website subject to its copyright restrictions. These are some of the kinds of sites from which you may want to copy:

  • organisations of which you are a member
  • charities that you support

In each case check to see if there is a design guide or restrictions on use.

The main caveat is that the style of images and text may be at variance from yours and you may be limited as to how you can change assets to match your style.

Always check copyright notices for the detail of what you legally can and cannot copy.

Social media

Social media sites like Twitter and Facebook usually have copious pages of help on how to link to them so there is no particular need to copy assets from them. Just use the tools they provide and the link images on your website will always be up to date.