Shwetank Dixit

In windows, whenever you install Opera in a different directory, it creates a different profile. However, on the mac, its a bit more complicated.

I for example, have multiple builds installed on my mac. I have all my mail on the current stable build. But I also have various other internal builds and alpha/beta builds installed. If I don't have multiple profiles for each of them, then the newest build would inherit the mails, and everything else, instead of the stable version. This is definitely something I do not want.

To have multiple profiles of Opera on the mac, you have basically two options, each of which is a way of doing the same thing in a different way.

First on foremost though, you should have the Opera builds installed in different directory. For example, the current stable version in /Applications/Opera and the new version in /Applications/OperaNew

The easiest method

Make sure you do not have the new build open. Also its a good idea to make sure you have your old build open.

1. Create a file called 'PrefsSuffix' (no extension like 'PrefsSuffix.txt' etc... just 'PrefsSuffix' without any extension) and enter any random thing in it (you should avoid linebreaks, '"', '/', '.', '|' and ':'). For example, the string 'Opera10macbuild'
   
2. Then goto the new build folder, that is, the directory /Applcations/OperaNew and right click on the Opera icon.
   
3. Then click on 'Show Package Contents'.
   
4. Then Click on 'Contents'.
   
5. Then Click on 'Resources'.
   
6. Then paste that file you created in that folder.
   
7. Start the Opera app in /Applications/OperaNew
   
8. Go to Opera->About Opera
   
9. Check the mail folder, and other folders, they would have directory like /Users/<yourusername>/Library/Application Support/Opera yourrandomstring/mail/
   

And thats it!

The Command line method

Some people may not be comfortable with command line. On the other hand, a lot of people are.

Simply make a file inside the Opera Resources folder named "PrefsSuffix" containing any sequence of letters you like (you should avoid linebreaks, '"', '/', '.', '|' and ':').

Easiest way to do that is probably to open the Terminal.app
$ cd /Applications/OperaNew/Opera.app/Contents/Resources/
$ echo "RandomString" >> PrefsSuffix

Where 'RandomString' is any random string you want.

Once you do that, repeat steps 7-9 of the previous method described above, to check whether your mail folders, etc have the new prefix or not.

I hope this helped!

Most people that I see, like to have their tabs on the top like this

However, I like to have lots of tabs open (most of the times much more than 50 tabs), and when you have so many tabs open, its a bit difficult to read what the title of all the individual tabs (I typically have more than one page of a site open at a time, so favicons arnt a good way of distinguishing pages). This is why I like my tabs like this

You can do this by going to Customize->Toolbars->Wrapping->Wrap to multiple lines

But thats not all, what if you wanted your tabs at the right side of the screen instead of the top, like this...

This is especially usefull for people with extra-wide monitors. In the above screenshot, the tabs are on the right, and the mail pane is on the left. You can configure tabs on the right side by going to Customize->Toolbar->Placement->Right


Similarly, you can go ahead and place your tabs on the bottom, or on the left, or make sure the tabs are shown only when you have more than one tab open (by choosing the 'Show only when needed option')

If you have been been frustrated with adding javascript for routine tasks while making forms, I have some good news for you. Web Forms 2 is here to help you out! With Web Forms 2, you'll be able to make forms with much less frustration ease. So lets get right to it...

Note: Opera 9.5 and above have excellent support for Web Forms 2. But other browers have to catch up. Also, I have an example page which demos all the stuff mentioned below. You can view the example here with the latest public build of Opera.

Inputs get a new life

You can a lot more with the input tag than before.

Man, that date was easy!

Just try this in your opera 9.5 browser

<input type="date">

You'll be able to get a whole calender of the month which you can forward to different months and years. Cool, huh?

Apart from date, also try datetime, month, week, datetime-local and time.

Easy Emails:

try this

<input type="email">

This will make the the browser(using its own built-in validation) check whether the text entered looks like an email address.

Ranges and the Output atribute

No more JS for a slider! You can just write this

<input type="range" min="0" max="10">

and it will display a slider with a minimum value of 0 and a maximum value of 10.

But that not it, there is also an Output attribute which can display the output of anything youi cant. For example in the above slider, we can add this ...

<input type="range" min="0" max="10" name="a"><output onforminput="value=a.value">

This would display the sliders current value as you move it along!

Patterns

This example, straight from the draft, gives an idea of how pattern could help

<label> Credit Card Number:
 <input type="text" pattern="[0-9]{13,16}" name="cc" />
</label>

Pattern could be used to verify whether the user has inputted the answer according to the particular pattern demanded.

Required has been really required for a long time!

One of the most common things about form are the required inputs. Usually we say something like the entries marked with * are required, and then proceed to do client and server side detection for it. For those of you who hate writing JS for this, there is now an easier solution...

<input type="text" required>

If the user does not enter something in this, a warning will show up and the form will not get submitted.

Autofocus

<input type="text" autofocus>

This will focus and place the cursor on this input when the page is loaded.

Datalists

<input type="url" list="mylist">
<datalist = "mylist">
<option label = "the shoe company" value ="http://www.nike.com">
<option label = "the kickass browser company" value="http://www.opera.com">
<option label = "the best video ever" value = "http://www.youtube.com/watch?v=uxIsiTo4VJo">
</datalist>

When the user will focus on this input, a list will drop down containing the labels and URLs, and when he selects them, the value (i.e, the URL) will be entered into the input. For example, if I select "the kickass browser company" from the drop down, then "http://www.opera.com", will get entered into the box.

It is different from an actual drop down as the user is free to enter whatever he likes and is not limited by the entries he gets in the drop down.

Disabled and Readonly
Disabled and Readonly are not new, and have been part of the HTML specification, but I haven't seen a whole lot of forms with them.

<input type="text" value="somevalue" disabled>

will make the entry disabled(cannot be edited) and will not be successfull, ie, the entry will not be submitted.

<input type="text" value="somevalue" readonly>

will only make the value readonly, ie, the user cannot edit the entry. However, the entry will be submitted.

Styling forms

You can style forms based on their selectors as well. For example,

input:required{background:black;color:white;}

will mark the background black and font color white of only the required attributes. Pretty usefull, huh?

The Repetition Model

Update: It seems that the repitition model will in all probability not be included in the final HTML5 specification.

Web forms 2 introduces the Repetition model. With this, you can form blocks which can be repeated. Its a bit similar to the experience when you attach files in Gmail.

We do this by first forming a 'template' to repeat. We can also specify how many minimum or maximum times we want the template to repeat itself using repeat-min and repeat-max.

Buttons, have also undergone a change, and now with it, we can add types such as 'remove', 'add', 'move-up' and 'move-down'. Attaching these buttons to the templates will perform thier respective actions.

For an example on the repition model and as well as everything mentioned above, please see my web forms 2 demo page.

Other sources of Info on Web forms 2:

• Web Forms 2 working draft
  
• Improve your forms using HTML5!
  
• Making legacy pages work with Web Forms 2
  
• Web Forms 2 demo by Olav.dk
  
• how to use or survive WebForms2