HelpFileTemplateTheNewsII by radartasik dadang

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

October 2008 Template INSTRUCTION MANUAL

Copyright ÂŠ 2008 GavickPro - http://www.gavick.com This manual cannot be redistributed without permission from GavickPro More info at: http://www.gavick.com

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

THE NEWS II

GA A VICKPRO VICKPR VICKP FOR INFO, UPDATES, REQUESTS & CONTACT

others high quality and professional templates, componen-ts and modules.

Table of Contents

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

Introduction 4 Introduting The News II . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4 The News II key feactures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

Getting Started 5 The News II - Files Overview . . . . . . . . . . . . . . . . . . . . . . . . . . . .5 - 6

QuickStart!!! Installation 7 QuickStart instructions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

The News II - Quick Guide Steps Installation 8 Resume for a quick Guide Installation . . . . . . . . . . . . . . . . . . . . . . . . . 8 Demo modules positions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

The News II Template 10 Template installation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .10

Template Tools - Installation and Configuration PhotoSlide GK2 . . . . . . . . . . . . . . . . . . . . . . . . . . Tabs Manager GK2 . . . . . . . . . . . . . . . . . . . . . . . . . News Show GK3 . . . . . . . . . . . . . . . . . . . . . . . . . . News HighLighter Gk1 . . . . . . . . . . . . . . . . . . . . . . . Gk Embed Media 1.0 . . . . . . . . . . . . . . . . . . . . . . . .

. . . . .

11 . . .11 . . .11 . . .11 . . .11 12 - 13

Template Parameters 14 Template parameters overview . . . . . . . . . . . . . . . . . . . . . . . . . . . .14

Typography Green Style . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Blue Style . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Red Style . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Modules Positions 18 View of Modules Positions. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .18

15 .15 .16 .17

THE NEWS II

. . . . .

Introducing The News II Introduc

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

Extra! Extra! Read all about it!... There’s a new Gavick Killer theme in town! GavickPro Professional Development Studio is happy to launch the new October Joomla!1.5 “The News II” template, filled with good and excitement news. Because, there are news that should not be forgotten in the minds of readers and things that should be a lesson to the world, so embrace your self in this project, releasing all important information with the greatest credibility and objectivity. Enjoy yourself in the eyes of your Readers!

THE NEWS II

An overview of key features of this template are as follow:

•

Tableless design and 100% css based.

•

3 color variations styles (green – blue - red)

•

Build support for Tabs Manager GK2 component and the new Tabs Mix module.

•

Build support for the PhotoSlide GK2 component and News Image I module.

•

Build support for the News Show GK3 module.

•

Build support for the new Gavick Highlighter module.

•

Compressed engine option for each modules.

•

2 layout options: 2 columns (right+component), 1 column (component).

•

All 25 modules are fully collapsible and 20 modules for Tabs Mix use.

•

Header position width option setting on template configuration

•

Impressive built-in content style.

•

Last Gavick Suckerfish menu version, with 2 built-in options - Suckerfish menu and Mootools.

•

34 different styles moomenu animation effects.

•

Speed menu animation option

•

Optional IE6 Warning / Upgrade Notification

•

Lightweight, modern and very fast-loading design

•

Joomla 1.5 Native

•

W3C XHTML 1.0 Transitional. W3C CSS Valid

•

Fully compatible IE7, Firefox 2+, Firefox 3, Flock 0.7+, Netscape, Safari, Opera 9.5, Chrome

Getting Started S

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

The News II - Overview files The Hi! My name is Paulo Seichinha and i welcome you to our The News II Template Instructions Manual! Since all tools used on this template have their own HelpFile, this Manual will give you the major orientation guide to make your installation. For further and details informations about our tools, please read the respective HelpFiles available on this package or on our free tools download section. The first step to do is download all the files available on our exclusive MemberShip section and also some files that are available on our free section tools. Before we start the template installation, let´s see a brief overview of the files available inside The News II package release.

Sugestion!!! We strongly recommend some regular visits to our update.gavick.com website, because it may be available some updates of the template and tools used on this project. Also, we invite you to visit our oficial blog on - blog.gavick.com - where we, from time to time, give some usefull information and tips on how to customize or change some features of our templates and tools.

So, here’s a brief overview of the files available inside the “The News II” Template pack release. You downloaded the following two compressed files:

gk_thenewsII_J!15.tgz This is the template file installation.

gk_thenewsII_rest_files.zip Important! You must unpack the this file before doing anything - gk_thenewsII_J!15_rest_files.zip package. After unpack the gk_ilife_J!15_rest_files.tgz you will find the following “rest_files” folder containing:

Components ”folder” This contains instructions on how to download ours free component - the PhotoSlide GK2 and TabsManager GK2. You must download this components from our free download section

THE NEWS II

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

Modules ”folder” mod_gk_Embed_Media_1.0.zip - Module with media player display.

_quickstart!!! “folder” This is the most easy way installation process! Includes all files needed to set exactly as we show in the demo”The News II” template, like sugested previously.

Source “folder” The source psd. format files for Photoshop Graphic Editor, that you can use for complete customization of your website design.

_doc!!! “folder” HelpFiles for “The News II” template, PhotoSlide GK2, Tab Manager GK2, News Show GK3 and News HighLighter GK1.

! Important Notice !!!

THE NEWS II

Again, please take note that the PhotoSlide GK2, TabsManager GK2, News Show GK3 and News HighLighter GK1 tools are not inside the “The News II” package - on gk_thenews2_J!15_rest_files folder. You need to download from our free tools section.

QuickStart!!! installation

GA VICKPRO VICK VI CKPR CK PRO PR O GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

The News II QuickStart installation We strongly recommend the use of this installation option, because it’s the easiest way to install our template and to take advanced immediatly to all components, plugins and modules configurations. It will set your joomla website exactly as we show The News II Template in our demo.gavick.com page. In did, this the most easy way installation process! Why? Because it’s like a normal Joomla!1.5 installation. It includes all files needed, the Joomla 1.5.7 stable version, The News II template, the PhotoSlide GK2 and Tabs Manager GK2 components, plugins, extensions, modules and sql demo dump file. All files prepared and ready to a normal joomla installation. Again, we invite you to visit us regulary, because all Joomla!1.5 future upgrades may force us to upgrade all our template and the respetive tools. So, keep in touch on update.gavick.com.

Sugestion!!! g Make use of this option and learn the environment of The News II template, by making some tests locally, using a local server like (i.e. WampServer) or other available for free in the interner. This way, you be able to install, run and test easily all the potencial of this template. Well, let’s do it! If you follow this unique basic steps, your should not have any problems at all with the QuickStart installation.

Installation Steps for the QuickStart!!! version: Step 1) Unpack the compressed file QUICKSTART-october2008.zip inside of the _quickstart!!! folder and upload the content to your clean joomla website directory folder installation. The files inside are similar to a normal Joomla!1.5 package. Step 2) Create a new Database in your Website.

Step 4) After ending the installation, enter in the Administrator using Username “admin” and password “demo” (Naturally, you can change this values after!!!). If you go to your new Joomla Installation frontpage, you will see exactly as our demo. Now, you can start working on your own content and others changes.

THE NEWS II

Step 3) Make a normal Joomla J!1.5 installation using the upload files. Notice!!! You will see that it’s no necessary at this time to set your Username and Password, because they are already set.

Quick Guide Manual Installation

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

The News II Quick Guide Manual Installation For those who need to install the template manually and do not need further information, we present the following short cut step list for The News II installation.

Step 1 - Install the gk_thenews2.tgz file, using the Joomla Installer. Step 2 - Go to the Templates Manager and set the “The News 2” template to default. Step p 3 - Using the Joomla Installer, install the PhotoSlide Gk2 (com_gk2_photoslide.zip) and Tabs Manager GK2 (com_gk2_ tabs_manager.zip) components. Step p 4 - Go to the PhotoSlide GK2 administration (do not use the joomla installer!), select “plugins” menu and install the News Image 1 Plugin (plg_gk_news_image_1.zip). Don’t forget to enable this plugin!!! Step p 5 (Optional) - Go to the PhotoSlide GK2 administration, select “Extensions” menu and install the Rainbow Extension tool (ext_rainbow.zip). Don’t forget to enable this extension, if you want to use it. Step p 6 - Go the Joomla Installer! and install the News Image 1 module (mod_gk_news_image_1.zip). You now can start working by creating your slide groups on the PhotoSlide GK2 administration. Step p 7 - Go to the TabsManager GK2 Component administration, select “plugins” menu option and install Tab Mix GK1 Plugin (plg_tab_mix_gk1.zip) file. Don’t forget to enable this plugin!!! Step p 8 - Go to the Joomla Installer! and install the Tab Mix GK1 Module (mod_tabmix_gk1.zip). You now can return to the Tab Manager GK2 component administration and start working on your tabs groups.

THE NEWS S II

Step 9 - Using the Joomla Installer, install the News HighLighter GK1 Module (mod_gk_news_highlighter.zip)

Step 10 - Still with Joomla installer, install the Gk Embed Media Module (GK_Embed_Media_1.0.zip) Step p 11 - With all previous 10 steps done, your template have all the necessary files installed. If you need some orientation of the demo modules positions, please see the screenshot on the next page!

VICK VI CKPR CK PRO PR O GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

Demo Modules Positions

THE NEWS II

The following screenshot contains a resume list of the modules used on the demo template and the respective postions:

The News II Installation

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

The News II template installation Navigate to your Joomla! Administrator and enter in the administrative panel on your Joomla site. From the top menu, select Extensions > Install/Uninstall. Click the ‘browse’ button, select the template file (gk_thenews2_J!15.tgz) and press ‘Upload File & Install.’ A message will appear saying ‘Upload template - Success.’ This page will display an overview of the template, then select ‘Continue...’

THE NEWS II

After the template is sucessful installed, you must set it as your default template. To do that, navigate to Extensions > Template Manager and set the “The News II” Template as default joomla template.

With the template installed, next we are going to explain how to install the others files needed (components, modules and plugins).

Template Tools Installation and Configuration

VICK CKPR PRO O GA VICKPRO VICK C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

P PhotoSlide GK2 2 Installation and Configuration.

Tabs Manager GK2 Installation and Configuration.

News Show GK3 Module Installation and Configuration.

News HighLighter GK1 Module Installation and Configuration !

THE NEWS II

Please read the respective HelpFiles available on the -doc!!! folder.

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

GK Embed Media 1.0 Installation and Configuration Module Instalation Using the Joomla! Administrator, navigate to the administrative panel on your Joomla site. From the top menu, select Extensions > Install/Uninstall. Click the ‘browse’ button, select the module file inside the Modules folder (mod_gk_embed_media.zip) and press ‘Upload File & Install.’ A message will appear saying ‘Upload Module - Success.’ This page will display an overview of the module, then select ‘Continue...’

Module Configuration After successful module installation, from the Menu go to Extensions > Modules Manage and enter in panel configuration. Start by the Basic Module Parameters by configurating the following fields: Module Class Suffix: Provides the possibility of set a css class that allow’s individual module style. Module unique ID: Set here the unique ID of module. You can use more than one module on your Joomla! 1.5.3 website. For each one, this ID must be different. Media URL:

THE NEWS II

Here you must place the URL of the flash movie if Media Source Provider is available on the Drop Down Media Source Menu. (YouTube Example direct link: http://www.youtube.com/watch?v=VIDEO_ID). This URL will be automatically changed to http:// www.youtube.com/v/VIDEO_ID for the engine module script.)

! Important ! In Revver and Viddler Media Players, instead of URL as file ID, you must set as ID only the identification of the file. Example for a Viddler Media File URL: [viddler id=VIDEO_ID&w=437&h=288] the ID must only be the VIDEO_ID value and NOT THE LINK. For all available Media Source Players, the process is the same by setting the direct URL from the video flash.

Module Class Suffix: A su suffix suff ffffix ix ttoo be aapplied pplililied pp ed ttoo th thee cs csss cl cclass asss of tthe as he m mod module odul od u e (t ul (tab (table able ab le.m le .mod .m moduletable) odul od ulet ul etab et able ab le), le ), tthi this hiss al hi allo allows lows lo ws iindividual ndiv nd ivid iv iddua u l mo modu module dule du le ssty styling tylililing ty ng

GA VICKPRO VICK VI CKPR CK PRO PR O GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

Module Unique ID: Unique ID for module (must be unique if you have two or more modules Player width: on one page) The width of the media player (integer value - do not put px after). Set 0 if you want to use the default player width. Slides Group: Player height: For those se who already experienced the previous PhotoSlide GK1, (integer - do not putit’s px Thethat height of the remember we used an media integerplayer value to identifyvalue the group. Now, . Set 0 if groups you want to use the player because after) all the name available willdefault be show on aheight. drop menu. tthe one that you will use. Media Source:

runn

you differe Just se

List of Media Source available. Module e Width and Module Height: Heig If you want to set! Ifdifferent than isvalue set on your Mediawidth Source Player not available on ! Important Photoslide Administration Group. If not, just leave it and mantain this menu, you must choose “Other (...)” option and next on the0

t h value.

Advanced parameters, you must set the embed code, as we are going to show you in the following explanation.

Slide position (left and right):

T is another This nother new feature. feature It gives you the ppossibility to move the slide position inside the module area. With this option, you can customize By selecting one available Media Player on the Module different Parameters, styles display, playing with the background color and, for you may change it’s configuration on each Player. with the Ticks position. w

ima s o m examp

Naturally, if you pick the YouTube Media Player, the rest of the parameters from others are indifferent.

Show Text Block:

Eachoption MediaifPlayer provide us article the possibility set some Enable this you want show contenttolinked withdifferent slides. configurations, like size player or the Related Videos Option.

The final field “Advanced configuration of other player” is needed if you choose in Module Parameters a different Media Source Player, different from the available ones. Here you must place the code of the flash media URL

Important! Please, take note of this important notices: For Daily motion player options WIDTH and HEIGHT doesn’t works - We provide 3 sizes for the player size. Like we set before, other player option means every player which can be added by embed tag. So if you don’t know how the correctly code of the embed file, them we recommend you to drop this option and select a available Media Player.

THE NEWS II

Template Templ Templa p Parameters

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

You can set the template parameter by selecting the “The News II” template on Templates Manager. Press “edit” option and you be able to see the following parame parameters table. Color scheme: Set here your default style scheme for the “The News II” template (green - blue - red) options. Login button: Enable/disable the display of the login button interface. Menu type: Select the main menu type to by use on the frontpage. Menu name:

Menu opacity p y animation:

Set here the ID of the joomla menu that you want to use in the suckerfish menu.

Enable/disable the use of opacity animation in menu. IE6 alert:

Menu speed: Set the speed value of menu animation effects.

THE NEWS II

Menu animation:

Since we drop support for the old IE6 browser, you can enable this option to display a warning message to your website visitors, recommending the use of a different internet browser more current and secure.

Select here the type of animation effect transition, between 34 different styles.

Header position width:

Menu width animation: Enable/disable the use width animation in menu.

Set width of header module position - it must be value in px i.e. 572 . Width of position advert2 is a result of 882 header width. If you set this value as 0 then both columns will have 50% width (441px).

Menu height animation:

Style switcher:

Enable/disable the use height animation in menu.

Enable/disable the bottom style switcher.

Menu height animation: Enable/disable the use height animation in menu.

Typography - Green Style

GA VICKPRO VICK C R E A T I V E J O O M L A ! D E V E LLO OPMENT STUDIO

THE NEWS II

This page presents most of typographical aspects of ILife template, using the green style scheme. Make your readers happy with great Typography and User Experience!

Typography - Blue Style

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

THE NEWS II

This page presents most of typographical aspects of ILife template, using the green style scheme. Make your readers happy with great Typography and User Experience!

Typography - Red Style

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O

THE NEWS II

This page presents most of typographical aspects of ILife template, using the green style scheme. Make your readers happy with great Typography and User Experience!

THE NEWS II

Modules Positions

GA VICKPRO C R E A T I V E J O O M L A ! D E V E LO P M E N T S T U D I O