RebelMouseTalk to Us
The Top Bar: users' way of finding your content

Currently, in your site we offer two types of predefined Top Bars:


  • Simple:

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2Fe2823666-2b31-449c-8b94-753a60b855c7%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=666&h=04ffd3fb5ffa4f407396e7a953aea0b42683bbe9cfab0f9777467a08f688ccaf&size=980x&c=1624169397 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252Fe2823666-2b31-449c-8b94-753a60b855c7%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D666%26h%3D04ffd3fb5ffa4f407396e7a953aea0b42683bbe9cfab0f9777467a08f688ccaf%26size%3D980x%26c%3D1624169397%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

  • Normal:

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2Ffe9a6725-3303-406e-86ad-b15159d99018%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=464&h=d560b6c3bb07d471e3a3119858108f940af45f7bd100ffa16772ae6588e2fbb5&size=980x&c=4137795704 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252Ffe9a6725-3303-406e-86ad-b15159d99018%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D464%26h%3Dd560b6c3bb07d471e3a3119858108f940af45f7bd100ffa16772ae6588e2fbb5%26size%3D980x%26c%3D4137795704%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

You can actually switch between those two versions by going to the Left Nav > Layout & Design tool:

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2F45cde54f-7195-421f-9ccc-c451dd6e5c80%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=583&h=06b8af72a5566ce3221c5f8b61745f91770b2f0b5dafa5e5d641775338974d81&size=980x&c=2561873100 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252F45cde54f-7195-421f-9ccc-c451dd6e5c80%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D583%26h%3D06b8af72a5566ce3221c5f8b61745f91770b2f0b5dafa5e5d641775338974d81%26size%3D980x%26c%3D2561873100%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

Choosing the Top Bar tab, and selecting the Nav Bar element.

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2F2fc741c7-ee83-4d38-91ea-d0bd20adeb0a%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=284&h=90b79c18fecb14883fe59385e33a89e610936c38ecb3c27db742726180cc7d83&size=980x&c=1682814783 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252F2fc741c7-ee83-4d38-91ea-d0bd20adeb0a%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D284%26h%3D90b79c18fecb14883fe59385e33a89e610936c38ecb3c27db742726180cc7d83%26size%3D980x%26c%3D1682814783%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

And switch between Top Bar formats as easily as with one click.

Don't forget to hit SAVE!


Creating a custom Top Bar:

If you want to get super creative with the design of your Top Bar, you can actually use Custom HTML to design it.

In the Top Bar tab in the Layout & Design tool, click the + button to add an element and choose 'Custom HTML':

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2F82517d07-df30-41fd-a87e-d6a4ea4e5768%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=959&h=4cfb1ccdfe1aae02b3eda292608368ca320ee6c6085719f028fa84d8538077c5&size=980x&c=735429303 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252F82517d07-df30-41fd-a87e-d6a4ea4e5768%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D959%26h%3D4cfb1ccdfe1aae02b3eda292608368ca320ee6c6085719f028fa84d8538077c5%26size%3D980x%26c%3D735429303%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

There, you can start coding away whatever Top Bar you want to use.

A quick example of a custom Top Bar with an ad tag in it:

<div class="topnav-custom">        <a href="/" class="topnav-custom__logo site-logo">        </a>        <div class="ad-placeholder ad-placeholder--top">            <div class="ad-placeholder-inner">                <!-- /194487792/ADTAG_ATF_Desktop --><div id='div-gpt-ad-1479093654204-0' style='height:90px; width:728px;'><script>googletag.cmd.push(function() { googletag.display('div-gpt-ad-1479093654204-0'); });</script></div>            </div>        </div>    </div>

This is how it looks:

[rebelmouse-proxy-image https://media.rbl.ms/image?u=%2Fmedia.forumbee.com%2Fi%2F706573b1-b63f-48b6-b4ad-e3be41488bf4%2F547.png&ho=https%3A%2F%2Fs3-us-west-2.amazonaws.com&s=573&h=5740cc12488d7c499a1c7236bb378d1a9d5102adf79091891aca519bdc2ad24e&size=980x&c=1927312342 crop_info="%7B%22image%22%3A%20%22https%3A//media.rbl.ms/image%3Fu%3D%252Fmedia.forumbee.com%252Fi%252F706573b1-b63f-48b6-b4ad-e3be41488bf4%252F547.png%26ho%3Dhttps%253A%252F%252Fs3-us-west-2.amazonaws.com%26s%3D573%26h%3D5740cc12488d7c499a1c7236bb378d1a9d5102adf79091891aca519bdc2ad24e%26size%3D980x%26c%3D1927312342%22%7D" caption="" pin_description="" image-library="0" expand=1 photo_credit=""]

Please remember to remove the default Top Bar the site template comes with, otherwise you'll have two different ones in place.

What Is RebelMouse?
Request a Proposal
Meet the Rebelmouse Platform: The Highest Performing CMS on the Web
Rebel Insights

Meet the Rebelmouse Platform: The Highest Performing CMS on the Web

Make sure your site is set up for success in 2022.

In the spring of 2020, Google let the world know that its Core Web Vitals would become the new benchmark for measuring a site's performance in its search results, known as the page experience update. Fast forward to more than a year later in August 2021 when, after much anticipation, Google's page experience update became official.

Since its rollout, developers have felt the impact of how their publishing platforms stack up against the new standard. Important decisions around the architecture of your site can now make or break your site's performance in the eyes of Google.

HTTP Archive, a tracking platform that crawls the web to identify trends and record historical patterns, frequently reports on how top content management systems (CMS) have weathered the page experience update through the creation of its Core Web Vitals Technology Report. RebelMouse has consistently outperformed major CMS platforms on Google's most critical metrics throughout the year:

Getting superior scores on Google's performance benchmarks isn't easy, either. The Ahrefs blog analyzed Core Web Vitals data from the Chrome User Experience Report (CrUX), which is data from actual Chrome users, to see how the web stacks up against Core Web Vitals. Their study found that only 33% of sites on the web are passing Core Web Vitals.

data from Ahrefs tracked on a line chart finds that shows only 33% of sites on the web pass Google's Core Web VitalsFrom Ahrefs.

Luckily, performing well on Core Web Vitals is possible with thoughtful, strategic changes to your site’s codebase. Here's what you need to know and how we can help.

Keep reading...Show less
The Most Secure CMS of 2022
Featured

The Most Secure CMS of 2022

Why RebelMouse Is the Most Secure CMS on the Web

Delivering a secure, high-performing environment with extreme reliability is essential to all of our clients at RebelMouse. We only use industry-leading, reliable approaches to host our infrastructure. This ensures maximum stability and security for all of our clients’ data. Here are just some of the reasons we’re able to maintain a hard-bodied product that’s flexible, too.

Keep reading...Show less
Interested in a Free Website Health Check?Check Your
Website's Health
Get Your Free Analysis Now