Multimedia cho Joomla part 29 ppt

Choose the section and category you wish to copy the article into in our case, "General – Content", and then click on Save.. These display and ordering configurations are all made in the

When you have clicked on Save, you will be taken back to the Article Manager

screen We want to repeat this process, so we have at least three to four articles

displayed Hence, use the "Copy" feature on the Article Manager screen in order

to clone the article:

1 In the Article Manager, click on the left-hand side radio button next to the

article you wish to copy

2 Click on the "Copy" article icon at the top-right of the screen

3 Choose the section and category you wish to copy the article into (in our

case, "General – Content"), and then click on Save.

4 Click on the title of the new article to edit it Once in the Edit Article screen,

adjust the Title and Alias of the article (Article 2, 3, 4, and so on) and make

sure they are set to a published state and viewable on the front page)

If all of your copied articles have been published, when you look at the frontend

of your site, you should now see two of them shown on the Joomla! front page This

is because we told our "Home" menu link to display two articles only, and to show

two columns:

You will notice that the articles have been displayed randomly It is possible to

show them by most recent article first, the physical ordering of them in the Article

Manager, or by alphabetical order These display and ordering configurations are

all made in the "Home" menu link, under the Parameters (Advanced) section:

Adding a module to display our latest news

There are a number of other features available for the front page; let's add a module

extension that nicely displays articles that are located within a certain category The

module we will use for this is called "ThumbsUp" and is available from the Joomla!

Extensions page

Before we can use this module, we need some content to be displayed within it

Repeat the process you used to create and copy articles, but this time make sure

they reside within the section labeled "News" and the category labeled "Latest" and

are published Do not publish them on the front page though Feel free to add any

images into your content items in order to add some color and interest to the pages

This module pulls in news from certain sections and categories

Before editing this module, make a note of the ID number with the section labeled "News" and the category labeled "Latest" These can

be found under the respective managers for those areas

Follow these steps:

1 Visit http://extensions.joomla.org and search for "ThumbsUp"

3 Upload this extension in the Joomla! administration, using the

Extension|Install / Uninstall feature.

4 In the administration, navigate to Extensions|Module Manager, and click

on the title of the "Latest Articles with Thumbnails" module to edit it

5 Adjust the parameters of the following:

Feel free to adjust any other parameters that you require If you look at the front

page of your website now, it is starting to get some depth to it quickly:

Adding the date and time

There are a number of ways to add a time and date function to your Joomla! site

This can be a useful feature to users in news, magazine, or busy web portals Some

commercial templates may already contain this feature, and simply require it to be

activated Others, like the JA_Purity template, do not have this option, so we will

proceed to include it

1 Method 1

Insert the correct PHP, JavaScript, and / or HTML code into your template

manually There are a number of pre-built scripts available on the Web that

2 Method 2

Use an available Joomla! Extension such as the Date and Time module Here

are the steps:

Search the Joomla! Extensions area for "Time" at

http://extensions.joomla.org

On the results page, click on the category labelled Date & Time,

and this module will be displayed

Visit the extension developer's website and download the

extension to your computer

Upload this extension in the Joomla! administration, using the

Extension|Install / Uninstall feature.

In the administration, navigate to Extensions|Module

Manager, and click on the Title of the "Date2" module to edit it.

Adjust the Module Parameters as you wish I am going to use the "JavaScript"

feature to check the time (so seconds show in real time), and I will publish

the module to the "Left", which will show in a left column in our template I

am also going to turn off the module Title:

It is worth noting that these time and date features will work off the server time

Hence, if working locally, you will see your local computer time

Adding a search feature

All sites that have any form of content need a search feature to allow users to find

this easily The JA_Purity template has built-in styling for a search box already

included within the template's CSS, so adding a new search feature to our site

will be very easy

1 In the administration, navigate to the Extensions|Module Manager screen.

°

°

°

°

°

3 From the available list of options, select the Search link and click on the text

in order to load a new search module:

4 Make sure the title is not displayed, but the module is enabled It will need

to be published in user4 position, which will display it at the top-right of

our web page:

5 Click on Save on that module, and if you look at the frontend of the site, you

will see your new search box displayed below the font size controls:

Personally, I feel the default black background is a bit dark to see, so a quick change

to the template CSS file can adjust that I will set the search background to white, and

the search text to black:

#ja-search inputbox

{

width: 120px;

border: 1px solid #333333;

padding: 3px 5px;

color: #000000;

background: #FFFFFF;

font-size: 92%;

}

Remember to save your changes and you should see these reflected in your site

Adding images

As you have seen throughout the course of this book, images can be easily added

to Joomla! Articles and Modules and formatted as you require There are, however,

some powerful image extensions for Joomla! that we will now utilize within our site

Adding an image gallery

Image galleries are one of the most popular extensions at Joomla.org, hence there are

a number of excellent options available

Hopefully, you have had a good read of Chapter 4, Adding and Managing Image

Content, and have found image solutions you require for your projects For this

tutorial, I am going to utilize a few extensions to display images throughout the site

Image gallery using Phoca Gallery

Phoca Gallery is a heavyweight contender for displaying beautiful photo galleries in

Joomla! It is a feature-packed solution, so much so that you could probably write a

book on it in itself!

That said, we are quickly going to add this to our site in order to create a feature

rich photo gallery using this component, module, plugin I will cover the basic steps,

however for detailed support the developer's website and Joomla! Forums will be

able to provide a wealth of knowledge:

2 Visit the extension developer's website and download the following

extensions to your computer:

Phoca Gallery Component: Powers the main Phoca

Gallery features

Phoca Gallery Search Plugin: Allows your Joomla! search

feature to also search Phoca Gallery images

Phoca Gallery Slideshow Plugin: Displays a slideshow of

images from a selected Phoca Gallery category {pgslideshow

id= |width= |height= |delay= |image= } For

an image, O: original, L: large, M: medium, S: small Example:

{pgslideshowid=1|width=100|height=100|delay=3000|im

age=M}

Phoca Gallery Image Module: Displays random images from

the Phoca Gallery Component

°

°

°

°

4 In the administration, navigate to Extensions|Plugin Manager, and enable

the search and slideshow plugins

5 In the administration, navigate to Components|Phoca Gallery, and on

the main Control Panel page, click on the icon "Categories" Set up a new

category by clicking on the "New" icon at the top-right of the page Let's give

this a title of Images and click on Save on that page (note that you can revisit

all of these options to define them as you require)

6 Adding images can be done using various methods, with Phoca allowing

you to use a Flash-based and Java-based upload feature to upload multiple

images quickly

I will use the multiple image feature to add a number of images into my new

"Images" Category The first step is to upload the images, and then once they

are uploaded, you associate them with a category This provides a mail image

resource for future reference

Once your images have been uploaded, choose the "Images" Category (that we will

put them into) and click on the Save button at the top of the screen Depending on

the number of images you upload, you will probably see a processing screen appear

for a period The page should refresh after processing and you will see your new

images loaded into the Image area:

To display these in your website, we need to create a new menu link to this gallery

Navigate to Menu|Main Menu, and create a new menu item to Phoca

Gallery|Phoca Gallery Category Layout The new menu item edit page will show

and we need to give our menu link a title called "Image Gallery"

On the right-hand side of this screen are the available parameters for the new Phoca

Gallery menu link Firstly, we need to choose the category to link to—Images

The following parameters contain a vast array of options, and can allow you to

manipulate your gallery colors, layout, features, and so on You can set these at a

global level in Phoca Gallery, but having overrides at the menu item level means that

each gallery (or link to a gallery) that you create can contain the various options you

require For now, let's click on Save on this menu item and see the results.