FFixer (previously known as Facebook Fixer) is a userscript that allows you to customize Facebook®.

You can install it via the download page on userscripts.org. You can comment on the script, request support, file bug reports and make feature requests via the discussion page on Userscripts.org.

Installation

If you are using Mozilla Firefox (with the Greasemonkey extension installed), Google Chrome or Chromium , just click on this installation link and then click Install when the popup appears (Chrome/Chromium users may also get a warning about installing extensions - just click continue).

If you do not have Greasemonkey installed, or if you are using another web browser such as Safari or Opera, then click here for installation instructions.

Customization

Almost all of FFixer's features can be turned on and off independently, and these settings are saved separately for separate Facebook® accounts. Once you have logged in there are three ways to access the config screen:

  • Click on the Account link in the top menu of any Facebook® page and then click Configure FFixer
  • If you have not disabled keyboard shortcuts you can press C (case sensitive - that's a capital c)
  • If you are using Greasemonkey/Firefox, you can use the Firefox menu: Tools > Greasemonkey > User Script Commands > Configure FFixer or right-click on the Greasemonkey icon and go to User Script Commands > Configure FFixer.

This script should run in several non-Greasemonkey browsers, including Opera, Google Chrome/Chromium and Safari. Because the functions that Greasemonkey provides are missing in these browsers, the normal way of storing settings doesn't work and the settings have to be stored using "local storage" instead. This has a few side-effects:

  • You must be using a web browser that supports local storage. The latest versions of all major browsers should support it, so if you're having problems try upgrading your browser.
  • The settings are saved on a per-sub-domain basis, so settings saved on www.facebook.com will not apply to apps.facebook.com. As a workaround for this you could export/import your settings across the sub-domains.
  • If you switch between normal and private browsing modes your settings may not carry across, depending on your browser and browser version.
  • Unlike Greasemonkey settings, it is possible for Facebook® to read the data saved in local storage. While this data would allow Facebook® to tell that you are using this script and access your settings for the script, in most cases the values are simply set to 'true' or 'false' (bookmarks being a noticeable exception).

Using the Config Screen

The config screen is divided into several sections, with tabs on the left side for navigating the sections. Most of the options are fairly self-explanatory - just keep in mind that if an option is indented then it is only applied when its parent-option is enabled. For example, the option to show pokes on the home page is irrelevant if you have set the script to hide the right-hand column of the home page.

Import / Export

When you open the Import / Export tab of the config screen you will see a text area that contains all your current settings. To backup your settings just copy that text into a text editor (like notepad) and save it somewhere safe. When you are ready to restore your settings just overwrite the text in that text area with the text you saved previously and hit the Import button.

Instead of using this as a backup you could also use it to synchronize multiple accounts, browsers or computers. Just copy the text from one installation to another and hit the Import button.

This feature is also useful if you are using a browser that doesn't support Greasemonkey, such as Chrome, Opera or Safari. Because these browsers use local storage to save settings, you have to configure FFixer for www.facebook.com and apps.facebook.com separately. Just do the following:

  1. Go to any non-application page and configure the script as you want it.
  2. Go to the Import/Export tab of the config screen and copy your settings to the clipboard.
  3. Go to any application page and import the settings via the config screen.

Advanced

The advanced section of the config screen contains options that the average person should not need:

  • "Interval at which to process the page" - Some of the script's features require the script to know when the content of the page has changed, but listening for these changes slows down the browser, so instead the script just checks at intervals. By default this happens once every 1000 milliseconds (1 second) but you can adjust this value here if you want to. Setting it to a lower value means that some changes the script makes will happen faster, but you'll be using the CPU more.
  • "Delay before showing popup pictures" - The Pictures tab of the config screen gives you an option to add a short delay before showing popup pictures - this setting lets you adjust that delay. The default value is 500 milliseconds (half a second).
  • "Hide all ego sections" - This will attempt to hide all recommendations and suggestions throughout the site that come from Facebook as opposed to your friends.
  • "Analyze Localization" - This is a tool for people who translate FFixer into other languages. Clicking this button will show the differences between the English and the language that you are using FFixer in.

The new Custom Feed Modification and Custom CSS options are discussed below.

Custom Feed Modification

FFixer 2.3.0 added a new feature called Custom Feed Modification will lets you specify rules to modify the news feed on the home page. This lets you do more advanced blocking of stories than is possible with the regular feed options, and also lets you highlight stories that you think are important.

There are currently four types of rules available, and each rule must be on its own line:

  • Block by ID - You can block stories by their ID (this is the same "sty" ID FFixer uses for regular story blocking). For example you could block stories with an ID of 66 using this rule:
    -66
  • Block by Text - You can block stories based on text that they contain (case-sensitive). For example you could block stories about quizzes using this rule:
    -Take this Quiz
  • Highlight by ID - You can highlight stories by their ID. For example you could block stories with an ID of 10 using this rule:
    +10
  • Highlight by Text - You can block stories based on text that they contain (case-sensitive). For example you could highlight stories with youtube videos using this rule:
    +www.youtube.com

Some things to note:

  • To get the ID, inspect any element within the story (firebug / developer tools etc), and then go up the parent nodes until you find an "li" element with a "data-ft" attribute that includes an sty value like this: "sty":"XX" where XX is the ID you are looking for.
  • FFixer will highlight stories by making their text bold and giving the tag containing the story a classname of "ffixer-highlighted-story". To highlight in a different way you can use FFixer's Custom CSS feature to modify how "ffixer-highlighted-story" classes are displayed. For example you could change the background colour like this:
    .ffixer-highlighted-story, .ffixer-highlighted-story * { background:#def; }
  • To select a story based on its text content the text must be visible. FFixer will not check hidden comments on stories, URLs for links, etc.
  • Anything after a hash/number/pound sign (#) is considered a comment.
  • You can optionally put a space after the plus or minus sign in the rule.
  • Empty lines are ignored.

This is a sample set of rules that includes comments:

# Block event stories
- 1
- 38
- 178

- 66 # Block note stories

- Take this Quiz
- View your Horoscope

+ are now friends
+ changed their profile pictures

# Highlight stories I have liked
+ Unlike

Custom CSS

FFixer 2.3.0 added a new feature called Custom CSS which lets you apply your own CSS rules to all pages on Facebook. Things to keep in mind:

  • Sometimes your CSS will have to override Facebook's CSS to you'll need to take the priority of the CSS rules into account.
  • Sometimes it will make more sense to use other extensions instead (such as Stylish for Firefox), depending on what you are trying to achieve.

Samples:

  • Change Facebook's colours:
    body, #content *, #pageFooter * { background:black; color:red; }
  • Change Facebook's font:
    * { font-family:ubuntu; }
  • Change the way FFixer highlights stories in the news feed:
    .ffixer-highlighted-story { font-style:italic; }

Application Whitelist

One of the features added in version 2.1.5 of FFixer was the ability to whitelist applications, so that stories from those specific applications always appear in the home page news feeds, even if you have chosen to block application stories. There is a large text input on the Feeds tab of the config screen for managing the whitelist - all you need to do is put the application's ID in that input. The simplest way to add a whitelist is as follows:

  • Temporarily disable the option for blocking application stories so that they will appear on your home page.
  • Just before the comment area in the story you will see something like "3 hours ago via Facebook for BlackBerry" or "11:45 via Facebook for iPhone" - right-click on the application name and copy the link address to the clipboard.
  • Paste the address in the application whitelist text input and then press any key on your keyboard, possibly SHIFT.
  • FFixer will figure out the application ID based on the address and whitelist that application.

Alternatively, you can figure out the application ID by looking at links to the application that are formatted like this: "http://www.facebook.com/mobile/?v=6628568379", where 6628568379 is the ID.

Bookmarks

Unlike most of the features in FFixer, bookmarks are setup outside of the config screen - the config screen is only used to enable or disable bookmarks completely. Once you have the bookmarks feature enabled you will see a Bookmarks sub-menu in the top menu of every page.

To add a bookmark for the page that you're currently on, just put the mouse over the Bookmarks menu and select Add New Bookmark. A prompt will come up asking you for the name of the bookmark.

To remove a bookmark put the mouse over the Bookmarks menu and select Manage Bookmarks. A popup will appear listing all your bookmarks. Select the bookmarks you want to remove and click "Remove Selected Bookmarks". Note that if the page you are on has been bookmarked it will automatically be selected when the popup appears.

If you are using a browser that doesn't support Greasemonkey, such as Chrome, Opera or Safari, then bookmarks you add while on a non-application page will not be visible when you are on an application page, and vice versa. If you want your bookmarks to be the same on application pages and non-application pages, then follow the steps outlined in the Import/Export section for configuring FFixer on www.facebook.com and apps.facebook.com.

Localization

FFixer has already been translated to several languages: Bulgarian, Chinese (Taiwan), Czech, Danish, Dutch, French, German, Greek, Italian, Korean, Macedonian, Norwegian, Serbian (Cyrillic and Latin), Slovak, Spanish, Turkish, Vietnamese. By default, if you switch Facebook to one of these languages, FFixer will automatically switch to that language too.

Translating FFixer

Note: Before you start a translation you should contact me to make sure nobody is working on your language already.

The script itself and a text editor are all you need to create your own localization:

  1. Open the script for editing. In Firefox the easiest way to do this is to right-click on the Greasemonkey icon, select "Manage User Scripts", choose FFixer from the list and click on "Edit". If it prompts you for a text editor to use, choose whichever editor you prefer - on Windows you could get by with Notepad, but I would recommend something with syntax colouring instead, like Notepad++.
  2. Do a search for the line containing "var lang = {" - this lang variable contains all the localizations. Just go through the English section and translate the text that comes after the colon. For example if the line is: "'BookmarkAdd' : 'Add New Bookmark'," you should only translate "Add New Bookmark", not "BookmarkAdd". You can refresh Facebook pages while you are doing this and FFixer will use your translated text.
  3. Once you have finished translating, copy the lines you translated to a new text file and save it with UTF-8 encoding so you can email just the translated text to me (contact me if you don't have my email address yet).

Updating Localizations

Changes to FFixer may result in new text that needs translating, or existing text becoming obsolete. The easiest way to keep your localization up to date is to open up FFixer's config screen, switch to the "Advanced" tab and click on "Analyze Localization". This will create a pop up showing you a modified version of your localization:

  • Any strings that are in the English localization, but not in yours, will be included with Javascript comment symbols at the start of the line: /* */
  • Any strings that are no longer in the English localization will be automatically removed from yours.

When you update your localization please email the entire localization section and not just the changes (you don't need to send the entire script though).

Bookmark and Share