Here's a quick mock-up of what your structure could look like. You can obviously expand this and make it more than 3 wide, or more than 2 high if you have a lot.
Some things to keep in mind for this kind of user interface:
- If you're using a pagination, be sure to put one at the top and bottom of the list if it's long (I only put 1 in the mock-up). You should have one at the top just in case users already know which page they want to go to when they visit the site, so they don't have to scroll down. You should have one at the bottom so that when they finish scrolling, looking over your boxes, they can quickly go to the next page.
- Put a small hash icon at the bottom right corner of boxes to indicate that they can be dragged, then use jQuery to allow them to be dragged and dropped, hopefully saving the users preferred settings (so they don't have to do it everytime they visit).
- Any "Sort by" options should have an ascending and a descending version, just in case the user wants it in reverse order.
Refer to this question when designing your drag-and-drop system: Warn desktop user of draggable website. Although it's a slightly different question, it relates in that you'll need a way to show the user it's drag-able as well.
Here's an idea for how "custom" looks. If the user drags any element, the "Sort by" should automatically change to "custom", and it saves that users preferences.
download bmml source – Wireframes created with Balsamiq Mockups
Note the tool-tip. You should have some kind of notification to tell the user what custom does, although it doesn't need to be a tool-tip.