JA Uvite – Userguide

Forums    Joomla Templates Club    JA Uvite    JA Uvite - Userguide
Viewing 1 post (of 1 total)
  • Author
    Posts
  • Hung Dinh Friend
    December 3, 2008 at 5:05 am #135891

    JA Uvite – Userguide for Joomla! 1.0.x

    • For users who start your Joomla! site at the beginning, I recommend you using QuickStart package of JA Uvite, named as qs_j1015_ja_uvite.zip. For instruction how to use JoomlArt quickstart package, please check the QuickStart guide
    • For users who new to Joomla!, there are many useful documents available at http://joomla.org about Joomla! and how to use, please spend some time to check them out.

      • Here is some other guides that may useful for you:

    • For users that already have a site with contents and other extensions installed, please follow my instruction below to understand how JA Uvite works:

    I. TEMPLATE

    1.1 Template Installation

    After downloading JA Uvite package and extract it, you will find template package named: tpl_uvite_j1.0.zip

    Proceed installation of JA Uvite as other normal Joomla! templates. If you don’t know how to do installation or set a template as default, please check the How to install Joomla! template guide.

    After installing and setting JA Uvite as default template, your site should look like this:

    To see position located in site, in Navigation toolbar input string “?tp=1” at the end of site link

    1.2 Template Configuration

    To configure JA Uvite template, check How to configure Joomla! template guide!

    You can change all JA Uvite parameters as you wish.

    1. Logo type: Logo display in site, has two type: Image and Text
    2. Logo text: text displayed in logo if you choose Logo type is Text.
    3. Slogan: Slogan displays below logo
    4. Font size : Increase/Decrease font size (from 1 to 6).
    5. Template Width: type of template screen (Wide/Narrow screen)
    6. Color Variation: 3 color themes (Default, Blue and Violet)
    7. Show Font tools: Show/Hide font tools
    8. Show Color tools: Show/Hide color tools
    9. Enable rounded style: Rounded style for blog, this style not applied for IE6. When you enable rounded style, blog will be convert from square to round.

      10. —>

    10. Date format: format of date displayed on articles of JA News module
    11. Menu Type: type of menu displayed in site (Mainmenu/Topmenu…..)
    12. Menu Module: include Disable/Split/Css/Moo menu.

    Please keep your mouse hover each parameter to see description in details.
    JA Uvite module positions are available here You just need to configure your modules to be loaded on those positions to match JA Uvite style.

    If you don’t know how to create module position in Joomla!, please follow this guide

    II. EXTENSION INSTALLATION

    When extracting JA Uvite package, you will see the folder named Extension with all extensions built in the JA Uvite, including JA News FrontPage, JA News, JA Highslide, JA Tabs, JA Bulletin modules and JA Highslide, JA Tabs mambots. That means when you install via template installer, you need to install modules JA News FrontPage, JA News, JA Highslide, JA Tabs, JA Bulletin and mambots JA Highslide, JA Tabs separately, then configure their positions as instructed in Template configuration section.

    You check How to install Joomla! module guide and How to install Joomla! mambot guide for installation.

    Extensions built in JA Uvite comprise:

    Note: [xx] stands for module position

    • [ja-news] JA News Frontpage module
    • [ja-news] JA News module
    • [user5] JA Highslide module
    • [user5] JA Tabs module
    • [user1, user2] JA Bulletin module
    • JA Highslide mambot
    • JA Tabs mambot

    And extension details as follow:

    2.1. JA News Frontpage module(mod_janews_fp_j15.zip)
    [position: ja-news]

    The purpose is rearrange frontpage contents (article choose to display on frontpage) of Joomla into Headline layouts like news portal. You can choose among 2 options layout: Default_fp and Headline_fp.

    On demo, it looks like:


    In Admin panel, please go to Modules >> Site Modules and click on module name (mod_newsfp) to go to configuration page.

    Here is the setting of JA News Front Page on demo:

    Parameters Explanation:

    • Module Class suffix: A suffix to be applied to the css class of the module (table.moduletable), this allow individual module styling
    • Hidden classes: Classes that have property such display: none. Separated by |
    • Number of news: Total number of news shown in headline, applied to both layouts.
    • Number of Featured news: Feature news is the newest articles and take most of the place of area, should be 1 if you use default_fp.php layout and 5 if you use headline_fp.php
    • Max chars of Featured news: Maximum number character displayed on featured news.
    • Show image on Featured news: Show/Hide image on featured news
    • Featured news image width: Fixed width of image in pixel (set to -1 if you want to leave image’s default size).
    • Featured news image height: Fixed height of image in pixel (set to -1 if you want to leave image’s default size).
    • Max chars of normal frontpage news: Maximum number character displayed on normal frontpage news.
    • Show image on normal frontpage news: Show/Hide image on normal frontpage news.
    • Normal news image width: Fixed width of image in pixel (set to -1 if you want to leave image’s default size).
    • Normal news image height: Fixed height of image in pixel (set to -1 if you want to leave image’s default size).
    • Layout style: Layout for displaying Frontpage news as headline. If you choose different layout, please change configuration of the other above parameters. If you choose headline_fp.php layout, you can configure more in below parameters
    • Headline Text: Text of headline
    • Show Headline Tools: Show/Hide the tools button on Headline
    • Show Headline News Title: Show/Hide the title of headline news
    • Show Headline Readmore: Show/Hide Readmore button on the headline
    • Headline Fixed Height: Fixed height of headline in pixels. Use 0 if you want the headline has flexible height.
    • Auto Roll: Roll the headline news automatically
    • Rolling delay time: Time rolling between two article on seconds.

    2.2. JA News module(mod_janews_j15.zip)
    [position: ja-news]

    On demo, it looks like:

    In Admin panel, please go to Modules >> Site Modules and click on module name (mod_janews) to go to configuration page.

    Here is the setting of JA News on demo:

    Parameters Explanation:

    • Module Class suffix: A suffix to be applied to the css class of the module (table.moduletable), this allow individual module styling
    • Article order: Order by created date or modified date.
    • Group by category or section: News displayed on front page grouped by Category or Section
    • Category (Section) ID: News belongs to Category (Section) ID will be displayed on front page. Set Category (Section) ID line by line. In each line you can put ID and color theme separated by a colon. Syntax for this is: <ID>:<color>, for example:
      13:red

      • 14:orange
      8:deepblue
      12:cyan
      5:green
      9: pink
      11:lime

    • Show category (Section) title: Show/Hide category (section) title.
    • Intro items: Number of intro items
    • Link items: Number of link items
    • Max chars: Maximum character number displayed
    • Show image: Show/Hide news’s image
    • Image Align: Set align of image
    • Auto resize: Auto resize image or not
    • Show front page article: Show/Hide front page article
    • Image width: Fixed width of image in pixel (set to -1 if you want to leave image’s default size).
    • Image height: Fixed height of image in pixel (set to -1 if you want to leave image’s default size).
    • Columns: Number of column per row (Set to zero if you want to disable other news items)
    • Show readmore: Show/Hide Readmore button on news

    2.3. JA Highslide module(mod_jahighslide_j15.zip)
    [position: user5]

    On demo, it looks like:

    In Admin panel, please go to Modules >> Site Modules and click on module name (mod_highslide) to go to configuration page.

    Here is the setting of JA Highslide on demo:

    Parameters Explanation:

    • Module Class Suffix: A suffix to be applied to the css class of the module (table.moduletable), this allow individual module styling
    • Type: Type of the highslide
    • URL: URL of the element: Example, gl-1.jpg, gl-2.jpg…for Slideshow Caption and Slideshow Controlbar or gl-1.jpg for Image or gl-1.swf for Flash or http://google.com for Frame and Ajax
    • OR Path Folder (for slideshow): Folder of the element
    • Item id: enter ID of the article in case you choose type of highslide is Item
    • Position: Enter position of the module in case you choose type of highslide is Modules
    • Module name: choose type of module in case you choose type of highslide is Module
    • Content id: Enter Id of content, example: 1 in case you choose type of highslide is HTML
    • Content: content of HTML

    To understand the JA Highslide string syntax, please follow this link: JA Highslide Userguide

    2.4. JA Highslide Mambot(mab_jahighslide_j15.zip)

    JA Uvite came with JA Highslide Mambot, for the syntax of JA Highslide and how to use it, please follow this guide here:
    JA Highslide Userguide

    Notes: to display JA Highslide module on front page, you must enable JA Highslide mambot first

    2.5.JA Tab module(mod_jatabs.zip)
    [position: user5]

    JA Tabs module used to display your specific content, categories, section as well as modules in TABS. You can specify module position to display, or using JA Tabs syntax for advanced features

    On demo, it looks like:

    In Admin panel, go to Modules >> Site Modules and click on module name (JA Tabs for joomla 1.0.x) to go to configuration page.

    Here is the setting of JA Tabs on demo:

    You can select what will be displayed in JA Tabs block. It can be modules, Article ID, Articles-Category ID or content.

    • If Modules selected, you can input module position into the textbox Select an position box. All modules from that position will be displayed in tabs.
    • If Content selected, you can input your JA Tabs string to the Enter content code textarea.
    • If Module selected, you can input list of module to the textbox Module list
    • If Article ID selected, you can input list of Article IDs into textbox Article ID list. All articles which have inputted ID in textbox will be displayed in tabs.
    • If Articles-Category ID selected, you can input list of Category IDs into textbox Category ID. All articles which have inputted category ID will be displayed in tabs.

    To understand the JA Tabs string syntax, please follow this link: JA Tabs Userguide

    2.6. JA Tab mambot (mab_jatab.zip)

    JA Uvite came with JA Tabs mambot, an advanced tool in creating and presenting your content as well as modules on front page. All of them can be well align in tabs.

    For the syntax of JA Tabs and how to use it, please follow this guide here:
    JA Tabs Userguide

    Notes: to display JA Tabs module on front page, you must enable JA Tabs mambot first

    2.7. JA Bulletin module(mod_jabulletin.zip)
    [position: user1, user2]

    This module covers 2 default Joomla! modules: Latest and Mostread module. By that mean, you could show latest articles or most popular articles. You can copy the module into multiple instances (For example, in JA Uvite demo, 2 instances of the module are used, one to show latest news, one to show most popular articles). The module also supports to show image and updated date.

    On demo, it looks like:

    In Admin panel, please go to Modules >> Site Modules and click on module name (mod_jabulletin) to go to configuration page.

    Here is the setting of JA Bulletin on demo:

    Parameters Explanation:

    1. Type: Show Latest articles or Most read articles.
    2. Module Class Suffix: Style of module
    3. Enable Cache: Yes/No option
    4. Module Mode: is description mode of module: three mode: Content Items only/Static Content only/Both
    5. FrontPage items: Show/Hide frontpage items
    6. Count: number of article will be displayed
    7. Category ID, Section ID: Input category/section ID, that means published articles belong to Category/Section will be displayed
    8. Show Image: If enabled, an image in each article will be retrieved and shown. The image will be resize to the input size in next parameters.
    9. Image Width: resized image width
    10. Image Height: resized image height
    11. Show Date: Show/Hide last updated date.
    12. Date format: format of date.

    III. SETTINGS LIKE DEMO

    And now, i will instruct you setting your site look like our demo.

    1. JA Highslide module is set Title is New idea and on user5 position. You only need copy your image into image path: your_site_path/images/stories/gallery and input name of images (sam-1.jpg,sam-2.jpg,sam-3.jpg,sam-4.jpg,…) into URL param of Highslide module parameters. Note that you can change image path as belows:
      • Go To Mambots >> Site Mambots >> choose Highslide for Joomla! 1.0 to go to JA Highslide plugin parameter page.
      • You can set image path on Path Thumbnails Image param as you wish.
  • JA Tabs module: Please follow these steps to create JA Tabs like demo
    1. Create a new module position named: jatabs (follow this guide to create module position)
    2. Install JA Tabs module and mambot
    3. Publish JA Tabs mambot
    4. Go to JA Tabs module parameter: put on user5 position
    5. Set parameters: Type tabs: Modules and Select a position: jatabs (that means: modules on jatabs position will be displayed on JA Tabs module).
    6. Use Custom module to create three articles: WORK FOR US, WEB SHOWCASE and FEATURES and set on jatabs position (You can see How to create Custom module)
    7. On JA Tabs module parameter, choose Default style: uvite
    8. Now, your JA Tabs is similar to our demo
    9. JA Bulletin show lastest and most popular articles on user1 and user2 position. Follow these below steps to create JA Bulletin:
      • Install JA Bulletin module
      • Go to JA Bulletin parameter, set Title is Lastest News and position is user1
      • Choose Type: Lastest news and set other parameters. So newest articles will be displayed on user1 position
      • On Module Manager panel, tick Lastest News and choose Copy to copy module.
      • Go to Copy of Lastest News module, set Title is Post, set on user2 position and on parameter, choose Type: Most read. So articles that are most read will be displayed on user2
      • position.
    10. Log in module: Go to Admin panel >> Modules >> Site Modules >> click Login Form >> Publish this module and set on right position. You will have a login forum like demo
    11. Statistics module: Go to Admin panel >> Modules >> Site Modules >> click Statistics module >> Publish this module and set on left position.
    12. Custom module to create content for Recent project module, set on right position
    13. Custom module to create content for Tags cloud and About author on user7, and user7 positions

    You can check How to create Custom module guides for more details.

    After that, your site will be:

    IV. TYPOGRAPHY

    JA Uvite came with a rich typography to give users more ability to customize content look and feel. Please check all JA Uvite typography here at JA Uvite Typography

    V. FREQUENTLY ASKED QUESTION

    Q: I want to add a template position in to my Joomla!
    A: Go to your Administration Panel, Site -> Template Manager -> Module Positions. Add your template positions and hit the Save button.

    Q: Where can I change my footer?
    A: If you want to change or remove something in the footer, just open the “ja_justicia/footer.php” then modify it to suite your needs.

    Q: My images take a lot of white space and do not look good?
    A: The {mosimage} may show some extra padding and margin. To solve this problem, go to your Joomla! Administrator -> Mambots -> Site Mambots and change the margin and padding parameters of MOS Image mambot to 0.
    Q: Images without caption are stuck with text?
    A: It is because Joomla! generates the code different when {mosimage} has and doesn’t have its caption. So when you decide that the image will not having a caption, put it between the div tag like this <div class=”mosimage” style=”float: left;”>{mosimage}</div>

    Q: What’s a module style? And module class suffix?
    A: Almost modules offer you a parameter called Module Class Suffix. Set a value for this parameter and you will have your module’s appearance differs from the others. JA templates often provide you some module styles which can be found in Module Styles area of the guide.

  • Author
    Posts
    • Viewing 1 post (of 1 total)

    This topic contains 1 reply, has 1 voice, and was last updated by  Hung Dinh 15 years, 11 months ago.

    We moved to new unified forum. Please post all new support queries in our New Forum

    Important Notice :

    New Unified Portal is live

    Must Read

    Jump to forum

    Categories