Installation PDF  Array Imprimer Array  Envoyer

The following is a guide that covers how to set up your new MediaMogul template on your Joomla site. Here you can find an overview of the files included in the MediaMogul release and instructions on installing and activating the template in your Joomla install.

Video Tutorial Currently Available!
Launch the Joomla Template Installation Video Tutorial now! (Requires Flash)

Downloading the MediaMogul Files

The first step is to download all of the files that will be needed to install your template, custom modules, as well make modifications. Here is a quick explanation of each of the available files in the MediaMogul release.
  • MediaMogul Template (rt_mediamogul_j15.tgz) This file is the template package you will use to install your template into Joomla.
  • MediaMogul Custom Extensions (mediamogul_extensions_j15.zip) This package contains each of the individual custom extensions included in the MediaMogul template release.
  • MediaMogul Source PNG's (mediamogul_sources.zip) This zip contains the source png's for making modifications and customizations to the images in the template as well as the logo font. There are additional sources for the transparent background, buttons, typography and headers. You will need an image editing software (preferably Adobe/Macromedia Fireworks) to utilize the Source PNG files.

Step 1 - Using the Joomla installer

Go to your Admin control panel for your site. In the Menu at the top, go to Extensions -> Install/Uninstall. Next browse for your rt_mediamogul_j15.tgz file you downloaded and then click Upload File & Install. Now MediaMogul is installed and in your template list. You should observe an introductory page in which you select Continue.
Joomla Template Install

Step 2 - Making MediaMogul your default template

Next, from your admin control panel, go to Extensions -> Template Manager. This will pull up the list of your installed templates. Find MediaMogul on the list and select the radio button to the left and then click Default up in the top right corner. Now MediaMogul is set as your default template. If you view your site, you should see the MediaMogul template up and running. Joomla Template Install
Tutorials PDF  Array Imprimer Array  Envoyer
Install MediaMogul
Installing MediaMogul

An overview of template files and instructions for installing and activating the template in Joomla. Read More...

Custom Modules
Custom Modules

Learn all about the included MediaMogul custom modules and how to configure them for your site. Read More...

Menu Options
Menu Options

An overview of the MediaMogul menu options including the top menu icon configuration. Read More...


A guide to the basic MediaMogul customization options that can be configured within the template "index.php" file. Read More...

Using Typography

A guide to using the included the MediaMogul typography styles in your site. Read More...

Demo Content
Demo Content

A look at some of the modules and techniques used in the demo content on the frontpage of the MediaMogul demo. Read More...

Logo Editing
Logo Editing

An overview for customizing your logo and replacing the logo text with your organization or company name and logo. Read More...


An overview of how to customize your MediaMogul in respects to the Internet Explorer PNGfix. Read More...

More MediaMogul Template Tutorials

Continue learning how to configure and customize the MediaMogul template with the following guides and tutorials available in the RocketTheme members forum board.

Menu Options PDF  Array Imprimer Array  Envoyer

MediaMogul features the exciting and exclusive RokMooMenu system for the ultimate in menu functionality and style, as well as the popular and reliable RTSplitMenu. An option for Suckerfish is also included. Here you can read an overview of the MediaMogul menu configuration options.

Video Tutorial Currently Available!
Launch the Joomla Menu Setup Video Tutorial now! (Requires Flash)

Selecting your Menu Style

MediaMogul allows you to choose from 3 menu options:

  • RokMooMenu - The exciting new menu system based on the ever popular Suckerfish menu style, featuring mootools powered transitions and effects.
  • Suckerfish - The versatile dropdown menu is now an option in combination with RokMooMenu to minimise library conflicts.
  • SplitMenu - Then venerable SplitMenu is a solid choice for navigation. It works by rendering the top-level menu options horizontally, and the submenu/child items are rendered in a module on the side.

You can designate which menu style you want to use on your site with a single control in the template's Admin interface at Admin > Extensions > Template Manager > MediaMogul


The Powerful & Popular RokMooMenu

Making its return this month is the immensely popular RokMooMenu. This menu has been developed from scratch using the latest and greatest MooTools JavaScript framework. The RokMooMenu is a highly advanced and fully customizable menu system. Some of the great features include:
  • Hover support for IE6 using the sfHover javascript class just like in Suckerfish.
  • Fully degradable to standard SuckerFish menu if javascript is not supported.
  • Configurable mouse-out delay to allow for accidental mousing out of the menu.
  • Completely customizable animation effects using MooTools transitions. Can be configured in X and/or Y directions.
  • Support for fade-in transparency
  • Experimental support for IE6 z-index bug using the iFrame hack.
An example configuration as used in the demo:
<script type="text/javascript">
window.addEvent('domready', function() {
new Rokmoomenu($E('ul.menutop'), {
bgiframe: false,
delay: 500,
animate: {
props: ['opacity', 'width', 'height'],
opts: {
fps: 100,
transition: Fx.Transitions.Expo.easeOut

Menu Settings

  • Bgiframe - Can be true or false. Only turn on if you are having problems with IE and z-index. This feature is experimental.
  • Delay - Defaults to 500ms. This is the how long you can mouse off the menu before it vanishes.
  • Props - These are the properties that will be applied to the menu. Can be any combination of opacity, width, height. The two properties, width and height are affected by the transition defined in opts.
  • Duration - the time in ms the animation will run for.
  • Fps - speed of the animation - leave at 100 for best results.
  • Transitions - any of the available MooTools transitions. See below for more details.
    For example, "Bounce.easeIn or Bounce.easeOut or Bounce.easeInOut" produce a bouncing effect.
moo-config For more details with diagrams, visit the Mootools documentation site

Creating dropdown menus for RokMooMenu and Suckerfish

To have specific menu items appear as sub items, you must assign them to the specific navigation item in which they will originate from. The following tutorial will show you how simple it is to create your ideal menu system.

Step 1 - Navigation

Once you have logged into the Joomla! Administration Area, you must navigate to the Menu area. Hover over the Menu item in the taskbar to show the dropdown menu. For this example, we are going into the mainmenu but the technique is exactly the same for all menus in the Administrative area.

Step 2 - The Menu Manager

You will then be transported to the Menu Manager for mainmenu. At this point, you can do 2 things. The first is to edit an existing menu item, which we will be doing in this tutorial or create a New menu item to be subordinate to an existing item. Click on the item you want to be part of the dropdown menu.

Step 3 - Assigning a Parent Item

You can now assign the content item to the mainmenu item in which you want to be in the dropdown menu. Identify the "Parent Item" section of the manager. You will select the item in which you wish to be the parent and the source of the dropdown menu. In this example, we have selected "Home".

<< Début < Précédent 1 2 Suivant > Fin >>

Page 2 sur 2
RocketTheme Joomla Templates