Skip to main content

How to Post an Article

Composing an article for online publishing is different from writing a letter in Word, but not more difficult 

In online publishing, the 'document' has to adapt to varying screen sizes of the readers. A document needs to look as good on a wide computer screen (with up to 20 words across a line), as on a small smartphone screen (with perhaps only 8 words per line).

This is achieved by letting the text 'flow', which means that text wraps to the next line when it has reached the right margin of the screen, regardless on which screen it is viewed. 

It is also important to know that the format of any online article is mostly determined by the software that is being used. These formatting attributes are usually hidden, and there are very few options for the editor to 'manipulate' any text or images. 

We first describe what you normally do, followed by some problem-solving.

Draft a new post

1. Open a 'New Post'

2. Check whether on the left side of the header, the 'pen' is shown. This is the 'compose view'. Clicking the arrow next to the pen will bring up < >, which is the html view. The compose view aims to simulate how the finished post is likely to look. The html view displays the 'code', which allows more specific corrections or changes for those who know how to write html (hypertext). 

3. Type a title in the title-line, preferably adding the name of the author or person who proposed the article to be published. So far, we only accept posts from people who have signed up as members of XUNICEF

4. Add text in the body of the post. In most cases, you may want to copy text that was sent to you in the body of an email, or was attached in a word document. Paste this text into the body of the document. Make sure the cursor sits where the new or added text is meant to appear.

It is best to 'paste as plain text'. This will remove most of the hidden code that the copied text is carrying with it. For example, the copied text may have been written in an unusual font, or portions may have been in italics, or may have been larger or smaller, or may have been indented, or there might be spaces or blank lines which are not evident on first sight. When moved to our online site, many of these imported attributes may conflict with the formatting attributes that are already present on our blog. At best, the blogpost will look untidy, at worst it may be unreadable. The disadvantage is that any hyperlinks included in the text may also disappear, even though they can be re-inserted. 

Alternatively, you may paste the text into the body of the post  as it was found. You then need to apply the 'clear formatting' command. This is the last command in the header line, and looks like a  'T' with a strike-out. Highlight the entire text in your new post, and then click the 'clear formatting'. This may also remove any imported attributes, but preserves the hyperlinks. 

5. Once the text is 'clean' you may (re-)apply any boldface or italics attributes, or underline and so on. You may also adjust its alignment (left aligned, right aligned, center-aligned) 

6. If you wish to show a line as a sub-title or heading, highlight the text and apply the 'normal' or 'subheading' or 'paragraph' attribute from the header menu.  

Blogger saves any changes made to your post every few seconds. 

Inserting images

All posts should have an image - at least one to serve as a placeholder in the blog. It should signify the essence of the post - the event, the author or a theme. 

1. select a picture that you want to include, and remember the location where from you can pick it up. In case of an image from the web (such as an image belonging to a news article), download it and save it on your computer.

2. Place the cursor where you want the image to appear, and click the 'insert image' icon in the menu. Let us assume you have the image on your computer. Select 'upload from my computer'. The folders on your computer may show and you may point to the image that you want to upload.

3. Click select and the image will upload and insert itself at the place where your cursor was placed last. By default, the image will be shown in medium size and center-aligned (no text to the left or right of the image).

4. Adjust the size of the image. When you click on the image as it appears in your post, a menu shows below the image. One of the icons adjusts the image size. You can choose between small, medium, large, extra large and original. 

  • You need to understand the effect of the image size on the blog, when viewed on different screens: A 'small size' image may appear in the corner of a page when viewed on a computer screen, but may fill out the screen when viewed on the smartphone. On the other hand, an extra large sized image may appear to fill out the screen on a computer, but can still be seen in full on a screen on a smartphone. 
  • You need to experiment with the adjusting the size of an image as it should appear on the blog. For example, an 'author's picture is likely to be small, like a thumbnail. A group photo with many faces or a graphic depicting data would probably be extra large. 
  • Avoid to display an image in larger size than it originally is. The  display of different sizes is approximately: 
    • small: 150 pixel wide
    • medium: 250 pixel wide
    • large: 400 pixel wide
    • xlarge: 640 pixel wide
    • original: whatever the size of the original

For example, do not force a picture to show as xlarge, when it original size is only 300 pixel wide. This may cause the image to appear pixelated or out of focus.

 5. Align the image. By default, the image will be center-aligned. If you are happy with this, there is nothing else to do. If you wish the image to be aligned to the left margin (and the text flowing to the right):
  • First you need to align the image in the body of the text. You do this by clicking on the image, then selecting the appropriate alignment button in the header of the post. This will move the image to the left or right or center, whatever you selected.
  • Second, you need to select the appropriate 'wrapping/alignment' button under the image (when the image is clicked), and the text will flow around the sides of the image. 
  • It may happen that after clicking some of these buttons, possibly in an attempt to reverse some earlier decision, the image or the text refuse to cooperate (i.e. the image does not move to where we want it to be, or the text wraps on the wrong side). In this case, highlight the relevant image and corresponding text,  apply 'clear formatting'. Now the commands (alignment, etc) will work again. 

Preview!

It is necessary to preview all posts before publishing. What may look good in the drafting screen, may not look good at all when published. Remember also that half of our readers view the blog on their smartphone. While we typically prepare posts on the computer (and computer-sized screen), we may not be aware on how the post looks on a smartphone.

1. Click the preview button, to get an idea how the post will look like.

2. At the bottom of the preview screen, check both the 'desktop' and the 'smartphone' versions.


3. Check your posts for any strange characters, correct display and size of images, correct alignment of text or pictures, spacing of lines, display of subtitles or headings, font size.

4. Watch out for surplus 'blank lines', between paragraphs and particularly at the end of an article. It frequently happens in the editing process that extra 'blank lines' are inadvertently added. While hardly noticeable when viewed on a computer screen, the white space becomes exaggerated on a smartphone (when one blank line is turned into several blank lines because of the text-wrapping inherent in online publishing). Any remaining content may literally be falling off the screen, including the prompt for comments or other footers. Adjust the article in the editing window and check again.

Publish

When all is done, publish the post. It always can revert to draft, in case of any mishap. You can adjust the 'order' of the posts as they appear on the blog, by adjusting their 'published on' attribute in the right margin. You can set the date to an earlier time or date, which will move the post down the list of the most recently published posts.

We also recommend to attach at least one or more labels - especially for articles that have lasting value (i.e. original contributions by authors).  Click on the 'Labels' field in the right margin, and you will be given the menu of already existing labels. Labeling articles will help to filter  (i.e. search and find) articles that have been posted some time ago, without having to endlessly scroll through the blog.

Problems?

Images do not show: In most cases, this happens when an article with images was copied and pasted from the web or an email. The process failed to 'capture' the image. Solution: Go back to the source document and download the image unto your computer (or onto the google drive).

Pictures do not align properly:  apply clear formatting, including for text preceding and following the image

The first letters of my post look funny: In our present blogger theme, the first line of a new article is emphasized in blue, and the first letter is larger in size. You may like it or you don't. Solution: Enter an empty space or line before the first letters in your post. If you do not wish to add 'blank space' at the beginning of your post,  go to the html view. A lot of code appears. At the beginning of the code, insert <div></div> 


|

Comments