Chapter 7 [ 187 ] TTThhheee pppooowwweeerrr ooofff DDDeeessscccrrriiipppooonnnsss IIInnn ttthhheee PPPaaarrraaammmeeettteeerrrsss (((BBBaaasssiiiccc))),,, yyyooouuu cccaaannn ssseeettt DDDeeessscccrrriiipppooonnn,,, DDDeeessscccrrriiipppooonnn IIImmmaaagggeee,,, aaannnddd CCCaaattteeegggooorrryyy DDDeeessscccrrriiipppooonnn tttooo ssshhhooowww TTThhhiiisss mmmaaakkkeeesss aaa bbbiiiggg dddiiieeerrreeennnccceee;;; aaaeeerrr aaallllll,,, iiinnn iiitttsss sssiiimmmpppllleeesssttt fffooorrrmmm aaa LLLiiisssttt LLLaaayyyooouuuttt pppaaagggeee iiisss ppprrreeeyyy bbbaaarrreee BBByyy aaaddddddiiinnnggg dddeeessscccrrriiipppooonnnsss yyyooouuu cccaaannn mmmaaakkkeee ttthhheee pppaaagggeee aaa llliiillleee mmmooorrreee iiinnnttteeerrreeesssnnnggg aaannnddd eeexxxppplllaaaiiinnn wwwhhhaaattt ttthhheee ssseeecccooonnn aaannnddd cccaaattteeegggooorrriiieeesss aaarrreee aaallllll aaabbbooouuuttt YYYooouuu aaadddddd dddeeessscccrrriiipppooonnnsss bbbyyy eeedddiiinnnggg ttthhheee ppprrrooopppeeerrreeesss ooofff aaa ssseeecccooonnn ooorrr cccaaattteeegggooorrryyy iiitttssseeelllfff (((ttthhhrrrooouuuggghhh CCCooonnnttteeennnttt ||| SSSeeecccooonnn MMMaaannnaaagggeeerrr ooorrr CCCooonnnttteeennnttt ||| CCCaaattteeegggooorrryyy MMMaaannnaaagggeeerrr;;; ssseeeeee CCChhhaaapppttteeerrr 555 ooonnn ssseeecccooonnnsss aaannnddd cccaaattteeegggooorrriiieeesss))) TTThhheee fffooollllllooowwwiiinnnggg ssscccrrreeeeeennnssshhhooottt ssshhhooowwwsss aaa SSSeeecccooonnn LLLiiisssttt LLLaaayyyooouuuttt wwwiiittthhh aaa DDDeeessscccrrriiipppooonnn ooofff bbbooottthhh ttthhheee ssseeecccooonnn aaannnddd ooofff ttthhheee tttwwwooo cccaaattteeegggooorrriiieeesss iiinnn iiittt AAAsss yyyooouuu cccaaannn ssseeeeee,,, aaa dddeeessscccrrriiipppooonnn cccaaannn aaalllsssooo cccooonnntttaaaiiinnn pppiiiccctttuuurrreeesss DDDooowwwnnnllloooaaaddd aaattt WWWooowww!!! eeeBBBooooookkk WWWWWWWWW WWWOOOWWWEEEBBBOOOOOOKKK CCCOOOMMM Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages [ 188 ] Parameters (Advanced) The advanced parameters give you some more control over the order of categories on a secon list page. Order In what order should the categories be displayed? You can order them alphabecally by tle, reversed alphabecally, or in the default order that the categories have in the Category Manager. Arcle Order The order of the list of arcles your visitors see when they click on one of the category names. This means the Arcle Order doesn't have an eect on the secon list page itself (which contains no arcles), but on the next page. Show a Feed Link Only important if you use news feeds on the site. Parameters (Component) These sengs apply to the arcles your visitor arrives at through this overview page. The opons are exactly the same you as the ones you can set in the general preferences for arcles (Arcle Manager | Parameters, see Tweaking the details: Changing arcle sengs in Chapter 6). Here you can depart from the general sengs for the arcles and make dierent choices for this parcular secon or category. Parameters (System) The Parameters (System) mainly give you some more control over the display of list pages. Page Title The page tle that appears above the page content. You can use this to add an appropriate tle for your secon/category page. If you don't ll this in, Joomla! displays the name of the menu link that points to this page as the page tle. Show Page Title Set this to Hide if you don't want the secon list page to have a Page Title. Page Class Sux This is only important if you want to get more control over the page design (such as font size and colors). Using the Page Class Sux, you add a sux to the name of all CSS styles used on this page. You can read more about CSS in Chapter 11 on templates. Menu Image Should an image be shown in the Main Menu link next to the Home link? You can use menu images to make the menu more aracve and easier to read. You can, for example, have a 'house' icon next to the Home link. SSL Enabled Only important if you are using Secure Sockets Layer (SSL), a protocol for secure Web pages. Download at Wow! eBook WWW.WOWEBOOK.COM Chapter 7 [ 189 ] Using Category Lists The Category List Layout is very similar to the Secon List Layout. It's a simple list, too, in this case as it features the tles of all the arcles in a category. A Filter box (search box) makes it easier to nd content should the list of tles be very long. The Category List parameters give you some control over the list presentaon. Parameters (Basic) The Parameters (Basic) allow you to set, in some detail, what you want to be displayed on the category page. Category Choose the category you want to show. # Links From the drop-down box, select the number of links to arcles you want to display in the list. Table Headings Select Hide to hide the column headers (Arcle Title, Author, and so on) above the table. Date Column Do you want to show or hide the Date Column (with publicaon dates)? Date format By default, Joomla! displays the date as in the following example: Wednesday, 19 August 2010. If you want to format the date dierently, enter a date format code here. For example, entering the code %Y-%m-%d will change the arcle date format to 2010-09-19. To nd out which codes are allowed, check http://php.net/manual/en/function. strftime.php. Download at Wow! eBook WWW.WOWEBOOK.COM Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages [ 190 ] Filter In a long list of categories (more than a few dozen) it's useful to set Filter to Show. The lter gives the visitor the possibility to search the list by entering a keyword in the Filter box. Filter Field By default, the Filter box allows visitors to search by tle. If you wish, you can specify that the search lter works by author name or number of hits. Parameters (Advanced) The Parameters (Advanced) give you some control over the order of list items and the appearance of the list page. Primary Order Select the order in which the arcles are displayed: by date, alphabecally, and so on. By default, the items are in the same order that they have in the Arcle Manager. Paginaon Select Show to show Previous and Next navigaon links if the secon consists of a very long category list that doesn't t one page. Display Select Select Show to display a select box allowing the visitor to choose how many items they want to see on the page. This opon turned on by default, but it's only useful if the list contains at least a few dozen hyperlinks. Show a Feed Link Important only if you use news feeds on the site. Download at Wow! eBook WWW.WOWEBOOK.COM Chapter 7 [ 191 ] The Parameters (Component) and the Parameters (System) of the Secon List Layout are idencal to those of the Category List Layout. To see the Secon List opons, have a look at the previous secon on Category Lists. Pop quiz – test your knowledge of home pages and overview pages 1. How can you change the arrangement of items on your home page? a. By adding new content in the Front Page Manager. b. By changing the Main Menu Home link sengs. c. By selecng 'Display on Front Page' in the Arcle editor. 2. How do you create an overview page? a. By adding a new arcle in the Arcle Manager. b. By adding a new secon or category. c. By adding a new menu link to point to a secon or category. 3. In what cases would you choose to present content in a Blog Layout? a. Blog Layout is used strictly for web logs. b. You use Blog Layout to show a row of arcle tles. c. You use Blog Layout to show teaser texts or full arcles. Summary In this chapter, you've learned all about two types of pages that Joomla! uses to draw the visitor towards the actual content of your site: home pages and overview pages. When you want to set the layout and arrangement of the Front Page contents, you change the sengs of the Main Menu Home link. These allow you to determine how many introductory arcle texts the home page shows, and how they are laid out. When you want a completely dierent home page, you can choose not to use the Front Page sengs. You can set any Main Menu item to be the default home page contents. To show your visi tor the contents of a secon or category, you'll create menu links to secon and category overview pages. These provide an intermediate level between the home page and content pages; they're like "second level home pages". Download at Wow! eBook WWW.WOWEBOOK.COM Welcoming Your Visitors: Creang Aracve Home Pages and Overview Pages [ 192 ] There are two main formats for overview pages, Blog Layout and List Layout. The Blog Layout is more versale and is focused on content. It provides a taste of the arcle content. Its purpose is to lure casual surfers. The List Layout is focused on organizaon. It shows how secons or categories are structured. It helps visitors quickly scan or search for arcle tles on sites with lots of related content (such as elaborate FAQ secons, or large numbers of arcles in a secon with product reviews). This layout enables visitors to nd informaon quickly in long lists of items. In the previous chapter, you've created content; in this chapter, you've focused on presenng that content (through the home page and overview pages). In the next chapter, you'll master another crical aspect of web design: creang great navigaon. You'll learn how to design menus that guide your visitors and help them to easily nd what they're looking for. Download at Wow! eBook WWW.WOWEBOOK.COM 8 Helping Your Visitors Find What They Want: Managing Menus Menus and content in Joomla! are closely intertwined. In the previous chapters, you have seen that menu links don't just point to exisng pages, as you might expect if you have experience building websites the old fashioned way. When adding a menu link, you don't just tell Joomla! what page the menu link should point to, but you rather instruct it to make that page. When adding content to your site in previous chapters, you've seen how this works. By creang menu links, you created dierent types of pages. However, to your visitor, Joomla! menus are no dierent from other website menus. To your visitor, menus should provide an easy means of navigaon. In this chapter, we'll concentrate on menus as a means to navigate. We'll focus on how you can make and tweak menus to design clear and intuive navigaon, and also on how you can help the visitors nd what they want without diculty. Up to now, you've added menu links using mainly the default sengs. Let's nd out how we can enhance menus and improve the navigability of the site. This is what you'll learn: Adding a new menu Creang submenus Adjusng menu module sengs Creang hyperlinks in arcle texts Download at Wow! eBook WWW.WOWEBOOK.COM Helping Your Visitors Find What They Want: Managing Menus [ 194 ] How many menus can you have? On any Joomla! website you can create as many menus as you want. The default sample site that you installed in Chapter 2 is a good example as it contains no fewer than six menus. On the home page four of those are shown: the horizontal Top Menu, the Main Menu, the Resources Menu, and the Key Concepts Menu. In the backend, all of the menus are listed in the Menu Manager (Menus | Menu Manager). At least one menu, the Main Menu, is needed for Joomla! to funcon properly. The other ones, such as the Top Menu (the top horizontal menu) and the User Menu (a menu that's only visible aer users have logged in), are only there to showcase Joomla!'s menu possibilies. In real life you'll probably just confuse your visitors with that amount of navigaon opons popping up on dierent pages and places. However, it's great to be able to create as many menus as you like. This allows you to set up dierent menus for dierent funcons and dierent users. You can have a main menu (at the top of the page) containing primary links, and another menu (somewhere down the page) containing secondary links. You might also want to have a special menu with acon links (such as Login, and Register) and another menu that's only shown to visitors who have logged in. Download at Wow! eBook WWW.WOWEBOOK.COM Chapter 8 [ 195 ] Menus are modules (and why that's important) You've already seen some examples of modules in acon, such as the Poll module. Remember, modules are Joomla!'s magic building blocks that can contain all kinds of funconality. Menus are modules too. In fact, every new menu you add is a new instance of the mod_mainmenu module. This makes menus very exible. Not only can you have as many menus (menu modules) on your site as you like, but you can also tell Joomla! exactly where (on what part of the screen, in which module posion) and when (on which specic pages, for which specic users) you want these menus to show up. Sounds confusing? Don't worry, we'll pracce adding and customizing menus in this chapter—and once you get the hang of it, you'll really appreciate Joomla!'s amazing menu exibility. Creating user-friendly navigation: Cleaning up the Main Menu When building a site, you'll start by adding links to the Main Menu. It's the mandatory menu that is always part of the Joomla! installaon, even if you don't install sample data. But as your site evolves, it can become a long and cluered list of hyperlinks. Even the menu of our SRUP example site already contains eight links. When you nd the Main Menu gets long and messy, what opons do you have to improve site navigaon? Option 1: Change the order of menu items By default, a new menu item is added to the end of the exisng menu. If you were to add a new link called New Menu Item, it would show up at the boom: In our example site we've haven't paid much aenon to menu item order. However, the order in which you add items isn't necessarily the order in which you want them to be displayed to your visitor. Download at Wow! eBook WWW.WOWEBOOK.COM Helping Your Visitors Find What They Want: Managing Menus [ 196 ] Time for action – change menu item order On the SRUP example site main menu there are eight menu items (as you've just seen in the previous screenshot). Let's move things around to present the links in a more logical order. The items that we want to get most aenon should be in the top half of the menu; links to less important or stac content should be placed down below. 1. Navigate to Menus | Main Menu. 2. In the Order column, enter numbers to reect the desired order of menu items. 3. Click on the lile disc icon on the top row of the Order column to apply the new order. What just happened? The menu items now show up in the order that you've chosen. News and Who are SRUP? have been moved up from their humble posion. On the frontend you can see that the order of items has changed: Download at Wow! eBook WWW.WOWEBOOK.COM . the details: Changing arcle sengs in Chapter 6). Here you can depart from the general sengs for the arcles and make dierent choices for this parcular secon or category. Parameters (System) The. Date Column (with publicaon dates)? Date format By default, Joomla! displays the date as in the following example: Wednesday, 19 August 2010. If you want to format the date dierently, enter. eBook WWW.WOWEBOOK.COM Helping Your Visitors Find What They Want: Managing Menus [ 194 ] How many menus can you have? On any Joomla! website you can create as many menus as you want. The default sample site