Nova Barra de Menu

• Descrição:

Queria a barra de menu que fica la emcima a barra preta

Achei isto neste site: http://upforum.forumeiros.com/

• Informações:

Código:

$(function () {
    if (_userdata.session_logged_in == 0) {
        var LinkFacebook = 'http://facebook.com/teste'; // Aqui inserir link do facebook
        var LinkTwitter = 'http://twitter.com/teste'; // Aqui inserir link do twitter
        var LinkGooglePlus = 'http://plus.google.com/teste'; // Aqui inserir link do Google+
        var BarraHTML = '<div id="header_bar" class="clearfix"><div class="main_width"><div id="social"><a href="' + LinkFacebook + '" rel="nofollow" target="_blank" title="Like nossa página do facebook"><img alt="Icon" border="0" src="http://i.imgur.com/9QKj1TQ.png" style="margin-right:1px;"></a> <a href="' + LinkTwitter + '" rel="nofollow" target="_blank" title="Siga-nos no twitter e receba atualizações"><img src="http://i.imgur.com/A26mm7D.png" alt="Icon" border="0" style="margin-right:1px;"></a> <a href="' + LinkGooglePlus + '" rel="nofollow" target="_blank" title="Siga-nos no google+"><img src="http://i.imgur.com/0mWLvLz.png" style="margin-right:1px;"></a> </div><!-- <ul id="admin_bar" class="ipsList_inline left"><li><a href="http://www.facebook.com/" target="_blank">Facebook</a></li><li><a href="http://www.twitter.com/" target="_blank">Twitter</a></li><li><a href="http://www.youtube.com/" target="_blank">Youtube</a></li><li><a href="http://plus.google.com/" target="_blank">Google+</a></li><li><a href="http://www.linkedin.com/" target="_blank">LinkedIn</a></li><li><a href="http://www.vimeo.com/" target="_blank">Vimeo</a></li></ul>--><div id="user_navigation" class="not_logged_in"><div class="ipsList_inline right"><span class="services"><a href=""><img src="http://demo.themetent.com/public/style_images/firebox/loginmethods/facebook.png" alt="Log in with Facebook"></a><a href=""><img src="http://demo.themetent.com/public/style_images/firebox/loginmethods/twitter.png" alt="Log in with Twitter"></a></span>&nbsp;&nbsp;&nbsp;&nbsp;<a href="/login" title="" id="sign_in"><img src="http://i.imgur.com/ElBWcCp.png"> Entrar</a>&nbsp;&nbsp;&nbsp;<a href="/register" title="" id="register_link"><img src="http://i.imgur.com/l7wPBzc.png"> Criar Conta</a></div></div></div></div> <style> #header_bar { -webkit-box-shadow: 0 1px 5px 0 rgba(0,0,0,0.4); background: url(http://www.ipbforumskins.com/skindemo/public/style_images/uniform/user_navigation.png) repeat-x scroll center bottom #323232; border-bottom: 1px solid rgba(0,0,0,0.35); box-shadow: 0 1px 5px 0 rgba(0,0,0,0.4); padding: 0; position: relative; text-align: right; } div#social { float: left; padding-top: 7px; } #user_navigation.not_logged_in { height: 26px; padding: 6px 0 4px; } .main_width { margin: 0 auto; min-width: 960px; width: 80%!important; } .ipsList_inline.right, div#social { margin-top: -4px; } #user_navigation #register_link { -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 4px rgba(0,0,0,0.4); -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 4px rgba(0,0,0,0.4); background: #1C83C4; border: 1px solid #187CBC; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 4px rgba(0,0,0,0.4); color: #fff; display: inline-block; padding: 6px 22px; text-shadow: 0 1px 2px rgba(0,0,0,0.3); } #user_navigation a { color: #fff; font-size: 11px; } </style>'
        $('body').before(BarraHTML);
    }
});