Opera FAQs, Tips, Tricks & Tweaks

User style sheet can be used to modify the look of a website. Even if you don't know anything about CSS you can find code to hide anything using Opera Dragonfly as shown below.

1. Right click on the item you want to hide and select 'Inspect Element' from the context menu. Opera Dragonfly will open and highlight the element with blue color depending on where you clicked.

   
   Ad is highlighted but the text 'Ad' is not highlighted

2. Click one by one (in this example li.tas, ol, div#tads.c, ...) from bottom right side until everything you want to hide is highlighted.

   
   Both Ad and text 'Ad' are highlighted

3. Select and copy code from bottom and add the following at the end.

   {display:none !important;}

   The final code looks like the following.

   div#tads.c {display:none !important;}

4. Save the CSS code to a file with css extension.
5. Close Opera Dragonfly.
6. Right click on the page > Edit Site Preferences... > Display > My style sheet > [Select saved file] > OK
7. Reload page to apply the style sheet.

Author mode and user mode styles can be switched quickly using the default keyboard shortcut, Shift+G but there is no shortcut to enable or disable other styles except View > Style menu.

Any style can be enabled or disabled quickly by using action codes Select user CSS file and Deselect user CSS file respectively. Create a new keyboard shortcut or mouse gesture in Document Window section with the following action code.

Select user CSS file, X | Deselect user CSS file, X

For Windows OS, X = Style sheet number (files sorted in ascending order) - 1. If you don't have any additional CSS style files inside profile\styles\user directory except the default ones, you can use the X value from the following table.

For Linux OS, open terminal and copy & paste the following command to find the X value.

ls ~/.opera/styles/user/ -U | awk '{ print FNR-1 " " $1 }'

Command to find X value in Linux OS

Example: Action code to enable or disable accessibility layout

For Windows OS,

Select user CSS file, 0 | Deselect user CSS file, 0

Select user CSS file, 5 | Deselect user CSS file, 5

Latest news page used to show your blog posts and photos in green color and others in blue color but this was removed in carambola release.

You can bring back colors by using user style sheet. Add the following code to user CSS file and reload news page to apply style sheet.

/* Subscriptions (Latest news) */
.newscontainer h2 { background:#2b7fb6; color:#fff; }
.newsowner h2 { background:#82a70b; }

News page before

News page after

A user style sheet is a text file with CSS declarations. It allows you to have control over the look and feel of website. It can be used to hide annoying things like ads, change fonts and colors, etc.

!important declaration should be added to a rule to take precedence over author style sheet.

User style sheets can be applied to all sites Tools > Preferences... > Advanced > Content > Style Options... > My style sheet (restart required to apply style sheet) or per-site basis Right click on a site > Edit Site Preferences... > Display > My style sheet (reload required to apply style sheet).

Example 1: Hide friend request link in My Opera

My Opera friend request link in top bar

1. Create a text file with the following and save preferably inside profile\styles directory with CSS file extension.

   /* Friend request */
   #friendrequest { display: none !important; }

   
   CSS to hide friend request link and share this button

2. Add path to CSS file in site preferences.

   
   Path to CSS file in site preferences

3. Reload page to apply style sheet.

   
   My Opera friend request link hidden by CSS

Example 2: Hide sponsored links in Google

Useless Google sponsored links

Google sponsored links can't be blocked by content blocker but it can hidden by following CSS code.

/* Top sponsored links */
#tads { display: none !important; }

/* Side sponsored links */
#mbEnd { display: none !important; }