The new sticky bar at the top of the site is really pretty...

I have to add agree that “change for the sake of change” is just not a good idea. I’d much rather have a stable, functioning site than a nice shiny new header. The header is literally twice as tall as it needs to be (see picture posted by ).

epic is going to remove it in two weeks;)

(because it is very annoying)

I only got my internet back last night and its already really annoying me, although its not really the size but more the way its stays on screen when you scroll down, it just wastes screen space and gets in the way.

Any news or feedback on this? It is really annoying to look at this black bar especially when working on desktop along with unreal engine

We’re working on some usability improvements on the forums, the bar, and such. Hang tight! We’re making it better :slight_smile:

To be honest, I find it hard to take any company/site seriously that’s using a default forum theme or an over-used premium one that’s been poorly customized. However, if the Unreal Engine UI is the extent of Epic’s interface design capabilities, I don’t know that I’d want a custom theme either as it looks very 2005 and plastic-like. It’s quite shocking to me how a company that produces software and games that render absolutely stunning graphics fails to have phenomenal application and web interfaces. I 100% agree with whomever said CryEngine’s forums look better - not only do they look better but they’re easier to navigate and read because of it.

vBulletin has always been pretty ugly, in my opinion - especially their admin panel. Not only that but their code has been a mess too… I’ve always gone for Invision Board as their design and code are both significantly better than vBulletin’s. Never really understood why companies tend to go with vB over IPB.

Anyway, back on topic, I’ve created this TamperMonkey script to make the header smaller when you scroll down on the page (how the site should have been written to begin with). It’s not perfect as I just wrote it in like 10 minutes, so if anyone would like to improve it, please do. Perhaps it’ll inspire Epic to implement something similar so such scripts aren’t necessary. :slight_smile:


// ==UserScript==
//    @Name         Unreal Engine Small Header
//    @Namespace    http://unrealengine.com/
//    @Version      0.1
//    @description  Make the header on UnrealEngine's website smaller on scroll.
//    @Author       Mheetu
// @include      http*://*unrealengine.com/*
//    @        none
//    @Require      http://code.jquery.com/jquery-latest.js
// ==/UserScript==
/* jshint -W097 */
'use strict';

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.id = 'custom-styles';
    style.innerHTML = css;
    head.appendChild(style);
}

var smallNav = false;
var styles = 
    '#epicGamesNav * {transition: all .5s !important}',
    '#epicGamesNav nav {height: 4.5em !important}',
    '#epicGamesNav .siteNav, #epicGamesNav .siteNavKids, #epicGamesNav nav #propNav, #epicGamesNav .right-col, #epicGamesNav .right-col .rightNav {height: 4.5em !important}',
    '#epicGamesNav .siteNavKids li.dropdown, #epicGamesNav .siteNav li.dropdown {height: 100% !important}',
    '#epicGamesNav .siteNavKids li a, #epicGamesNav .siteNav li a {padding-top: 1.7em !important}',
    '#epicGamesNav .siteNavKids li ul, #epicGamesNav .siteNav li ul, #epicGamesNav #locale ul, #epicGamesNav #user.dropdown ul {top: 4.5em !important}',
    '#epicGamesNav .right-col .rightNav>div a {padding-top: 1.6em !important}',
    '#epicGamesNav nav .dropdown:after {top: 33px !important}',
    '#epicGamesNav.ue .propLogo {margin-top: 10px !important}',
    '#epicGamesNav .egLogo {height: 4.5em !important}',
    '#epicGamesNav .nav-line {height: 4.5em !important; padding: 30px !important}',
    '#epicGamesNav .cta {margin-top: 10px !important}',
    '#epicGamesNav #cta a {padding: .9em 1em !important}',
    '#epicGamesNav .egLogo .eg-header-icon-epicgames {padding-top: .4em !important}',
    '#epicGamesNav .egLogo #eg-properties {top: 4.5em !important}'
].join(' ');

$(window).scroll(function() {
    if ($(window).scrollTop() >= 200 && !smallNav) {
        smallNav = true;
        addGlobalStyle(styles);
    } else if ($(window).scrollTop() < 100 && smallNav) {
        smallNav = false;
        $('#custom-styles').remove();
    }
});

(Edit: Apparently @ symbols are parsed as mentions even when they are in CODE, HTML, and PHP BBCode tags.)

I agree, the size is unnecessary. I’m all for the dark look, but it’s soooo big! :frowning:

Imho: The header is a good contrast color, but should not float. Though float could work if the float header would be differently designed, with some opacity and a height of around 30 pixels.

I had to change the script a bit, since it didn’t worked at first on my end. If Mheetu’s script doesn’t work for someone, I provide my version which works fine on my end now:
The link to the script from Github for direct installation (Mheetu, if you don’t want me to have it as public repository please tell me. It’s your script primarily. I just use Github to make my life easier, since I use it across multiple devices :slight_smile: ): https://github.com/Dakraid/UEHeaderScript/raw/master/UESH.user.js
The repository itself: https://github.com/Dakraid/UEHeaderScript

Update: The script now re-sizes the bar after loading the page, so it should always stay small.

Do with it as you please, I just created it to make my life easier and figured I’d share it. :slight_smile:

Not sure how easy it would be to change but was always confused why the dark theme has blue text? It is barely used in promotional materials and feels odd to me. Did a quick mock up which uses the more heavily used orange colour

I have to agree with Mheetu, the forum is outdated.

I like this.

I like outdated, functional forums. Look at the mess that the Oculus forum became.

I’ve been looking for a thread on this =). I don’t like how when i scroll up a bit, while reading a thread, and then the title bar decides to cover up exactly what I decided to scroll up to read =(.

Yeah i noticed that happening as well.

for me the bar just doesn’t show up at all anymore :eek:

I’m on IE11 and if I go to unrealengine.com the bar is there (just not on the forums)
If I open the forums in Chrome the bar is there

but I didn’t say I use Edge, did I?
I used to be a web developer, and in my eyes a website that doesn’t support IE is just lazy coding (or purposedly not caring about 6% of internet users)

The simple fact is, the new top bar used to work fine in IE11. now it doesn’t.

You should see it on my android phone. The ‘Get Unreal’ button floats about the screen and everytime i click on anything to bring up the keyboard the header just engulfs the entire screen and I can’t see what I’m typing. Usually when I try to hit the ‘post reply’ the ‘get unreal’ button gets activated even though i havn’t touched it.

It’s an absolute joy I’m so glad it’s been added.

I no longer see this bar at the top. Was it removed?