Category Archives: Using your Wordpress website

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

Your website should have some pages and or posts set up already ready for you to edit.

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.
• Trash – 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.  If you really mess up and want the content back you can restore it from the Trash quickly and easily
• View – allows you to view the page.

The easiest way to use this feature is to right click the View link and open the page in a new tab.  This means you have the front end (customer facing view) on one tab and the editor/admin area on the original 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 – on the subject of browsers! WN6 Creative Design 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!

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.

Type or edit the content in the main editor box.  Once 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 and there’s an easy way to do this is first – click a button that looks like this (it’s on the far right hand side of the formatting bar (the one that starts with the B for Bold.)  Hey presto, another editing bar appears. Like the one below.

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

You’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.

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

And yes if you click the smilie face button you can add…..   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?

One 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 a 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 your 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 or use images for ranking (yet!) they do add so much value to the page.

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 contact us and we can explain further.

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 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.

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 this will link your smaller image to the larger original one 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 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 – click here

All the WN6 Creative Design Creative WordPress tutorials here are provided free of charge – if you would like to make a contribution towards the development of more, and to ensure the tutorials stay free of a massive amount of advertisements why not make a small donation towards the cost of development.  Click here

[ad code=1 align=center]

There 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 2 - the image on the left 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.