Starter Kit for a Report or Story Illustrated with Pictures

storehouse foodbank: crates of supplies You may want to create a page like this to report on an event that has taken place, e.g. a fund-raising activity such as a coffee morning, a sponsored walk, a concert, a special harvest celebration, church anniversary, celebration of Christmas, etc.

To make use of this Article as a Starter Kit,

  • start the Joomla Article Editor to create your own new Article,
  • switch the Article Editor to HTML view,
  • follow this link,
  • copy the text displayed, which is the HTML for the page you are now looking at
  • paste the text into your new Article while in HTML view,
  • then switch your Article back to 'Normal' view. 

Then you will have something you can chop around as much as you please to create a new Article in this style.  The Article which now follows gives you detail about how you might make use of this style and layout of text, incorporating pictures in these ways, within your own Article.

Style and Size of Text:  The font to be used when site visitors view the text in this document, is specified using a font family definition.  The fonts listed in this definition are Verdana, Tahoma, Helvetica, Arial and a generic sans-serif font.  It does not seem to be possible to specify a font family for text when using the Joomla Article editor. 

If you delete the text of this template and start again, the default font (text style) and text size (point size) will look different.  Similarly if you start typing before the start of this description, or after the end.  If you want to keep this style of text you should INSERT your text within the text of the description.  More specifically, within any paragraph you should start typing at any position after the first character or before the last character.  When you are finished, you can delete the character(s) before and after your insertion.  At the end of this Article is a text string containing a row of the letter X.  You could insert your own story within that.

When you are viewing this Article using the Joomla Article editor, notice the thick, pale-grey bar which follows this paragraph.  This is a continuation or 'READ MORE' marker.  If you are writing an Article for a blog (News Articles or sub-Categories of News) this allows you to write an introduction or summary 'above the bar', then invite readers to READ MORE if they wish.  Other types (Categories) of Article will ignore the bar.

Storehouse Foodbank: goodies for the Easter Bags of JoyAligning Pictures:  The pictures included in this story have been right- or left-aligned.  If you do this, the text will flow round the pictures.  If you choose to have a picture centre-aligned, it will appear on a line by itself.  If you don't define the alignment of a picture, it will appear within the text as if it were a single, very tall letter within the string of real letters making up the words of your story.  It will usually look odd.

In addition to the alignment specification, you should set the width of the gap you want between the text and each picture.  For a right-aligned picture, space will be required to the left.  You may not need space above or below.  Try it and see.  For a left-aligned picture, space should be created to the right.  A value of 10 (pixels) is a suitable value for a margin. 

Storehouse Foodbank: Easter story bookTo position a right- or left-aligned picture where you want it in your story, you only have to position the cursor (i.e. click the mouse/pointer) somewhere near the beginning of the line where the top edge of the picture should appear, then make a request to INSERT IMAGE.  See the palette of icons above or the menu displayed when you click the right-hand button of your mouse. 

Storehouse Foodbank: loading up for a deliverySize of Pictures:  As described in the How-To Guides, the size of each picture should be adjusted before it is uploaded, so that it will be in proportion to the display of the text of the story.  Depending on the width of your Article display, the image width might typically be in the range 250-500 pixels.  You should use an image editor to make your pictures the right size.  Of course you may want a particularly attractive or particularly memorable photo to be displayed in a bigger size, but beware of overwhelming the text.

It is possible to have your cake and eat it, however!  You can create a suitable size of image to fit in the article, but then create a link from that image to a larger version of the same.  To do that, you use the INSERT IMAGE request to upload the bigger picture in the normal way but don't then insert it within your story.  Instead, CANCEL the 'Insert' request.  Then, select the smaller image (or a suitable string of text) and INSERT LINK. 

A Dialogue Box is then displayed to let you define the link.  In the field labelled URL, type the following text:
            images/dtmc_images/your_Joomla_folder_name/your_Joomla_file_name 
If you are creating a story for your church pages, your_folder_name will be 'ourchurches_images' or 'ourchurches_images' followed by the name of the folder for your particular church, e.g. 'ourchurches_images/CLOUD_images'.  Finally, add the name of your big image file to the end of the URL.  So the result could be something along the lines of
            images/dtmc_images/ourchurches_images/CLOUD_images/Cloud_let_there_be_light_window.jpg

Even when you want to introduce a 'big' picture, don't overdo it.  If you create a picture in landscape format that is 750-1,000 pixels wide it could fill a web browser window.  Even at that, the file size might only be 300-400kb.

 

You can start your Article here...   XXXXX