Joomla Websites

Joomla User Management
Getting Started  •  Menu Manager

Website Structure

Sections  •  Categories

Create a New Article
Set up a New Article  •  Add Content  •  Format  •  Links  •   Anchors

Working With Images
Preparing Images  •  Inserting Images With Flickr  •  Inserting Images Without Flickr

Lists

Contacts List  •  Simple Lists

Joomla User Management

Getting Started

Not all browsers work perfectly in Joomla. Firefox will work best, especially when formatting articles and images. Do not use Internet Explorer.

The Joomla administrator portal allows access to menus for creating and managing content and navigational structure. A Joomla staff portal is also available (contact Mike Sauvola) for limited, easy access to article editing.

To begin working in Joomla open your library homepage in two windows:
1.  In your browser open your homepage and copy/paste the url into a new window.
2.  Add /administrator to your url (example: library.wislib.org/administrator)
3.  Type your username and your password and click the Login button

Menu Manager
An administrator portal is available for managing your website's content and navigational structure.  Menus are accessed from either the icons or the drop-down navigation at the top:

  • The Front Page Manager menu will display a list of articles that are selected to show up on the front page.
  • The Article Manager will display a list of all articles.
  • The Media Manager will display image files.
  • The Category Manager is a list of the groups used to organize your articles.
  • The Section Manager is a list of groups to organize your categories.
Top of Page 

Website Structure

Sections
Your site can be organized into sections to help you group similar articles. For example, articles related to Fiction, Nonfiction, Movies and Music can be grouped together in a New Releases section.

1.  Access the Section or Categories from either the icon or menus:

  • Content > Choose Section Manager 
  • Site > Control Panel > Choose Section Manager

2.  To add a Section select the New icon
3.  Name the section in the Title field, and select Save.

Categories
Each Section of your website can be organized into Categories. For example articles in the New Releases section can be subdivided into categories for Adult, Youth, and Toddlers.  

1.  Access the Section or Categories from the icon or menus

  • Content > Choose Category Manager
  • Site > Control Panel > Choose Category Manager

2.  To add a Category select the New icon
3.  Name the Category in the Title field
4. Select a Section for the new Category and select Save

Top of Page

Create a New Article

Set up a New Article
1. Access the Article Manager from one of the following menus:

  • Content > Article Manager
  • Site > Control Panel > Article Manager icon
2. In the Article Manager click on the New icon (upper right)
3. In the Title field type the name of your new page.
4. In the Published field choose if it will appear on your website as soon as it is saved.
5. In the Front Page field choose if it will display on the front page.
6. Select the Section and Category for this article
 
Add Content to a New Article
Type the content of your article in the large box below the editor icons. Be sure content is concise and without typos.

Pasting Text into an Article
If you paste content from a document, you must first copy and paste it into Notepad, and then copy and paste the text from Notepad to Joomla. Pasting from Notepad will allow you to format the article in Joomla and will also prevent the Word formatting from loading the page slowly.
  1. Notepad is available from your computer's All Programs list in the Accessories file.
  2. Type Ctrl A to select all of the text in your Word document (or highlight the text to be copied)
  3. Type Ctrl C to copy the selected text (or choose File > Copy)
  4. Type Ctrl V to paste the text In Notepad  (or choose File > Paste) 
  5. Type Ctrl A to select all of the text in Notepad
  6. Type Ctrl V to paste the text into your Joomla article
Preview and Save an Article
You can preview your work on an article, save it as you work on it, or save and exit the article by choosing from the icons located in the upper right:
  • Select Preview to view your article
  • Select Apply to save and continue working with the article. It's wise to save your work as you go.
  • Select Save to save and exit the article.
Top of Page

Format An Article
The following formatting tools will help you format your articles:

  • Text bold, italics, underline
  • Headings: Paragraph is the body style. A choice of six different heading styles.
  • Bullets
  • Numbers
  • Hyperlinks (creating a link to a web page)
  • Anchors (creating a link to a place on the current page, such as the top)
  • Picture editor (position your image and provide a title that displays as a cursor hovers over it.)
  • Special symbols (such as © or →)
  • Tables 
NOTE: Changing the font is not advised since it may prevent you from being able to alter it again. Your website template has been preformatted with font styles for the body and headings. These preformatted styles give your website consistency, an important feature of a well designed website.  
 
Links
To create a link to a website, highlight text and click on the link icon (it looks like a chain link) in the toolbar. Copy and paste the URL in the Link URL field.
 

Anchors
You can create a link to a section of your website that has an anchor. For example you can link text such as "Top of Page" to an anchor you insert at the top of your website:

  1. Place your cursor at the top of the page
  2. From the toolbar select the anchor icon (looks like an anchor)
  3. In the Anchor Name field type top and select insert.
  4. Type a line of text such as Top of Page   to direct people to the top of your website.
  5. Highlight the Top of Page text and click the link icon.
  6. In the Anchor field dropdown box select top.
  7. Click the Insert button.
Top of Page

Working With Images

Patron Privacy Issues
"The Right of Publicity Law" requires permission to display a photo for publicity when a person can be identified. Individuals have the legal right to control use of their own images for marketing or commercial purposes and gives them the right to stop others from using their image without permission. Crowd shots that do not show faces do not require permission.

Preparing Images for the Web
The quality of an image is compromised every time it is saved to the same name. Be sure to preserve your original image by making a new copy any time changes need to be made. When you make changes, use the Save As and rename it to create a new version. 

It's important to optimize images for the web in order to prevent them from loading very slowly. There are many free image optimizing services to choose from.

Uploading Images With Flickr
Flickr is a great way to edit and manage images stored on the web. Flickr automatically creates multiple sizes that are compressed to load quickly. You can create a Flickr account using your library Facebook login, or your library Gmail login. Otherwise create a new library Flickr account by selecting the Sign Up link.

Visit Flickr Photo Management to learn how to use Flickr to effectively work with images for your website. Once you have established a Flickr account, select an image from your photostream:
1. Click on the Flickr image
2. In the "Actions" menu select "View all sizes"
3. To the right of the photo, the Sizes menu displays links to a variety of sizes you can view.
4. Select the image size that works for your article.
5. Right-click on the image and choose "Copy Image Location"
6. Open an article for the image in Joomla (improvise for blogs or other web editors)
7. Place your cursor in position for the image
8. Select the Insert/Edit Image tool from the toolbar (looks like a tree)
9. In the Image URL field paste the URL from Flickr (Ctrl V or right click >Paste)
10. In the Title field add a short description that will appear as text for accessibility tools
11. Click the Appearance tab
12. The Alignment dropdown options allow you to choose a position for your page (right, left, etc.)
13. Click the "Insert" button to finish.

Uploading Images Without Flickr
Joomla stores images in the Media Manager. Images from your computer can be added to the Media Manager in two different ways: 

  • Navigate to the Media Manager and upload an image: Site > Media Manager > Choose File > Start Upload
  • In an article, use the two step process of uploading an image into the Media Manager and then inserting it into your article at the cursor
Images can be inserted into articles by clicking on the image button at the bottom of the page. You are next given the option to insert the photo from the Media Manager. If your photo is not yet in the Media Manger, you are given the option to download and then insert it.
 
Download/insert an image located on your PC:
1. Place your cursor where you'd like the image to appear in the article
2. Click the Image button located at the bottom of the screen
3. Click Choose File and navigate to your image, select and open it.
4. Click Start Upload to upload the image to Joomla
5. Click Insert to insert the image

Insert an image located in the Joomla Media Manager
1. Place your cursor where you'd like the image to appear in the article
2. Click on the image button at the bottom of the screen.
3. Click on your image thumbnailSo much @ your library
4. Click the Insert button

Adjusting the inserted image
1. To adjust the image select it and click on the Insert/edit image icon in the toolbar that looks like a tree
2. Type in a Title that will appear as text for accessibility tools.
3. Click the Appearance tab and the Alignment arrow to position it (right or left of text)
4. Scroll down to click the Insert button to save changes.

Top of Page

Lists

Contact Lists

Creating lists of staff and trustee contact information in the Components menu: 
1. Select Category from the Components menu to access the Category Manager.
2. Create a category for Staff and one for Trustees by selecting the New icon.
3. You can optionally add text for the address and telephone. Save changes.
4. In the Component menu select Contacts to access the Contacts Manager and select the New icon to create one for each person. The email will be protected from spam by triggering a form that will forward email messages without revealing the email address.

Editing a list of contacts:
1. From the Components menu select Contacts
2.
From the Contacts Manager you can unpublish or change the order (edit numbering and click the black icon in the order heading)
3. Click on a contact name to edit the individual's information.

Simple Lists

Creating a formatted list of items  in the Component menu with images and links:  
1. From the Component menu select Simple List.
2. Choose Category to access the Category Manager
3. Click the New icon to add a category for each type of list.
4. Select Items and click on the New icon to add to your list of items.
5. Choose a Category for each item.
6. The right column provides options for including a link and an image.
7. Save your new item. 
8. The order in which the items display can be changed by editing the numbers and clicking on the black icon in the order heading. You can also unpublished any item to prevent it from displaying on the website.

Edit a Simple Lists item:
1. From the Components menu choose Simple Lists and then Items
2.
Choose from the list of items.
3. Edit and Save.

Top of Page