FANDOM


  • How do I get rid of the Fandom topbar after I sign in? I want some personal CSS that makes it go away for me alone. I know that it rolls away when I scroll down. I want it to stay hidden whether I scroll up or down the page. There is nothing I need on it.

    Or maybe move it to the side of the page as a vertical toolbar. In the unused space. The topbar takes up valuable screen space in its current location.

      Loading editor
    • Try the following:

      .wds-global-navigation-wrapper {
          display: none;
      }

      I know you already said this was only for your personal CSS. However, I just want to restate that requirement. Use of this in site CSS would be a violation of the customization policy.

        Loading editor
    • FYI, this will also make it hard to search and get to your preferences.

        Loading editor
    • Yes, Fandyllic has a good point. So be sure this is what you really want. You may or may not already know, but, if you want to apply this to all Fandom wikis you visit, you should add it to your personal global CSS. That way, you won't have to modify your personal CSS on each individual site.

        Loading editor
    • Thanks! It works great. I linked to my preferences from "My Tools" in the narrow toolbar at the bottom of the page. How do I link to my user page from there? Is it possible? I have it bookmarked of course.

      Notifications is a problem. I learned of your replies via the notifications icon in topbar. I would have learned when I checked my email too since I have set my preferences to tell me of changes to watched pages on Community Central. Is there a way to keep the topbar for a specific page only? I would keep it for my watchlist since that is the first thing I check on Wikia.

      I use my searchbar in Firefox to search sites. I have various search addons. I never use the Wikia searchbar. I have Special:Search linked from the navigation menus on my wiki if I need it. Which is rare.

      Is there a way to add the notifications icon in one of the empty sidebars?

        Loading editor
    • .wds-global-navigation-wrapper {
          display: none;
      }

      The code dos

        Loading editor
    • Code is not working

        Loading editor
    • CSS to restore the dropdown and notifications (still customization policy vio):

      .skin-oasis:not(.editor) .wds-global-navigation-wrapper {
      	position: absolute;
      	z-index: 4;
      }
      .skin-oasis:not(.editor) .wds-global-navigation-wrapper,
      .skin-oasis:not(.editor) .wds-global-navigation,
      .skin-oasis:not(.editor) .wds-global-navigation__content-bar {
      	background: transparent;
      	border: none;
      	box-shadow: none;
      	width: auto;
      	float: right;
      }
      .skin-oasis:not(.editor) .wds-global-navigation {
      	transform: none;
      	position: static;
      }
      .skin-oasis:not(.editor) .wds-global-navigation__logo,
      .skin-oasis:not(.editor) .wds-global-navigation__links-and-search,
      .skin-oasis:not(.editor) .wds-global-navigation__start-a-wiki,
      .skin-oasis:not(.editor) #WikiaTopAds,
      .skin-oasis:not(.editor) #WikiHeader .buttons,
      .skin-oasis:not(.editor) .banner-notifications-wrapper {
      	display: none !important;
      }
      .skin-oasis:not(.editor) .wds-global-navigation__content-bar {
      	justify-content: flex-end;
      }
      .skin-oasis:not(.editor) .wds-global-navigation__notifications-menu,
      .skin-oasis:not(.editor) .wds-global-navigation__user-menu,
      .skin-oasis:not(.editor) .wds-global-navigation__account-menu {
      	background: transparent;
      	align-self: flex-end;
      }
      .skin-oasis:not(.editor):not(.oasis-dark-theme) .wds-global-navigation__account-menu,
      .skin-oasis:not(.editor):not(.oasis-dark-theme) .wds-global-navigation__notifications-menu,
      .skin-oasis:not(.editor):not(.oasis-dark-theme) .wds-global-navigation__user-menu {
      	color: #39424d !important;
      }
      .skin-oasis:not(.editor).oasis-dark-theme .wds-global-navigation__account-menu,
      .skin-oasis:not(.editor).oasis-dark-theme .wds-global-navigation__notifications-menu,
      .skin-oasis:not(.editor).oasis-dark-theme .wds-global-navigation__user-menu {
      	color: #fff !important;
      }
       
      @media only screen and (min-width: 1596px) {
      .skin-oasis:not(.editor) .wds-global-navigation-wrapper {
          right: calc(50% - 621px) !important;
      }
      } 
      @media only screen and (max-width: 1595px) and (min-width:1084px) {
      .skin-oasis:not(.editor) .wds-global-navigation-wrapper {
          right: calc(50% - 533px) !important;
      }
      } 
      @media only screen and (max-width: 1023px) {
      .skin-oasis:not(.editor) .wds-global-navigation-wrapper {
          right: calc(50% - 384px) !important;
      }
      }

      EDIT: Static positioning and animation removal.
      EDIT 2: Positioning fix.
      EDIT 3+4: Prevented overlapping.

        Loading editor
    • Timeshifter wrote: Thanks! It works great. I linked to my preferences from "My Tools" in the narrow toolbar at the bottom of the page. How do I link to my user page from there? Is it possible? I have it bookmarked of course.

      Notifications is a problem. I learned of your replies via the notifications icon in topbar. I would have learned when I checked my email too since I have set my preferences to tell me of changes to watched pages on Community Central. Is there a way to keep the topbar for a specific page only? I would keep it for my watchlist since that is the first thing I check on Wikia.

      I use my searchbar in Firefox to search sites. I have various search addons. I never use the Wikia searchbar. I have Special:Search linked from the navigation menus on my wiki if I need it. Which is rare.

      Is there a way to add the notifications icon in one of the empty sidebars?

      With regards to using "My Toolbar", the answer appears to be no. Here is a list of the tools that are available for the toolbar (Help:Toolbar/List_of_available_tools).

      With regards to showing the topbar for your watchlist, do you actually mean Special:Watchlist or do you really mean Special:Following. Assuming you mean the former, change the CSS to the following:

      :not(.page-Special_Watchlist) .wds-global-navigation-wrapper {
          display: none;
      }

      I don't quite understand what you are referring to when you ask about adding the notification icon to an empty sidebar.

        Loading editor
    • Thanks Speedit. That CSS is glorious! :) For those who need to know more on where to use it:

      I am using it at Special:MyPage/common.css on my wiki.

      Would it be possible to return the "Contribute" dropdown too?

        Loading editor
    • Hi

        Loading editor
    • FireworkYT wrote: Hi

      If you are still having problems, we can't really help you until you link to where you are trying to use it.

        Loading editor
    • Don't you ever quote me

        Loading editor
    • FireworkYT wrote: Don't you ever quote me

      Why not?

        Loading editor
    • Cuz I said so

        Loading editor
    • FireworkYT wrote: Cuz I said so

      Yeah Timeshifter, stop it!

        Loading editor
    • @Speedit: It seems there is a problem with your CSS. Navigation no longer works. Run your mouse cursor over the navigation headers. The subtopics do not show up for each header.

        Loading editor
    • I've incorporated the fix into the original code at post #8. Should make the navigation overlap the notifications, but hide banner messages because they always overlap.

      I've broken the z-index, hold up.

        Loading editor
    • I've fixed it! Used some absolute positioning to get it right.

        Loading editor
    • Fantastic, Speedit. Any possibility of keeping the "Contribute" dropdown too? :)

        Loading editor
    • Can we see a screenshot of what it looks like?

        Loading editor
    • Here is a screenshot of the top of the page around the navigation area. Click to enlarge.

      Fandom topbar removed
        Loading editor
    • I like it. Too bad you can't search, but Wikia search is pretty awful. What does the "Search" menu do in the example?

        Loading editor
    • There are over 20 different ways to search in those menus. See also:

      http://cannabis.wikia.com/wiki/Category:Searches

        Loading editor
    • Forgot to sign in before posting the above message. I have various Firefox search addons installed too. I list some of them here:

        Loading editor
    • I know there haven't been any posts here for a while, but I thought I would add this alternative for the sake of solution completeness. It is important to note that the following CSS uses "pointer-events" which is supported only by the most recent web browser versions. However, given that this would be in your personal CSS, you should know whether or not this will work for you.

      .wds-global-navigation {
          background-color: transparent;
          border: hidden;
          box-shadow: none;
          pointer-events: none;
      }
      .wds-global-navigation__user-menu,
      .wds-global-navigation__notifications-menu {
          background-color: transparent;
          pointer-events: auto;
      }
      .wds-global-navigation__logo,
      .wds-global-navigation__links-and-search,
      .wds-global-navigation__start-a-wiki {
          visibility: hidden;
      }
        Loading editor
    • Andrewds1021. Thanks. Your CSS basically makes the Fandom topbar invisible when one is at the top of the page. But that topbar space is not freed up until one scrolls down. It is better than seeing Wikia's topbar, and it keeps the contribute menu. But I don't like the user icon and the notifications icon following me as I scroll down the page. The icons block stuff.

      So I prefer Speedit's CSS. Other's may prefer your solution, especially if they use the contribute menu. I never use it.

        Loading editor
    • Yes, but "pointer-events" lets you click behind the rest of the navigation bar. So you can still click the stuff to the left/right of the dropdown menus. Essentially, it allows you to virtually get rid of the rest of the navigation bar while maintaining the default behavior for the visible components. Of course, it is up to you which you prefer. As you noted, they do not achieve identical behavior. As I mentioned, I only posted that in case people are interested in shorter alternative.

        Loading editor
    • A FANDOM user
        Loading editor
Give Kudos to this message
You've given this message Kudos!
See who gave Kudos to this message
Community content is available under CC-BY-SA unless otherwise noted.