NOTICE: RocketTheme will be releasing templates for Joomla! 1.5 only starting January 2009. Read the thread…
RocketTheme  |  General  |  Member Sites  |  Topic: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF « previous next »
Pages: [1] Go Down Print
Author Topic: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF  (Read 5148 times)
JOEL R SILVA
Jr. Rocketeer
**
Offline Offline

Posts: 39


WWW
Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« on: February 09, 2006, 07:19:00 AM »

Hi guys,

I am the administrator of www.ue3brasil.com.br, a site dedicated to Epic Gamesīs Unreal Engine 3 technology. It has a OneMoreThing Template integrated with SMF 1.1 RC2. I also added a SWF banner rotating over the pages.

Any comments are welcome.

Joel Rodrigues - Mack
Logged


Melissa Rohr
Jr. Rocketeer
**
Offline Offline

Posts: 34

Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #1 on: February 10, 2006, 09:41:48 AM »

Hi Joel,
Love it, love it.

Can you tell us how you got the SWF banner to work here?
Logged
Cory Webb
Jr. Rocketeer
**
Offline Offline

Posts: 32

Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #2 on: February 10, 2006, 12:17:12 PM »

Looks great.... I'm wondering why you didn't move the header text over to the left???
Logged
JOEL R SILVA
Jr. Rocketeer
**
Offline Offline

Posts: 39


WWW
Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #3 on: February 13, 2006, 07:04:48 AM »

Hi Joel,
Love it, love it.

Can you tell us how you got the SWF banner to work here?

Hi Melissa,

Thanx for your comments. The SWF banner is simple:

1) Download the RANDOW SWF module from this link http://developer.joomla.org/sf/frs/do/viewSummary/projects.joomlalabs/frs. Look at this too http://forum.joomla.org/index.php/topic,9198.0.html;

2) After install the RANDOM SWF module (if you have some trouble, tell me), you just put all your SWF files in the same directory (pre-configurated in your module administration). Make sure that all your SWF files have the same width and height (to work properly);

3) In my case, as i am using the ONEMORETHING template, in the JOOMLA ADMINISTRATION, go to MODULES > SITE MODULES > RANDOW SWF > and  set the POSITION option to USER1 (take a look at the PARAMETERS in the botton of this page. They are very important);

4) The parameters of my site HTML and CSS are (JOOMLA ADMINISTRATION > SITE > TEMPLATE MANAGER > SITE TEMPLATES):

HTML:
Quote
<?php
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = split( '=', _ISO );
// xml prolog - quirks mode
//echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php
if ( $my->id ) {
   initEditor();
}
mosShowHead();
require($mosConfig_absolute_path."/templates/" . $mainframe->getTemplate() . "/md_submenu.php");

$forcehilite = false;  //index of button to force (0 -> #buttons-1)
$topnav = jwShowHorizMenu('mainmenu');
$sidenav = jwShowSubMenu('mainmenu');
$tabcolor = jwGetTabColor();
$hilightid = jwGetHilightid();


?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/css/template_css.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="<?php echo $mosConfig_live_site;?>/images/favicon.ico" />
</head>
<body id="page_bg" class="<?php echo $tabcolor; ?>">
<a name="up" id="up"></a>

<div class="center" align="center">
   <div id="wrapper">

      <div id="top">
         <div>
            <div>
               <span id="logo_header" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/images/omt_logo_header.png',sizingMethod='scale');"></span>
            </div>
         </div>
      </div>
      <div id="middle">
         <div id="middle_2">
            <div id="middle_3">
               <div id="middle_4">
                  <div id="navigation">
                     <div id="centernav">
                        <span id="topnav">
                           <?php echo $topnav; ?>
                        </span>
                        <div class="clr"></div>
                     </div>
                  </div>
                  <?php if (mosCountModules('user1') || mosCountModules('user1')) { ?>
                  <div id="showcase">
                     <table border="0" cellspacing="0" cellpadding="0" width="100%">
                        <tr valign="top">
                           <?php if (mosCountModules('user1')) { ?>
                           <td id="user1">
                              <?php mosLoadModules('user1', -2); ?>
                           </td>
                           <?php } ?>
                           <?php if (mosCountModules('user2')) { ?>
                           <td id="user2">
                              <?php mosLoadModules('user2', -2); ?>
                           </td>
                           <?php } ?>
                        </tr>
                     </table>
                  </div>
                  <?php } ?>
                  <div id="contentarea">
                     <table border="0" cellspacing="0" cellpadding="0" width="100%" class="contentarea">
                        <tr valign="top">
                           <?php if(mosCountModules( 'left' )) { ?>
                           <td id="leftnav">
                              <div id="lefttop">
                                 <?php echo $sidenav; ?>
                              
                                 <?php mosLoadModules('left', -2); ?>
                              </div>
                           </td>
                           <td>
                           <?php } else { ?>
                           <td id="leftborder">
                           <?php } ?>
                              <div id="pathway">
                                 <?php mosPathWay(); ?>

                              </div>
                              <div id="mainbody">
                                 <?php mosLoadModules('top', -2); ?>
                                 <?php mosMainBody(); ?>
                              </div>
                           </td>
                           <?php if (mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' )) { ?>
                           <td id="rightnav">
                              <div id="righttop"></div>
                              <div id="rightbody">
                                 <?php mosLoadModules('right', -2); ?>
                              </div>
                           </td>
                           <?php } ?>
                        </tr>
                     </table>

                  </div>

               </div>
            </div>
         </div>
      </div>
      
      <div id="bottom">
         <div>
            <div>Design by JamboWorks - November 2005 JWTC</div>
         </div>
      </div>
         
   </div>

</div>
<?php mosLoadModules( 'debug', -1 );?>
</body>
</html>



CSS:
Quote
/* custom stuff */
html {
  height: 100%;
  margin-bottom: 1px;
}

form {
  margin: 0;
  padding: 0;
}

body {
   margin: 0px 0px 0px 0px;
   height: 100%;
   font-size: 12px;
   background: #41566E url(../images/omt_bg_top.png) repeat-x;
}

a:link, a:visited {
   color: #AB290F;
   text-decoration: none;
   font-weight: normal;
}

a:hover {
   color: #c00;   
   text-decoration: underline;
   font-weight: normal;
}

p {
  margin-top: 0;
  margin-bottom: 5px;
  text-align: left;
}

div, p,  table, td, th {
   font-family: Lucida Grande, Verdana,Helvetica,Arial,sans-serif;
   line-height: 140%;
   color: #666;   
}

fieldset {
   border: 1px solid #d2d8de;
}

#wrapper div, #wrapper p, #wrapper table, #wrapper td, #wrapper th {
   text-align: left;
}




span.pathway {
   padding-left: 10px;
   color: #394048;
}


div.componentheading {
  padding-left: 0px;
}


a.readon {
   margin-top: 10px;
   padding-right: 10px;
   line-height: 14px;
   height: 16px;
}

h1 {
   padding: 0;
   font-family:Helvetica ,Arial,sans-serif;
   font-size: 18px;
   font-weight: bold;
   vertical-align: bottom;
   color: #666;
   text-align: left;
   width: 100%;   
}

h2, .contentheading {
   font-family: Arial Narrow, Helvetica Nueue, Helvetica, sans-serif;
   font-weight: bold;
   font-size: 16px;
   color: #2b3036;
}

h3 {
   margin: 0;
}

.componentheading, #mainbody h3 {
   margin: 0;
   margin-bottom: 10px;
   font-size: 11px;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
   text-transform: uppercase;
   color: #AB290F;
   border-bottom: 1px solid #D2D8DE;
}

#mainbody h3 {
   line-height: 140%;
   height: 140%;
   padding: 0;
   text-indent: 0;
}




table.blog td.contentheading {

}

table.contenttoc {
  margin: 5px;
  border: 1px solid #ccc;
  padding: 5px;
}

table.contenttoc td {
  padding: 0 5px;
}


td.buttonheading {
   
}

td.sectiontableheader {
  background: #efefef;
  color: #333;
  font-weight: bold;
  padding: 4px;
  border-right: 1px solid #fff;
}

tr.sectiontableentry1 td, tr.sectiontableentry2 td {
  padding: 4px;
}

td.sectiontableentry1, td.sectiontableentry2{
  padding: 3px;
}

table.contentpaneopen, table.contentpane {
  width: 100%;
}

div.moduletable h3 {
   margin-left: -8px;
   margin-right: -7px;
   border: 0px solid #f00;
   margin-bottom: 5px;
   height: 29px;
   line-height: 29px;
   font-size: 11px;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
   text-transform: uppercase;
   text-indent: 8px;
   color: #57616E;
}

#leftnav div.moduletable h3 {
      background: url(../images/omt_moduletitle.png) 0 0 repeat-x;

}

#leftnav div.moduletable {
   background: url(../images/omt_module_bg.png) 0 28px no-repeat;
}

#leftnav ul {
   padding-left: 0;
   margin-left: 12px;
}

#leftnav li {
   margin-bottom: 5px;
}

div.moduletable {
   padding-bottom: 15px;
   padding-left: 8px;
   padding-right: 8px;
}

.small {
   font-size: 10px;
   color: #999;
   font-weight: normal;
   text-align: left;
}

.modifydate {
  height: 20px;
  vertical-align: bottom;
   font-size: 10px;
   color: #999;
   font-weight: normal;
   text-align: left;
}

.createdate {
   height: 20px;
   vertical-align: top;
   font-size: 10px;
   color: #999;
   font-weight: normal;
   vertical-align: top;
   padding-bottom: 5px;
   padding-top: 0px;

}

.clr {
   clear: both;
}

#page_bg {
   height: 100%;
   padding: 0;
   margin-bottom: 1px;
}

div.mosimage {
  margin: 5px;
}

div.mosimage_caption {
  font-size: 10px;
  color: #666;
}

table.adminform textarea {
  width: 540px;
  height: 400px;
  font-size: 1em;
  color: #000099;
}

div.search input {
   width: 145px;
   border: 1px solid #ccc;
   margin: 15px 0 10px 0;
   
}

/** some content stuff **/
div#wrapper {
      height: 100%;
      margin-left: auto;
      margin-right: auto;
      width: 800px;
}

div#top {
   background: url(../images/omt_header_m.png) 0 0 repeat-x;
}

div#top div {
   background: url(../images/omt_header_l.png) 0 0 no-repeat;
}

div#top div div {
   background: url(../images/omt_header_r.png) 100% 0 no-repeat;
   height: 98px;
   position: relative;
}

span#logo {
   position: absolute;
   display: block;
   left: 35px;
   top: 28px;
   width: 100px;
   height: 91px;
   z-index: 90;
   background: url(../images/omt_logo_trans.png) 0 0 no-repeat !important;
   background: transparent;
}

span#logo_header {
   position: absolute;
   left: 135px;
   top:28px;
   z-index: 90;
   width: 242px;
   height: 60px;
   background: url(../images/omt_logo_header.png) 0 0 no-repeat !important;
   background: transparent;
}

span#joomla {
   position: absolute;
   right: 14px;
   top: 21px;
   z-index: 99;
   width: 151px;
   height: 140px;
   background: url(../images/omt_joomla_trans.png) 0 0 no-repeat !important;
   background: transparent;
}

div#middle {
   background: #fff url(../images/omt_shadow_r2.png) 100% 0 repeat-y;
}

div#middle_2 {
   background: url(../images/omt_shadow_r1.png) 100% 0 no-repeat;
}

div#middle_3 {
   background: url(../images/omt_shadow_l2.png) 0 0 repeat-y;
}

div#middle_4 {
   background: url(../images/omt_shadow_l1.png) 0 0 no-repeat;
   padding: 0 19px;
}

div#bottom {
   background: url(../images/omt_shadow_b.png) 0 0 repeat-x;
}

div#bottom div {
   background: url(../images/omt_shadow_bl.png) 0 0 no-repeat;
}

div#bottom div div {
   background: url(../images/omt_shadow_br.png) 100% 0 no-repeat;
   height: 44px;
   padding-top: 5px;
   font-size: 10px;
   color: #A2A7A9;
   text-align: center;
}

div#navigation {
   height: 28px;
   background: url(../images/omt_buttonbar.png) 0 0 repeat-x;

}

div#centernav {
   margin: 0 auto !important;
   margin: 0;
   display: table !important;
   display: block;
   text-align: center;
   
}

/* this is not xhtml compliant but works in ie/firefox */
span#topnav {
   padding: 0;
   white-space: nowrap;
   display: table-cell !important;
   display: inline-block;
}

/** tab menu stuff **/
#topnav ul#mainlevel {
   float: left;
  padding: 0;
  margin:0;
  list-style: none;
  border-left: 1px solid #959A9E;
  border-right: 1px solid #ECF4FA;
}

#topnav #mainlevel li {
   float: left;
   margin: 0;
   padding: 0;
   border-right: 1px solid #959A9E;
}

#topnav #mainlevel a:link, #topnav #mainlevel a:visited {
   font-size: 11px;
   font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
   text-transform: uppercase;
  color: #2B3036;
   float:left;
  display:block;
   padding: 0 30px;
   height: 28px;
   line-height: 28px;
  text-decoration: none;
   background: url(../images/omt_button_off.png) 0 0 no-repeat;
   border: 0;
}

#topnav #mainlevel li.red_active_menu {
   border-right: 1px solid #721901;
}

#topnav #mainlevel li.red_active_menu a:link, #topnav #mainlevel li.red_active_menu a:visited {
   background: url(../images/omt_button_on.png) 0 0 no-repeat;
   color: #EEF0F2;
   float:left;
      padding: 0 30px;
   height: 28px;
   line-height: 28px;
}


#topnav #mainlevel a:hover {
  color: #616B78;
}

#topnav #mainlevel li.red_active_menu a:hover {
   color: #fff;
}

#showcase {
   margin: 0;
   padding: 0px 0;
        padding-left: 0px;
   padding-top: 0px;
        margin-top: 0px;
   margin-left: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
   background: #dcdfe1;
}

/*
turned OFF disable header in showcase area
#showcase .moduletable h3 {
   display: none;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin: 0;
   padding: 0;
   margin-top: 0px;
   margin-left: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
}
*/

#showcase .moduletable {
   padding: 0;
        padding: 0px 0px;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin: 0;
   margin-top: 0px;
   margin-left: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
}

#showcase td, #showcase div, #showcase p, #showcase span {
   color: #D8DBDE;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin-top: 0px;
   margin-left: 0px;
        margin-right: 0px;
   margin-bottom: 0px;
   padding: 0;
}

#showcase .contentheading {
   font-family: Arial Narrow, Helvetica Nueue, Helvetica, sans-serif;
   font-weight: bold;
   font-size: 16px;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
   padding: 0;
}

#user1 {
   width: 50%;
        margin-top: 0px;
        margin-left: 0px;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
   padding: 0;
}

#user2 {
   width: 50%;
   width: 50%;
        margin-top: 0px;
        margin-left: 0px;
        padding-left: 0px;
   padding-top: 0px;
        padding-right: 0px;
   padding-bottom: 0px;
   margin-bottom: 0px;
        margin-right: 0px;
   padding: 0;
}

table.contentarea {
   background: url(../images/omt_body_right.png) 100% 0 repeat-y;
}


#leftnav {
   width: 180px;
   border: 0px solid #ff0;
   background: url(../images/omt_column_left.png) 0 0 repeat-y;
}

#leftborder {
   border-left: 1px solid #D3D8DE;
}

#lefttop {
      border: 0px solid #00f;
}

div#mainbody {
   border: 0px solid #0ff;
   padding: 12px;
}

#rightnav {
   width: 180px;
   border: 0px solid #00f;
   background: url(../images/omt_column_right.png) 100% 0 repeat-y;
   
}

#righttop {
   background: url(../images/omt_bodytop_r.png) 0 0 no-repeat;
   height: 29px;
}

#rightbody {
   background: url(../images/omt_rightnav_bg.png) 0 0 repeat-x;
}

#pathway{
   background: url(../images/omt_bodytop.png) 0 0 repeat-x;
   padding-top: 5px;
   height: 29px;
}

#leftnav ul.submenu, #leftnav ul.submenu ul {
   list-style:none;
   margin: 0;
   padding: 0;
}


#leftnav ul.submenu li {
   background: none;
   padding: 0;
   margin: 0;
}

#leftnav ul.submenu ul li {
   text-indent: 10px;
}

#leftnav ul.submenu ul li {
   text-indent: 20px;
}

#leftnav ul.submenu ul ul li {
   text-indent: 30px;
}

#leftnav ul.submenu ul ul ul li {
   text-indent: 40px;
}

#leftnav ul.submenu ul ul ul ul li {
   text-indent: 50px;
}

ul.submenu a:link, ul.submenu a:visited {
   display: block;
   width: 147px;
   padding-right: 15px;
   padding-bottom: 5px;
   background: url(../images/omt_menu_red.png) 100% -2px no-repeat;
}

ul.submenu a:hover {
   background-position: 100% -53px;
   text-decoration: none;
}

a.mainlevel:link, a.mainlevel:visited {
   display: block;
   width: 147px;
   padding-right: 15px;
   padding-bottom: 5px;
   background: url(../images/omt_menu.png) 100% -2px no-repeat;
}

a.mainlevel:hover {
   background-position: 100% -53px;
   text-decoration: none;   
}

div#footer {
   margin-top: 10px;
   width: 766px;
   height: 28px;
   line-height: 28px;
   text-indent: 20px;
   background: #e6eef8;
}

div#footer table {
   margin-top: 4px;
}

div#footer table td {
   text-align: center;
}

div#footer a {
   padding: 0 10px;
}






div#topmodule {
   position: relative;
   margin-top: 20px;
   margin-bottom: 20px;
   height: 80px;
   overflow: hidden;
}

div#quote {
   padding-top: 10px;
   margin-right: 10px;
   text-align: left;
   float: right;
   width: 505px !Important;
   width: 485px;
}

div#quote td {
   text-align: left;
}

table.menublock {
   margin: 0 15px;
}

td.summary {
   background: #eef3f9;
   padding: 5px;
   padding-left: 10px;
}

td.latestnews {
   background: #eef3f9;
   padding: 5px;
}




/* some page content things */

table.blog span.article_seperator {
   display: block;
   height: 20px;
}

table.nopad {
   width: 100%;
   border-collapse: collapse;
   padding: 0;
   margin: 0;
   margin-bottom: 15px;
}

table.nopad td.middle_pad {
   width: 20px;
}

body.contentpane {
   background: #fff;
}


Hope this help you...

Best regards Melissa!


Joel Rodrigues
« Last Edit: February 13, 2006, 07:06:28 AM by JOEL R SILVA » Logged


JOEL R SILVA
Jr. Rocketeer
**
Offline Offline

Posts: 39


WWW
Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #4 on: February 13, 2006, 07:08:41 AM »

Looks great.... I'm wondering why you didn't move the header text over to the left???

Hi Cory,

Thx for your comments... I like the MENU text in the middle (like that). ROCKETTHEME website also put in the same way.

Best regards.

Joel Rodrigues
Logged


Daniel Paz
Newbie
*
Offline Offline

Posts: 7

Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #5 on: February 13, 2006, 09:10:55 PM »

Well Done!! The Flash looks great, thanks for the tips on that, I will definitely find a use for it in the future Smiley

DP
Logged
zerolight
Jr. Rocketeer
**
Offline Offline

Posts: 39


Re: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF
« Reply #6 on: February 14, 2006, 09:10:09 AM »

Looks great.... I'm wondering why you didn't move the header text over to the left???

Hi Cory,

Thx for your comments... I like the MENU text in the middle (like that). ROCKETTHEME website also put in the same way.

Best regards.

Joel Rodrigues

I think he meant the unreal logo text. Moved more to the left. Looks good anyway. Nice one.
Logged
Pages: [1] Go Up Print 
RocketTheme  |  General  |  Member Sites  |  Topic: Unreal Engine 3 Brasil - www.ue3brasil.com.br - OneMoreThing + SMF « previous next »
Jump to:  

Viagra