OutlineOmega (multi for 115,116,117 & TP)

[Antechinus]

I can't see anything wrong with your code so I suspect it's either a cache/cookies roblem or the new fie didn't take properly. I'd try clearing cache and cookies and doing the ol' hard refresh (Ctrl+F5). If it still looks funny overwrite the file again. Come to think of it you might as well just do that anyway.

The only limit to the number of tabs is the width of your screen. In practice this means it's always a good idea to check your theme using a 1024 resolution, since that's still the most common size. As an example, myself and my co-other admin run 1280's but I check things on a 1024 with a standard member account just to make sure. The extra admin buttons (two of them) mess things up on a 1024 but the members don't see them so it looks fine to them.

[genieuk]

Nope tried what you said and still no good.

When you say overwrite file how do you mean? what file etc?

I basically removed the links code from index.template. redone it, cleared cache, cookies etc, done hard refresh and no joy.

I am also glad you mentioned the wide as your screen bit, i did not think of that, i just tried my site on the 1024 resolution and god it looks big, my resolution is 1600 x 900 as i have a 16.9 inch screen.

Would you do me a favour and look and see what it looks like on your 1024 resolution? reason why as my screen is widescreen it will look better but to a members view it may look terrible.

to show all menu tabs login using

Username: freddy
password: 12345678

If you dont mind as it hard for me to check if all displays ok as i am using widescreen and unusual resolution and screen size.

I would be grateful if you could tell me what it looks like.

Thank you
Mathew

[genieuk]

Hi, if you could answer above question, i am not being inpatient it just i am posting this now aswell so you see my last aswell.

I have allowed users to change there theme as outline omega has 11 themes built into it, to change theme members have to click on links rite on top of the forum, problem is they are very hard to see, is it possible that i can change the colour of them? the names of the themes are like a dark blacky grey and almost blends in with the backgrounds.

If so which file to change colour?

Thanks
Mathew

[Antechinus]

Looks fine to me on both 1280 and 1024. No problems.

The changer buttons are set to blend with the background because I like 'em like that. Looks smooth and uncluttered when you don't want 'em and they light up on hover when you do want' em.

If you want to change them it's no big drama. At the end of every named css file (like style_AzureSilk.css) you'll see this:

Code Select Expand

/* Changer buttons. */

.changer {
color:#1D1F9F;
background: transparent;
border: 1px solid #1D1F9F;
}

.changer:hover {
color: #EFF0FF;
background: #000E5F;
border: 1px solid #A8AECF;
}

The first class is the default (off hover) setting and the second class is, yep you guessed it, the lighty up colours for mouseover. Mess around with them to your heart's content.

ETA: The Simple Portal copyright is breaking the theme's footer. Give them a hard time about it. It shouldn't break themes.

[genieuk]

Thanks,

glad it shows ok. Yeah it does ruin the look the simple portal copyright. I will try in a bit to change colour of links

Thank you,
Mathew

PS: just replied to thread to ask vgamer about the links button as it still the same, i also told him that it nothing to do with theme as i asked you, it is so confusing, i think i will create another button in a bit and see if that ok, if it is then something to do with the links mod if not then has to be something to do with theme somewhere.

[genieuk]

Hi,

You know where people can change the theme style, rite above everything, i mean change from outline to outrageous etc. well those links i want to add another one to the list,

which file and where by in the file so i can add another one , reason why i am using the lo-fi mod and want to add it to the list so people can quickly switch to lo-fi version if wanted.

Thank you
Mathew

[Antechinus]

No problem. There are two places where that is set. The first is in index.template.php. In an unmodified 1.1.6 file it starts on Line 265.

Code Select Expand

{
if (isset($settings['allow_color_change']) && $settings['allow_color_change'] == 'bars')
echo '
<form action="', $scripturl, '" method="post">
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="AzureSilk"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Clearlight"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="KindaBlue"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="MidnightSun" name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Mircalla"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Outline"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Outrageous" name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="SilverMist"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Skyline"          name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Ultraviolet"      name="options[theme_color]" />
<input style="cursor: pointer; font-size: 9px;" type="submit" class="changer" value="Verdigris"      name="options[theme_color]" />
</form>';
}

You can add or delete lines from this section to add or remove options. Just copy one of the lines and change value="MidnightSun" to whatever name you wish to use.

The other place is in Settings.template.php and the procedure is the same. This starts on Line 113:

Code Select Expand

array(
'id' => 'theme_main_color',
'label' => $txt['theme_main_color'],
'options' => array(
        'AzureSilk'   =>    'AzureSilk',
                    'Clearlight'  =>     'Clearlight',
                    'KindaBlue'   =>   'KindaBlue',
'MidnightSun' =>  'MidnightSun',
                    'Mircalla'    =>      'Mircalla',
'Outline'     =>      'Outline',
                    'Outrageous'  =>  'Outrageous',
'SilverMist'  =>     'SilverMist',
'Skyline'  =>        'Skyline',
'Ultraviolet' =>      'Ultraviolet',                                 
'Verdigris'   =>     'Verdigris',
                                       
),
),

ETA: Note that this is for adding or removing theme variants. If the mod itself requires extra code you'd best ask the person who made it. For instance I suspect you'll have to change some of the code in index.template.php. The name="options[theme_color]" code may not be appropriate. As I'm not familiar with the mod itself I can't advise you on that.

Anyway, for people who do want to add an extra variant to the theme you'll also need a named css file for it (IE: style_newvariantname.css)  and an images folder with the same name.

[genieuk]

Hi,

from reading in "SMF Support 1" board, are you saying the drop menus on that theme has now changed and been improved?

if so can i update or find out what i need to do for edits?

Thank you,

Mathew

[Antechinus]

I haven't updated the 1.1.6 theme yet because I've been working on converting it for SMF 2, which quite frankly involves just a bit of work and all.

At the moment the SMF 2 theme is my priority because really SMF 2 is going to be the next big thing. It is so much more advanced than 1.1.x and I'll be changing over very soon.

Currently I'm tossing up on whether or not it's worth redoing the 1.1.x version of the theme. I'm inclined not to, but I may do it after the SMF 2 version is thoroughly sorted. It would complicate the support process for me though because then I'd have two separate 1.1.x themes to support. The difference is largely aesthetic, in that with the newer menu system the currently selected tab stays highlighted like a normal SMF menu. So IMO it looks nicer but in terms of actual functionality there is no real difference.

[genieuk]

Please Help 

I have two friends,

one uses XP and IE7 and they also use FireFox (all latest versions), when they hover mouse over menu tabs no drop menus shows in both browsers.

Now my other friend uses XP and Slim Browser she is also having same problem. (she has latest version of slim browser)

I find it strange thou as i have Vista and tested IE7, FireFox and Slim Browser and no problems on my computer.

I am concerned maybe this is happening to most of my visitors and could be causing people not to register etc.

What can i do as people are not able to see the drop menus?

I will pay if it means altering the code to a better more supported drop menu system.

Thank you,
Mathew

[Antechinus]

I have no idea what their problem is, because the theme was designed and tested on XP with Firefox 3, IE 6 and 7, Safari and Opera. The only thing I can think of is that they never clean out their cache and cookies. Some people are like that. In that case since you have been altering the code fairly frequently their old cache could be messing up the display for them.

Have you asked them about this? If they're the sort of people who don't even know where to find and clear their cache this is the most likely explanation.

Ask them. If they haven't been clearing their browser tell them how to do it. See if that helps. Don't forget the hard refresh.

[Antechinus]

Instructions for the javascript preload code are in this post.

Note that the script will only preload images if you get the paths to them correct. So as an example if you wanted to preload the drop menu images for the Azure Silk variant in Omega you'd need to add these to the array:

"/images/AzureSilk/submenu_top.png",
"/images/AzureSilk/submenu_bg.png",
"/images/AzureSilk/submenu_bottom.png"

Also note that you should only preload the images you need to. Don't get carried away trying to preload every image on your site, because nothing else will render until they have loaded. Some small menu images don't slow things up noticeably. 

[genieuk]

Thanks,

Just two things,

I have all the themes that come with outline omega enabled so people can choose between them, will it be ok to add all the drop menus for each theme to the script? or am i asking for trouble?

also do i just add it to custom theme index.template.php only?

Thanks,
Mathew

Also where it says find:

Code Select Expand

echo '
</head>
<body>';
}

that is not in my custom theme index.template.php,

[Antechinus]

Yes you just add it to the index.template.

Because there are so many images in total in Omega I'd start by just loading all the submenu_bg images. That will at least give the background to the drop menu text instantly, which is what is really required. The fancy rounded bits will sort themselves out while the menus are being used.

Of course you can add all the others as well if you like. Given that they're only very small images I wouldn't think they'd have much of an effect on your load time but I haven't done any testing on that.

ETA: Just add it before the </head> tag. You'll also need to add the required '; after the existing </script> or the echo' for the new code will cause a parse error. Do it like this:

Code Select Expand

echo '
document.getElementById("upshrink_ic").src = smf_images_url + '  . '"/'. $settings['theme_main_color'] . '" + (mode ? "/expand.gif" : "/collapse.gif");

document.getElementById("upshrinkHeaderIC").style.display = mode ? "none" : "";

current_header_ic = mode;
}
// ]]></script>';

echo '
    <script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
      var PreloadImages = new Array(
         "/images/submenu_top.png",
         "/images/submenu_bg.png",
         "/images/submenu_bottom.png"
      );

      var myImages = new Array();
      for(var i = 0; i < PreloadImages.length; i++)
      {
         myImages[i] = new Image();
         myImages[i].src = "'. $settings['theme_url'] .'" + PreloadImages[i];
      }
    // ]]></script>';

echo'

</head>
<body>

[genieuk]

If you dont mind will you add the script for me in my file and i then just go ahead and edit the urls for the images?

dont want to mess it up.

Cannot attach file but you can download it here: and then once edited attach it to your post for me please.

LINK TO DOWNLOAD


Thanks
Mathew

[Antechinus]

Done.

[genieuk]

Thank you,

Just one more thing, sorry.

where it says for example in code:

"/images/submenu_top.png",

the location to the submenu images on my site is:

/Themes/OutlineOmega_115/images/theme_name/

do i need to add for example before the image name: /Themes/OutlineOmega_115/images/theme_name/ 

so example:

the outline theme would show in code script as:

/Themes/OutlineOmega_115/images/outline/submenu_top.png


Thank you,
Mathew

[Antechinus]

The code is not theme specific. IOW, it can be added to any theme as is since it automatically calls the theme url.

You only need to start with    images/     etc. With Omega I did use capital letters to name the variants so make sure you include the initial capital. For example: images/Outline/submenu_top.png

I used the capital because that's what I was taught to use for proper nouns. This all-lower-case stuff gives me the irrits. 

[genieuk]

LOL, i like things with capitals

Well this is what i done:

Code Select Expand


         "/images/Outline/submenu_bg.png",
         "/images/Clearlight/submenu_bg.png",
         "/images/KindaBlue/submenu_bg.png",
         "/images/MidnightSun/submenu_bg.png",
         "/images/Mircalla/submenu_bg.png",
         "/images/Outrageous/submenu_bg.png",
         "/images/SilverMist/submenu_bg.png",
         "/images/Skyline/submenu_bg.png",
         "/images/Ultraviolet/submenu_bg.png",
         "/images/Verdigris/submenu_bg.png",

Will you now please visit my website, clear cache etc before hand and tell me if you think it loads slower/maybe to slow

I notice a slight holdback but seems fine, just thought i would ask as server is UK, so people from other countrys maybe even slower.

Oh before you say it i left out the "AzureSilk" and i did not list them alphabetical order 

Thank you,
Mathew

[Antechinus]

Hey you can't do that. If you leave out Azure Silk and don't get them in alphabetical order your server will crash. Seriously.















Yeah ok. I made that bit up. Seems to load fine. The images are only circa 200 bytes each so the total for the ten of them is only 2kB all up. That's about the same as one of the header corner images. IOW, it's negligible. Frankly you could put all the drop menu images in the array but it depends how long a list you want to deal with. Just putting in the backgrounds will deal with the worst of it. Up to you.