Joomla cho người mới bắt đầu part 18 pot

Chapter 7
[ 177 ]
Time for action – create a facebook using the Blog Layout
Let's use the Blog Layout to create a small facebook, a few pages presenng the SRUP team:
1. For this purpose, create a few more content pages, each for every one of the
SRUP founders. Navigate to Content | Arcle Manager and click on New.
Create three arcles in the Who are SRUP? category in the About SRUP
secon. In this example, we've used these tles: Ms. Daiping Suraba, Dr. T.
Phaedratski, and Dr. A. Fienstein. Create arcles with an intro text, a Read
more link, and a main arcle text (you've seen this before in Chapter 4).
Download at Wow! eBook
WWW.WOWEBOOK.COM
Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages
[ 178 ]
2. Create a new menu link to the category page. Navigate to Menus | Main Menu
and click on New. In the Select Menu Item Type list, choose Arcle | Category
Blog Layout.
3. In the next screen, give the new link a Title (Who are SRUP?). In the Parameters
(Basic) secon, select the appropriate category: About SRUP/Who are SRUP?.
4. Click on Apply and click on Preview. So far so good! There's a new link, showing a
new category page:
5. As you can see, the default layout is unbalanced. There's a big gap to the
right-hand side of the second and third intro text. That's because we have
to tell Joomla! how to spread items on the page. In Parameters
(Advanced),
set Mul Column Order to Across.
Download at Wow! eBook
WWW.WOWEBOOK.COM
Chapter 7
[ 179 ]
6. Click on Apply and then on Preview. The outcome is much beer:

7. The page looks OK, but there's room for improvement. Why should the rst founding
member have a wide column and the others a narrow one? Let's divide them evenly
over the page. Change the Parameters (Basic) of the Who are SRUP? menu link
as follows:
 # Leading: 0
 # Intro: 3
 Columns: 3
 # Links: 0
Download at Wow! eBook
WWW.WOWEBOOK.COM
Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages
[ 180 ]
8. Click on Apply and click on Preview. The following is the new outcome:
9. Looks alright, but the three column layout doesn't t with the overall site design.
Let's try one last alternave. Set # Leading to 3, # Intro to 0, Columns to 0,
and # Links to 0. Click on Apply and click on Preview. Voila! A simple
and clean one column layout:
Download at Wow! eBook
WWW.WOWEBOOK.COM
Chapter 7
[ 181 ]
Let's keep it this way. The page looks much more balanced now.
What just happened?
You've seen some dierent ways in which category pages can show arcle content. You've
added a facebook to the Who are SRUP? category by displaying the intro text of these
arcles in a category overview page; visitors can click on it to read the full arcle.
Have a go hero – add a category description
Category content doesn't always speak for itself so you might want to give your visitors a
short introducon to a category page. Remember the Category Descripon in Chapter 5? It
allows you to show a few descripve lines at the top of any category page. Why not add one

to the Who are SRUP? category page?
1. Navigate to Menus | Main Menu and open the Who are SRUP? menu link for
eding. In the Menu Item Edit screen, navigate to the Parameters (Basic) secon
and make sure Descripon is set to Show.
2. There's no category descripon to display, so let's add a few lines. Navigate to
Content | Category Manager and click on the Who are SRUP? category tle to edit
the category properes. In the Descripon eld, add some intro text:
3. Click on Save and click on Preview. A short category descripon is displayed:
Download at Wow! eBook
WWW.WOWEBOOK.COM
Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages
[ 182 ]
The more menu items you create, the longer and messier the main menu gets.
You'll probably want to change the order of menu links—or create submenus
to beer arrange the long list of menu links. Don't worry, we'll get to building
and customizing menus in Chapter 8.
Showing full articles on a category overview page
So far, you've seen how you can show intro texts and links to arcles on a category page.
However, you can also use category pages to show a list of full arcles. In fact, this is
probably why this layout is called a Blog Layout. A typical page on a weblog site consists of a
number of short arcles ordered by subject or by date. Here's an example of a category page
showing three full arcle texts:
Download at Wow! eBook
WWW.WOWEBOOK.COM
Chapter 7
[ 183 ]
To ac hi eve th is i n Jo om la!, you use a category pa ge like th e on e you created j ust before.
To sh ow f ul l arcle s instead of intro texts, ch an ge the ar c le texts t he ms el ves. N avigate to
Content | Arcle Manager and select the arcle you need to edit. In the editor screen, delete
the red doed line indicang the separaon between intro text (with a Read more … link) and

the rest of the text. This will tell Joomla! not to split the arcle in two parts, and thus, on any
overview page it will show the full thing instead of just its intro text.
Have a go hero – experiment with Blog Layout settings
Just like the Front Page Blog Layout, the Secon and Category Blog Layout oers a litany of
sengs that allow you to adjust the target page. You can set them trough Menus | Main
Menu | [name of link to secon or category page].
The Component and System Parameters are for the most part the same as the ones you've
seen when seng the Front Page Blog Layout preferences. See the secon Have a go
hero – Try out the Front Page sengs earlier in this chapter for a full lisng.
Just the two rst Parameters are specic for Secon or Category Blog Layouts. Under
Parameters - Basic you select the Secon or Category you want to show, and you have the
opon to add show a secon or category Descripon and a Descripon Image at the top of
the secon or category overview page.
The second type of overview page: Lists
Compared to the Blog Layout, the List Layout provides a simpler view of secon or category
contents. Instead of a series of intros and links, the visitor is shown only a number of links to
categories and/or arcles. The following is an example of a Secon List page in the default
Joomla! installaon, a lisng of four categories in the FAQs secon:
Download at Wow! eBook
WWW.WOWEBOOK.COM
Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages
[ 184 ]
Creating Section Lists
If you've already created links poinng to Blog Layouts, creang a link to List Layout will seem
very familiar. Navigate to Menus | Main Menu, click on New and select the appropriate
Menu Item Type: Category List Layout or Secon (List) Layout. Provide the necessary details
(select the target category or secon and type a link tle) and you're done.
Time for action – change a Blog Layout to a List Layout
To se e the capabilies of the List Layout, let's convert a Blog Layout link you created
previously to a List Layout, both targeng the Acvies secon.

1. Navigate to Menus | Main Menu. Click on Acvies to edit the menu item.
2. In the Menu Item [Edit] screen, click on the Change Type buon:
3. In the Change Menu Item screen, select Internal Link | Secon | Secon Layout.
A Secon List shows no arcle contents; it just presents a list of categories
as hyperlinks.
4. Click on Save. Done! Click on Preview to view the home page of your site; click
on the Acvies link.
What just happened?
With just a few clicks you have created a secon page that displays a list of hyperlinks to
categories instead of a series of teaser texts. Clicking on a category tle reveals another
intermediate page, a list of arcle tles.
Download at Wow! eBook
WWW.WOWEBOOK.COM
Chapter 7
[ 185 ]
In this example, the
Acvies menu link
shows a Secon List of
two categories.
When the visitor clicks
on the Lectures link,
the Lectures category
contents are shown as a
list of arcles. The visitor
can even use the Filter
eld (a search box) to
nd the desired arcle.
The List Layout is useful for secons or categories that are crammed with arcles. It provides
a quick overview, allowing visitors to scan or search for arcle tles. You might consider
using List Layouts on a site with many arcles on related subjects, such as elaborate FAQ

secons or large numbers of arcles in a secon with product reviews. Lists enable visitors to
nd informaon they search for fast. It's not really suited to aract casual surfers to explore
the site's content. For that purpose you can use the Blog Layout.
Have a go hero – undo!
In a site with much content, the List Layout can help your visitors search category and
arcle tles. However, in this case, this layout doesn't really do the trick. It doesn't look very
inving—your site visitors are not likely to click through on an empty page with just a few
links to another page with again just a few links. Luckily, you can easily revert your acons.
Just navigate back to the Main Menu, click on Acvies again and change the Menu Item
Type back to Secon Blog Layout. In Joomla!, choosing and changing the layout of content
overview pages is very easy; it's always possible to reconsider or adapt the layout to the
changing contents of your site.
Download at Wow! eBook
WWW.WOWEBOOK.COM
Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages
[ 186 ]
Customizing lists: Exploring Section List Layout parameters
List Layout pages have less parameters than Blog Layouts. To change the sengs, navigate to
Main Menu | [name of menu link to the secon].
Parameters (Basic)
Under Parameters (Basic) you can set how you want the items to be arranged on the
secon page.
Secon Select the secon you want to show.
Descripon,
Descripon Image
Do you want to show a secon descripon and an image at the top of the
secon overview page? The following example shows an introductory text
on the Acvies secon:
To add the Descripon (or its image) itself, navigate to Content | Secon
and edit the appropriate secon.

Secon Select the secon you want to show.
Category List - Secon Select Show to display the Categories in the secon list.
Empty Categories
in Secon
Choose Hide if you don't want to display empty categories (which are dead-
end roads for your visitor).
# Category Items Select Show to display the number of category items (arcles).
Category Descripon Select Show to display a descripon below each category tle. To add a
Category Descripon, navigate to Content | Category Manager |
[category name].
Download at Wow! eBook
WWW.WOWEBOOK.COM