Frontpage Pro - install and usage

Frontpage Pro Installation and usage

This tutorial will show you how to install and

use JoomlaMarket component Frontpage Pro

Author: Igor Mihaljko

Date: 24. December 2007

Frontpage Pro

Author: Igor Mihaljko E-mail: [email protected] Date: 24. December 2007

Welcome to the tutorial that will try to explain how to install and use

JoomlaMarket Frontpage Pro component. Tutorial will cover all the steps that

are needed to go through to install component, prepare sections and categories,

publish content and show component on the site.

Let start tutorial by installing Frontpage Pro component. Log in to Joomla

backend and follow the steps to install component.

Click “Installers” -> “Components”:

Click “Browse” button:

and choose component install package.

Frontpage Pro


Follow by clicking on “Upload File & Install” button.

After few moments (depends on connection speed) you will “Upload

component – Success” message.

Next, we have to prepare Sections and Categories within sections that will

contain news for Frontpage Pro to show. Choose “Section manager” like

shown on the following picture.

Frontpage Pro


Section manager with already defined list of section will be loaded. We will create

new section so click on “New” button.

Fill in the following data:

1. Title 2. Internal section name (choose the name that will best represent the type of news that will be contained within this section)

3. Click on the “Save” button

After that, new section will be listed in the “Section manager”. Write down

“Section ID” of newly created section. We will use this information later for

Frontpage Pro configuration options.

Frontpage Pro


The next step will be to define new category within section defined in previous

step. Choose “Category manager” from the main menu.

Category manager will appear with the list of already defined categories. Click on

the “New” button to define new category that will contain news for Frontpage

Pro to show.


1. Category title 2. Category internal name 3. Choose the section that this category will belong to 4. Click on the “Save” button to confirm creation of new category

Frontpage Pro


Write down “Category ID” of newly created category. We will use this

information later for Frontpage Pro configuration options.

It is time to configure Frontpage Pro component. Choose “FrontpagePro

Ajax” from component menu on the mainmenu toolbar.

List of Frontpage Pro options will appear. Fill in the data like shown on the

following picture:

1. Count – number of news that will be shown on the front page of

Frontpage Pro component

2. Category ID – you did write this information before, right?

3. Section ID – you did write this information before, right?

4. Frontpage items – choose if you would like to show regular Frontpage

items or not

5. Method – choose the method that will be used to sort news (“Latest” or

“Most popular”)

6. Language – choose language (only English for now)

7. Image width – input the width of images that will be shown in the news

(you have to use {mosimage} tag in your content to fully utilize this

option)

Frontpage Pro


8. Template – input the name of the template that will e use to represent

the content. Leave the default one for now. In the tutorial that will follow

this one I will explain how can you define new template for Frontpage

Pro component

9. Page title – input the text that will be used as title of this component on

the frontpage of your site

10.Click on the “Save” button to confirm configuration changes

Let’s add some news content to show with Frontpage Pro component in the

frontend of site:

I won’t explain how to add content. I guess that Joomla users know that by now.

Frontpage Pro


After adding news content it’s time to put Fromtpage Pro component in a menu

so we can show it in the frontend. Open menu manager and add new item to our

mainmenu:

Click on a “Component” to add Frontpage Pro component to menu.

Frontpage Pro



1. Name – item tilte that will appera on a menu

2. Component – choose FrontpagePro Ajax component

3. Save – click “Save” button to save newly added item

This is the result as seen on a frontend of site:

When we click on Frontpage Pro item on a mainmenu the content will be shown

represented with light template as we choose few steps before.

Frontpage Pro


Frontpage Pro


You can see that image in the news content is resized to the dimensions that we

choose in Frontpage Pro configuration in the backend of Joomla site.

If you click on a picture it appears in a lightbox. You can browse all the pictures

from all the news shown with Frontpage Pro on the frontend by hovering

mouse to the left or right side of the picture and clicking on a text that appear

under mouse cursor.

Frontpage Pro


When you click on Read more text in the footer of every news the full text of

that news will be loaded in a Graybox.

You can also browse every other news published to Frontpage Pro by clicking

left and right arrows on a Graybox. When you are finished with reading news,

close Graybox by clicking an X icon in the upper right corner.

This concludes my tutorial about installing and using Frontpage Pro component.

If something wasn’t clear in this tutorial, you can always ask about features and

ask for help on JoomlaMarket support forum and I will try to solve your

problems.

Frontpage Pro - install and usage

Documents

Transcript of Frontpage Pro - install and usage