TG Tips

Here are a few tips on using WordPress. This page assumes you have already signed up with an account and have been added as an author to the site. If you haven’t got this far yet, then look back here first.

If you’ve done all that boring stuff, then here’s how to get going with the fun stuff. They say a picture speaks a thousand words, so here are some screenshots to highlight the various features (note: your controls may differ to my screenshots in some ways, because I am the blog administrator and I get extra toys :-)).

Writing a post


A/A* – Click in one of these places to bring up a new editing window.
B – View all of your published and draft posts (see below).
C – The title of your masterpiece
D – Choice between the visual and HTML editor. I always use HTML; it may look less friendly, but I find it more reliable. Visual sometimes screws things up.
E – The various style tools (optional if using HTML).
F – Woe betide anyone who forgets the disclaimer. 😉
G – Some html for a picture (knowing the details is not essential – it is automatically generated by the add picture facility, below).
H – Insert a picture (see below).
I – Insert a video (see below).
J – Insert a poll (see below).
K – Choose some categories that apply to your post.
L – Save draft. Click to here to save your post (but not publish it), so that you can continue working on it later.
M – Preview. Click to see what the post will look like on the blog.
N – Trash the post. This isn’t final and the post should be recoverable (but don’t hold me to that…).
O – Visibilty. Usually you need do nothing here, but if you want to stick your post to the top of the blog, then click “edit”, choose “stick this post…”, and click “ok”. Use this for posts which require public engagement (e.g. polls) or for important announcements.

P – P is for publish. Congratulations! Click here to make your masterpiece visible to the world (you can still make changes to it later).

Some useful html

I’m no expert, as evidenced by my inability to get these grey horizontal lines to vanish, but here are a few basic “tags” that are worth knowing. Notice that most of them are enclosed by triangular brackets < >, and a forward slash character </ > is included to end a prior instructions.

<b>Bold text</b> Bold text
<i>Italic text</i> Italic text
<u>Underlined text</u> Underlined text
<del>Scratched text</del> Scratched text
Superscript<sup>text</sup> Superscripttext
Subscript<sub>text</sub> Subscripttext
<big>one size bigger</big> one size bigger
<small>one size smaller</small> one size smaller
<font color="red">Coloured text</font> Coloured text
<br> [Force a line break]
&nbsp; [Force a space character]
<ul><li>Unordered</li>
<li>List</li>
<li>Items</li></ul>
  • Unordered
  • List
  • Items
<ol type="1"><li>Numbered</li>
<li>List</li>
<li>Items</li></ol>
  1. Numbered
  2. List
  3. Items
<a href="https://tellygunge.wordpress.com">Link text</a> Link text
&lt;b&gt; <b>

The last item in the list shows you how to make <b> actually appear, should you want it to, rather then it being taken by the computer as an instruction for bold text. Ahhh, but then how did I get &lt;b&gt; to actually appear, rather than being taken as an instruction for <b> to appear? I’ll leave that one for you to work out.

Managing your posts

When writing a post, you don’t need to stay up all night to complete it in one sitting! Posts under construction can be saved as drafts and accessed for further editing at a later date.


A – All posts. Click this option on the lefthand bar to bring up the above screen.
BImportant: As blog administrator, I can see everybody’s posts on the list. Authors can only see their own.
C – “Draft” next to a post indicates that it hasn’t been published yet and does not appear on the blog.
D – “Sticky” indicates that a post is stuck to the top of the blog.
E – Hovering the mouse over a post title brings up four options. Clicking “quick edit” brings up a panel, which allows the basic properties of the post to be changed without going into the edit window.

If you have published a post, but then decide you aren’t happy with it and want to withdraw it from public view until you have edited it further, you can either revert to draft using the status menu on the right, or make it private by choosing the highlighted option on the left.
F – The speech bubble reveals the number of comments a post has. Click to read them.

Inserting images

To insert an image choose button H from above. This should bring up a popup box like the one below.

A – Upload an image from your computer to the blog (the current tab).
B – To insert an image hosted on another site.
C – To insert an image already uploaded to the blog (please use this if possible rather than upload a duplicate – space is finite).
D – Select files. Click to upload files from your computer. This should bring up a standard “open file” window. You can select one file or many. Once this is done, the box should become like the one below, showing the list of uploaded files.


A – Click here to insert one of the images into your posts. The box should expand to the view below.
OR
B – Click to save the images. You don’t need to upload them again (this is also true if you select A).


A – Edit image. Perform basic edits such as rotating and cropping on your image.
B – Title. This is will be displayed when someone hovers the mouse over the image.
C – Link URL. This sets what happens if someone clicks on the image. “None” means that nothing will happen. “File URL” will take the reader to a full-size version of the image, on its own. “Post URL” will take the reader to a version of the image in a blog window.
D – Alignment and size options. Usually, I choose “left” or “right”, together with “medium” if I want to embed the image amongst text, or “none” and “full size” if I want to place the image between paragraphs. If the image is wider than 640 pixels, then “full size” will be limited to this width to keep it inside the blog column.
E – Insert into Post. Will close the box and hopefully deliver the picture to your chosen place.
F – Delete. Please be good enough to delete images that you aren’t going to use. Note that this deletion is permanent – there isn’t a trash bin.

HTML for images

The img tag can be used to display images, either hosted on this site or from another site. The address contained in the src=" " must refer to an image (with an ending like .jpg,.png,.gif,.bmp etc). If it refers to a web page (.htm,.php etc), then it won’t work. You can get the address to an image by right-clicking and choosing “copy image link” (or words to that effect – depends on your browser), which will put the necessary text into the clipboard.

<img src="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg">

The size of the image can be changed by specifying the desired width and height. If you want the correct aspect ratio to be preserved, you will need to do the maths.

<src="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg" width="230" height="144">

<src="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg" width="640" height="401">

<src="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg" width="640" height="144">

The width of the blog column is 640 pixels; if the picture is larger than that then it will need to be scaled down or it might flood over the side.

Use title=" " to specify text that will appear when the reader floats their mouse over the image. The <a> tag can be used to link to the image when the reader clicks on it.

<a href="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg"><img src="https://tellygunge.files.wordpress.com/2011/08/fiona-bruce-3.jpg" title="Fiona Bruce"></a>

Inserting video

– YouTube videos

To embed a YouTube video, select and copy the address from your browser bar. This must be the address of the video on its own page (as opposed to on a channel page), it must be the full conventional address (not a shortened address for Twitter or an address for mobile phones), and it must include the http:// at the beginning.

This video address must then be incorporated into a “WordPress shortcode”. Click on I on the editing window to create the shortcode, or simply use the template below. It amounts to preceding the address by YouTube and encapsulating the entire thing in square brackets.

[youtube http://www.youtube.com/watch?v=7V3B_ZnDVnw%5D


Additional code may be used to vary the width and height of the player. Note that the height value includes the control bar, which takes up 30 pixels, so e.g. a height of 510 is required for 480p video. Common sizes are &w=640&h=390 for widescreen videos (the default), &w=480&h=390 for low resolution “conventional” videos, and &w=640&h=510 for high resolution “conventional” videos. As with images, the width shouldn’t exceed 640 pixels.

[youtube http://www.youtube.com/watch?v=7V3B_ZnDVnw&w=480&h=390%5D


[youtube http://www.youtube.com/watch?v=7V3B_ZnDVnw&w=640&h=510%5D


If the action doesn’t start until someway into the video, you can use the &start= extension to specify the time in seconds that you would like the video to start from.

[youtube http://www.youtube.com/watch?v=OE8Yb1WgvhM&start=960&w=480&h=390%5D

Inserting polls

The poll service is provided by PollDaddy, which is integrated into WordPress.


To add a new poll or manage your existing polls, find the poll options on the left-hand menu bar. Clicking “add new” will bring up the following screen Update: this has changed. To access your polls, click “Feedbacks” on the lefthand bar and then choose “polls”.


A – The title of your poll
B – Enter the voting options. Click to add options as desired. You can deleted an option by clicking the cross to the right.
C – Choose the visual style of the poll.
D – Randomise answer order. Varies the order in which choices are presented to the voter. May make a vote fairer.
E – Allow other answers. Gives an option for the voter to type in their own choice if none of the provided options appeal.
F – Multiple choice. Selecting this will allow you to set a maximum number of choices the voter can make. As far as I’m aware, it is not possible to enforce a minimum.
G – Choose whether to make the results visible or hidden.
H – Choose whether to allow people to vote multiple times or only once.
I – When you are done click to save the poll. The poll’s shortcode should then appear under the title.

Copy and paste the shortcode (highlighted) into your post to make the poll appear. The poll can be placed in more than one posts.

To manage your polls, click “all polls” on the left-hand menu.


A – Add a new poll
Placing the mouse over a poll title causes a series of options to appear.
B – Edit the poll. This enables you to correct the names of the options or change the visibility settings, etc. I’m not sure whether it is possible to add or take away options once a poll is up and running; I’ve never tried.
C – Get the WordPress shortcode, plus embedding codes for other sites.
D – Close the poll. This prevents further voting.
E – Preview. See what the poll will look like on your post.
F – Delete the poll. This is permanent, I think.
G – View the results. This brings up a window like the one below.


Note that the results listed in order of descending votes, not necessarily the order in which you specified the choices. Also notice the flaw in the percentages, which add up to 101% ! This is due to rounding errors. The exact percentages are 62.5% and 37.5%, which correctly add up to 100%. However, the display results are rounded to the nearest percent, and .5 is always rounded up to the number above, causing the extra phantom percent.

4 Responses to TG Tips

  1. wamwamwam123 says:

    So thats where the extra ‘who gets covered in foam’ poll came from. For a moment I thought that the daily mail had hacked your acvount and added the poll to use as evidence! 🙂

    But i must congratulate you on such a good page. These tips are very good, and even experienced authors like me can learn something new from here! I certainly will be using some of the html tips.

    Like

  2. aim11111 says:

    TG im struggling to add poll due to the fact the screan i see is different to the one the screanshots are of

    Like

  3. aim11111 says:

    no worries i found it 😀

    Like

  4. pml89 says:

    Interesting tip I thought I’d add here (particularly useful for TG). When inserting a link to another page on the blog (e.g. linking a story on the author blog pages), instead of copying the link, simply write the text as normal, highligh and press insert link, then you should be able to search all posts and pages on the blog. This has the added benefit of inserting the title of the post into the link, so that when you hover over the link, it shows where you are going (have a look at the A-Z page for example, I’ve done the first few there).

    Also This page shows the changes that have happened in the meantime, including how old it is. The new post page looks a little different these days.

    Like

↓ This is where you write something ↓

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s