How to center logo in header with widget area on either side in Genesis

In the members-only forum, a user asked:

Please could you could add a tutorial to adjust the header area on Genesis Sample to have a logo in the centre with a widget area on either side. I'm trying to set up the following:

SOCIAL ICONS - LOGO - SEARCH BAR

We shall

1. register a header left widget area
2. hide the site description
3. use genesis_header action hook to display the header left widget area's contents before .title-area
4. use genesis_attr filter to add one-third class to .title-area and .header-widget-area
5. replace site title with inline logo

HTML output:

While the tutorial has been written for Genesis Sample child theme it should work with a few adjustments in any Genesis child theme.

Step 1

Upload your desired logo image to child theme's images directory. In this example I've used a 360 x 100 image named logo.jpg.

Step 2

Add the following in child theme's functions.php: