Normal desk top wordprocessing programs add stuff when you copy text out of them.  Things like formatting rule, fonts and colours.

We always advise that you add your content by typing it directly into the editor window, however we have two work around’s so that your text doesn’t get messed up with additional code.

The first method is simple – copy the text from Word or your word processor, then paste in to Notepad (you can find this on all versions of windows) then copy the text out of Notepad and past it into the Website editor screen.

The second method is even easier, copy your text from Word, then in the website editor click the button that looks like this text if you can’t see it, click the button that looks like this advanced first and the text button will appear.  Click the Text button and a window will appear, past your text in the new window and click the insert button.

Hey presto whatever method you use, you’ve got clean text that will remain the same across all your website.

Resize1There are a number of ways to resize an image on your website, one of these will hopefully help.

Option number 1 -  The handles on the image.  The image on the right shows how this works.  First click the image and 8 white squares and border appear round the image.

Click on any on of these and keep the mouse button held down.  Move your mouse and the image will become transparent and start to scale up and down.  The corner squares will allow you to scale keeping the aspect ratio the same.  Whilst the square on the sides will squash or stretch the image.

Option number 2Resize2the image on the right explains this one.

Click the image and you will see two icons appear in the top left of the image.  One is a landscape icon.  Click this and you will be returned to the screen that looks like the insert screen from previous lessons.

However this time you will see a resize area above the buttons for links etc.  Using the slide on the left hand side you can re-size the image in terms of percentage.

It’s important to understand this about images and sizes.  When you upload and image, the software produces automatically at least 3 versions of the image.  A small thumbnail, a medium image and a large image.  It does this so you don’t need to be inserting massive images and re-sizing them to fit.  However it does come with a pay off.  You can’t enlarge all images you can only make them smaller.  In other words if you decide the thumbnail you inserted isn’t big enough, delete it from the page, click the upload/insert button select the image again and it insert it at a larger size and then resize it a little then.  Making small images bigger will lead to a loss in quality – like the image below.

Resize2

camera2One of the questions I get asked the most is – how do I add images.  But before I answer this question on the site he’s a few tips.

  • There is no need to upload images that are bigger than 800px wide and max resolution of 72dpi.  If you do upload bigger image they will only slow down your site and explode far too big if someone clicks them to view a bigger version (more about that later).  Plus you website should try and restrict you uploading images less than 2mb
    Most digital cameras come with software to edit and resize images – if you’ve lost yours try this free piece of software – remember we have used all these pieces of software but download and usage is at your own risk.
  • Few images are free on the internet – so if you want some really cheap images that look great then go here to Dreamstime.  We use them for most of our magazine work.
  • In general animated images (in our opinion) although sometimes interesting aren’t very professional.

Other than that images add interest, colour and context to your page – although Google and search engines don’t see images so they don’t do much for your ranking, as they aren’t words.

UploadOK? Then let’s add some images to your page.

First click at the beginning of the line of text where you would like to insert the image. Or if you want to insert images in a blank space then simply click the page anywhere.

Remember though – images can’t just be postioned in the middle of a page like you can in MS Word or in a paint package.  The software looks friendly but it is a website application and on the web we have to do things a certain way.  If you need to know more please call us.

So, click the button just above the Bold, Italic, Underline bit on your editing bar.

It looks a lot like the button on the left the first one after the words – Upload/Insert

Next you will a box will appear asking for you to select a file to upload.

  • Click the select button and navigate to where the image is stored on your computer.
  • Click the ‘open’ button.
  • The Software will then upload and crunch the image (this just means optimise)
  • Next you will have a new screen unfold before your eyes – the main bit you need to look at is like the image below.

Insert-Image2

Ok this is easier than it looks.

  • First select if you want the image to align left, right or in the centre.  If you align left or right your text will flow around the image.
  • Now choose the size you want to insert the image, choose the option you think best suit the job.  You can always change the size later.
  • Lastly you need to decide if you want to provide the reader with the option to click the image to show a bigger version.  Click the camera at the top of the page and you’ll notice it will zoom out top show a bigger version.  If you want this to happen then click the option that says file-url this will link your smaller image to the larger original one when, when the reader click the image – hey presto a bigger picture.
  • If you don’t want the picture to link to anything leave the Link URL box it empty – or click non.
  • Lastly click ‘Insert in to Post’.  you’ll notice another option next to insert into post ‘Delete’ this will delete the image from your site – simple!

We cover image resizing in another post – so feel free to take a look.

Ok so you’ve made it this far and nothing’s blown up!  :-)

Edit-Pages1Your website should have some pages set up already ready for you to edit. They may contain something that looks a lot like latin – don’t worry we can delete that.

Hover your mouse over the page you would like to edit – you will see a number of options.  Edit, Quick Edit, Delete and View

  • Edit – yeh you got it this is the button to edit the content of your page.
  • Quick Edit – allows you to do a number of things quickly, such as change the page order.
  • Delete – hmm deletes the page, but don’t worry it will ask you to confirm if you really want to delete the page should you accidentally click it.
  • View – allows you to view the page.  The easiest way to use this feature is to right click it and open the page in a new tab.  This means you have the web pages to view on one tab and the editor on another tab.

Having your browser set up like this means you can flick backward and forward quickly and easily from editing view to the front end.  Incidently – browsers! WN6 Creative prefer Firefox for lots of reasons so if you do fancy a change later go here and download it – it’s free so you’ve nothing to loose.

Anyway back to editing the page.  Click the edit button on the page you wish to edit.

BANG!

edit-pages-2Sorry! You should now see a page that looks something like the one.  Looks like an ordinary text editor such as MS Word (Yuk) or Open Office (Hurrah more great free & legal software that works a treat)

features such as Bold, Italic, Underline, Bullet Lists, Number Lists, Left Align, Centre and Right Align all on the top bar.

Now delete all the latin looking text and start to type your first piece of content.

Update-PageOnce you have finished the content your typing click the Update Page Button  you’ll find that on the furthest right hand side  of the editing screen.  If you can’t see it, click the PUBLISH tab and some more options should appear a lot like the image on the right.

Great stuff you have now edited content on a page.  You can do this for any of the pages you wish or create a new one if you like.

Remember your website has been set up with a style sheet so the font, font colour and sizes are controlled automatically for you so really you should only need to use bold and italic if you want something to stand out.  Keeping a consistent look is an essential part of keeping your site looking smart and professional.

HOWEVER!  Some people may wish to change the colour a little – the easy way to do this is first – click a button that looks likeEditing-options this, it’s on the far right hand side of the formating bar (the one that starts with the B for Bold. Hey presto, another editing bar appears. Like the one below.

editing-bar

Ok, this is where you could get yourself in a muddle.  But with care you should be fine.  To change the colour of any words, you will first need to highlight the words you want to change and then go to the button next to the smilie face – the one that looks like an A with a line under it and a drop down arrow connected to the button.  Click this

More-coloursYou’ll be presented with a set of colours and a button that says ‘more colors’

Go on choose one or have a play with the more colors option – it looks something like the one on the right.Pallette

Your text can now be changed to whatever colour you wish!

And yes if you click the smilie face button you can add….. :lol:   smilie faces, should you wish to cheer your reader up?

On the subject of inserting smilie faces – you will notice when you insert one it will be displayed in your editor as :lol or something similar, don’t worry the software will insert the appropriate smilie accordingly.

Ok who’s for adding images?

So you’ve made it behind the scenes of your new website.  Don’t worry it’s easier than it looks.

dashboardThe first screen you’ll see is the Dashboard – which looks similar to the image on the right

The Dashboard screen is where you will in time find lots of other links and features that have been built into your site.  These features are things you may decide Pagesyou’d like to integrate in the future.  But for now let’s get on with adding content to your website.

To add content to your website the primary area you need to be concerned with is the button labeled – PAGES

Click it! And remember the website has been set up so that it’s almost impossible to break – so don’t worry!

If you get in to trouble or your confused get in touch – we’re always happy to help.

Next Page →

WN6 Creative - invest a little gain a lot!