iJoomla News Portal Component User Manual

This manual is the property of iJoomla.com. You may not sell it, distribute it or use any parts of it without iJoomla.com consent. For more information, please visit iJoomla.com You can find additional help on our site in the following sections: FAQ Forum Support Demo Sites

Other iJoomla Components:

iJoomla Magazine

IJoomla Surveys

iJoomla DigiStore

Contents Overview......................................................................................................................................... 3 Requirements .............................................................................................................................. 3 Knowledge................................................................................................................................... 3 Installation...................................................................................................................................... 3 Uninstalling.................................................................................................................................. 5 Upgrading.................................................................................................................................... 5 Accessing The iJoomla News Portal........................................................................................... 5 Navigation ................................................................................................................................... 5 Control Panel............................................................................................................................... 6 Saving ......................................................................................................................................... 6 How Does It Work?........................................................................................................................ 6 Features.......................................................................................................................................... 7 Short Feature List........................................................................................................................ 7 Full Feature List........................................................................................................................... 7 Settings........................................................................................................................................... 9 General........................................................................................................................................ 9 CSS ............................................................................................................................................. 9 Language .................................................................................................................................... 9 Separators................................................................................................................................. 10 Manage Content........................................................................................................................... 10 Section Manager ....................................................................................................................... 10 Categories Manager.................................................................................................................. 11 Content Items ............................................................................................................................ 12 Design........................................................................................................................................... 12 Layouts...................................................................................................................................... 12 Home Page ............................................................................................................................... 13 Section Page ............................................................................................................................. 13 Category Page .......................................................................................................................... 13 Zones ........................................................................................................................................ 13 What are zones? ....................................................................................................................... 13 Advanced Style Control............................................................................................................. 17

Overview
iJoomla News Portal is a Joomla extension that turns your existing sections, categories and articles into a live news portal. Within minutes, you can have a site similar to CNNs! Convert your site into a news portal in minutes! Add content to your Web pages automatically. Give your visitors a dynamic surfing experience. Display news or other content in an attractive, flowing manner. No CSS or HTML knowledge necessary. Full style and layout control with advanced style control.

Requirements Joomla version 1.x. up to Joomla 1.5. Joomla 1.5 will be supported later. Knowledge Using the iJoomla News Portal requires only need basic Joomla knowledge. Youll need to know how to install components and modules, and how to add images (if you wish to place images on your site.

Installation
To install the iJoomla News Portal, first unzip the iJoomlaNews.zip package and save the files in a directory on your computer. You will find four files: com_iJoomlaNewsPortal.zip iJoomla_News_Portal_Manual.pdf License.txt Readme.txt Select Installer->component from the menu. Next, click the browse button to find the Com_iJoomlaNewsPortal.zip file. Click upload File & Install.

You will now need to create a menu item that links to the news portal component: o o Select Menu-> main menu -> New -> Components-> News Portal from the menu; To make the news portal your default home page, simply move the menu item youve just created to the first position on your menu list.

Finally, select Modules->site modules and publish the news section module. The module will link to all the different sections enabling you to navigate between the different news sections while maintaining the news layout. Uninstalling To uninstall the iJoomla News Portal, select Installer->component from the menu. Check the radio button next to the iJoomla News Portal and click the un-install button. Upgrading To upgrade to the latest version of the iJoomla News Portal, uninstall the component as described above and reinstall it. You will not lose any of your settings.

Accessing The iJoomla News Portal

To access the iJoomla News Portal on the admin interface, click Component on the top menu and select iJoomla News. (Its marked with an orange N icon.)

Navigation

Unlike many other components, iJoomla News Portal uses a left navigation menu and a control panel, not a top navigation. You can easily navigate with either the control panel or the left menu. Control Panel On accessing the iJoomla News Portal on your admin interface, you will see a control panel with a large icon. Most of the component features can be reached through this menu. To bring up this control panel, simply select iJoomla News from the component menu, or if youre already inside the iJoomla News Portal, click on the top left menu link marked iJoomla News Portal. Left Menu On opening the iJoomla News Portal interface for the first time, the left menu will be closed, displaying only the top level items. Click on each title to see the sub-menu items or to reach the area of your choice. Click Close All to close all the menu items. Click Open All to open all the menu items and their sub-items.

Saving Be sure to save every page youve changed in order to record your work as you should whenever you use Joomla.

How Does It Work?

Once youve installed the iJoomla News Portal component and create a link to it from a menu, 99 percent of your work is done... a little less if your site doesnt have any content. On the front end, you will see eleven zones: Top Stories Leading Stories More News Most Popular Featured Section Featured Categories Updated date and time Section/Category Name Module Position #1

Module Position #2 Module Position #3

Content items pass through the first three zones in a flow: Top Stories -> Leading Stories -> More News Each new item will first appear in the Top Story zone. It will then drop automatically to the Leading Stories zone and then to the More News zone, as new articles are added. This gives your page a truly dynamic structure. The remainder of the zones display featured sections, categories, popular articles or the last updated date and time. You can learn more about each of these zones here.

Features
Short Feature List Use your existing content to create a dynamic news site. Choose the sections, categories and articles to display. Three pages available: home page, section page and category page. Advanced style control. Smooth article flow for easy surfing. Smart image handling. Eleven zones available Choose the layout for each zone. Show/hide every element on the page. Content automatically updated when adding new items. Display your most popular articles. Manually define popular articles. Mark articles as sticky to keep them at the top of your content lists.

Full Feature List Use your existing content: o Sections o Categories o Content items Automatically display newest items first. Items flow automatically from one zone to the next: Choose the sections, categories and articles to display: o Show/hide any section. o Show/hide any category. o Show/hide any content item. Layouts: Three pages available: o Home page o Section page o Category page Layout Settings: Control the layout of the pages easily. Move zones by simply moving the zone tags. Add your own images and html to the basic page layout.

Zones: o Eleven zones available: o Top stories o Leading stories o More news o Most popular o Featured sections o Featured categories o Updated date and time o Section/Category name o Module Position #1 o Module Position #2 o Module Position #3 Zone settings: General Zone settings: o Choose each zones width and height. o Define the number of rows and columns on articles. o Set border and background. o Define inner padding o Show/hide separators for vertical and horizontal items. o Orientate articles vertically or horizontally. Headings: o Show/hide article headings. o Select the font face, style, size, color, alignment, background, border, border style and inner padding. Article Title: o Show/hide the article title. o Define the font face, style, size, color, aligement, background, border, border style and inner padding. o Show/hide bullets before the title. o Define bullet color, style and size. o Display a set number of title characters. o Choose the hover color and style. Intro text: o Show/hide the intro text. o Set the maximum number of characters to display. o Choose the font, font size and font color. o Select background, border and padding. o Define the text alignment. o Display the intro text on all or selected items. Images: o Show/hide the image thumbnail. o Show the image on only the first five items. o Set the size of the thumbnail. o Resize images by width or height. o Automatically generate an image thumbnail. o Choose image margin, border color and width. o Set image alignment. o Wrap images. Zone Name: o Show/hide the zone name. o Choose the width and the height of the zone name. o Set the font face, style, size, color, alignment, background, border, border style and inner padding.

Read More o Show/hide the Read more link. o Choose to show the read more link on only the five items. o Set the font face, style, size, color, alignment, background, border, border style and inner padding. Most Popular zone: o Define most popular articles according to hits, manual selection or a combination of both methods. o Show/hide the same popular articles if they appear on more than one zone. Updated date and time: o Six different formats available o Control the font face, color, size, etc. Display 3 Module positions between other zones: o Module Position #1 o Module Position #2 o Module Position #3

Settings
To define the settings, select Settings-> General from the menu. General On the General Settings tab you will find the following options: Show empty categories/sections heading If set to yes, this setting will show the heading of the category or section on the Featured Categories/Section zone, even if there are no items to display. For example, if you choose to show zero items on the sections/categories managers, the Featured Categories/Section zone would only display a list of your categories and sections, linking to their home pages without displaying any items. Show the same items on featured sections/categories and top/leading/more news zones If set to yes, this setting may show articles more than once. For example, an article may appear both in Leading Stories and also under the Featured Sections/Categories zone. Show the same items on popular zone and top/leading/more news zones : If set to yes you may see the same article on the Popular zone as well as other zones. CSS To define the CSS settings, select Settings-> CSS from the menu. This tab is for advanced CSS users. If you know CSS and need greater style flexibility, you can edit the CSS file directly here. If you dont know CSS, dont worry our advanced CSS control system allows you to make changes to this CSS file without having to mess with any code. Just open the zone to make the changes by selecting Design->Zones from the menu. Language To define the language settings, select Settings-> Language from the menu. This tab allows you to edit the language file. Be sure to keep all the quotes intact. Being careless here can cause major problems so if you dont absolutely need to change the language, its often

best to leave this tab alone. If something does go wrong, please download the original language file from our site, and overwrite the changes. Separators To define the separators, select Settings-> Separators from the menu. Use this tab to define the separators for placement between items for vertical and horizontal items. You can download separators from our site and upload them using the media manager.

Manage Content
Section Manager To manage your sections select Manage Content -> Sections from the menu. The Section Manager displays a list of all your published sections. It allows you to choose which sections to include on the News Portal and which to leave out. You can also choose which sections to include in the featured sections zone and the content to place on the home page. In details:

1. Section name. Clicking on the name of the section will open that section in a new window for editing 2. Featured: If this box is checked, the section will be displayed on the Featured Section Zone. Be sure that the zone has to the correct number of slots assigned to it. For example if there are two rows and two columns, four slots available and only the first four sections will be marked as Featured. 3. Home page: Only if this box is checked will the sections content items appear on the home page. A news site like CNN for example, might choose only to display world events on the home page and show entertainment news on the internal pages. 4. Reorder: Use the arrows to move items up and down and to control the order of the sections on the Featured Section zone. 5. Ordering: Again, use the arrows to re-order the sections on the Featured Section zone. 6. Include: Uncheck any sections you would prefer not to include, such as sections that dont contain news content. 7. Featured articles. Choose the number of articles to be displayed under the section name on the featured section. 8. Select option drop down: Filter the parameters displayed. For example, if you only want to see included sections choose include.

9. Filter: Use a keyword to filter parameters.

Categories Manager To manage categories select Manage Content -> Categories from the menu.

1. Category name. Clicking on the name of the category will open that category in a new window for editing. 2. Section name. Displays the parent section of the category. Clicking on the name will open that section in a new window for editing. 3. Feature Home page: Only if this box is checked will the category appear on the Featured Categories Zone. Be sure that the zone has to the correct number of slots assigned to it. For example if there are two rows and two columns, four slots available and only the first four sections will be marked as Featured. 4. Section page. If checked, this option will show this category on the section home page, as a featured category. 5. Reorder: Use the arrows to move items up and down and to control the order of the categories on the Featured Category zone. 6. Ordering: Again, use the arrows to re-order the sections on the Featured Category zone. 7. Include: Uncheck any categories you would prefer not to include, such as those that dont contain news content. 8. Home page: Only if this box is checked will the categorys content items appear on the home page. 9. Featured articles. Choose the number of articles to be displayed under the category name on the featured category. 10. Select option drop down: Filter the parameters displayed. For example, if you only want to see included categories choose include. 11. Filter: Use a keyword to filter parameters.

Content Items To manage content items select Manage Content -> Content Items from the menu.

1. Title: Click the title of the article to change the articles title. 2. Heading: Enter a short heading here to display above the article title (optional). 3. Include: By default all content items are included in the News Portal. To remove a content item, simply uncheck the box and save. 4. Sticky: Check an articles box to keep that article in the first display position. 5. Popular: The Popular Zone lets you display the most popular articles by hit count, choice or a mixture of both. Check the box here to mark articles as popular. 6. Section: Click to edit the name of the articles parent section in a new window. 7. Category: Click to edit the name of the articles parent category in a new window. 8. Author: Click to edit the name of the articles author in a new window. 9. Section drop down: Choose a section for quick filtering by section. 10. Category drop down: Choose a category for quick filtering by category. 11. Author drop down: Filter by author 12. Select marked drop down: Choose Include, popular or sticky as filtering parameters. 13. Filter search box: Enter a keyword to find articles by title with this keyword.

Design
Layouts To design your layouts select Design-> Layouts from the menu. Layouts are simple tables with variable names that are replaced by the zones on the front end. If you have basic HTML knowledge, you can easily switch the HTML editor to HTML mode, copy the code and paste it into Dreamweaver. You can then make any necessary changes and copy and paste it back. You can also add images to the layout HTML. Even if you dont have any

HTML knowledge, you can simply move the different zone tags to change where the zones appear on the front end. iJoomla News Portal comes with three layouts: Home Page The layout of the news portal home page. Section Page The layout of the section home page the page displayed after clicking on the section name on the home page, on the category home page or on the news section module. Category Page The layout of the category home page the page displayed after clicking on the category name on the home page or on the section home page.

Zones To define your zones select Design-> Zones from the menu. What are zones? Zones are areas in your page that display certain information. You can control the look and the amount of information displayed in each zone but you cant change what the zone essential characteristics. Each zone is represented with a tag in the layout HTML. You will only need the tags to make changes to the HTML layout. Most zones contain several elements: Heading The heading of the article as specified on the content item manager. Title The title of the article. Intro The articles intro text. Image The articles first image, displayed on the home page Zone name The zone name. Read more The Read more link that appears at the end of the intro text.

Other zones may have just one of these tabs. Available zones: The front end contains eleven zones: Top Stories {top} Leading Stories {leading} More News {more news} Most Popular {most popular} Featured Section {featured sections} Featured Categories {featured categories} Updated date and time {date time} Section/Category Name {section category name} Module Position #1 {module_position1} Module Position #2 {module_position2} Module Position #3 {module_position3}

The first three zones work in a flow: Top Stories -> Leading Stories -> More News Each new item that you add will show first in the Top Story zone, drop to the Leading Stories zone and finally move to the More News zone as you add new articles. This adds a truly dynamic structure to your page. The Most Popular zone displays the most popular items based on the number of hits. Alternatively, you can mark articles as popular for display in this zone or show a mixture of both types of content. The Featured Sections zone displays a list of sections marked featured. Clicking on a section name takes the user to that sections home page, which displays a complete list of zones for that section. You can specify the number of articles to display under the section name. The Featured Categories zone displays a list of categories marked featured. Like the Featured Section Zone, clicking on a category name takes the user to that categorys home page, which displays a complete list of zones for that category. You can specify the number of articles to display under the category name. The Updated Date And Time Zone is a one-line zone that will show the date and time the page was last updated (new item added or item edited). Section/Category Name zone is also a small zone that shows the name of the section or category the user is currently visiting. Module Position Zones These three zones allow you to add modules between the other zones. Open each zone and choose the module position you wish to display. For example, choosing left will show the modules that are in that module position. You can also choose the number of modules to display. Module Position Zones let you place banners, polls, menus or any other modules between your news zones.

Accessing Zones To access the zones, select Design-> Zones and click on the zone youd like to edit. The first six zones have the following tabs. Each tab represent a part of a zone or the zone in its entirety: General Heading

Title Intro Image Zone name Read more

Each tab has parameters that allow you to control that part of the zone. There are dozens of parameters and most are self-explanatory. Here, however, are some general pointers for editing zones: Choosing a color. When choosing a color you can either click on the colored box and choose from the available color chart or manually enter the color code if you know it. If you dont want any color, either choose no color from the color chart or simply delete the color code from the text box.

All sizes are in pixels. How large is a pixel? The following image reflects how a square of 100x100, 50x50 and 10x10 pixels appears:

Padding. Padding is the gap between the border and the body. For example, if your intro text is the body and the padding is Left: 30, Top: 20, Right: 40 and Bottom: 25, the padding will be 30 pixels from the left, 20 from the top, 40 from the right and 25 from the bottom border:

The body itself can refer to the article title, heading, intro text, etc. Margin. The Margin is the gap between the border and the next nearest object. For example, if the margin is 30 pixels, the gap around the border will be 30 pixels from every direction.

Article Orientation. You can orient items in two directions: vertical or horizontal. If the articles orientation is vertical, then the content will be displayed from top to bottom: first the image, followed by the title, followed by the intro text and the Read more... link. If the orientation is horizontal, the image will appear either right or left as you choose. The remainder of the content will be displayed from top to bottom:

Text transform. Text Transform can turn text into uppercase, capitalized or lower case regardless of its original format. For example, to make all your headings uppercase, choose Uppercase on Text Transform on the Heading tab. Resize Type You can resize images in two ways:

o Proportional by width; o Proportional by height. For example, if you have three items in the Leading Articles zone, and each has an image with a different size (200x100, 300x150, 400x200), if you were to choose Proportional by width and specify the image size as 50 px, all the images will have a width of 50 pixels and a proportional height, in this case, 50x25, 50x30, 50x40. Wrap Image Wrap Image determines whether the text wraps around the image:

Advanced Style Control Advanced Style Control makes it possible to make style changes without knowing CSS. You can change any aspect of the News Portals look just by choosing from dropdown menus or by selecting colors from pallets, etc. However, if you do have advanced CSS knowledge, you can still edit the CSS file yourself.