How to achieve the two boxes in the demo

Hi Stu, do you mean the two items here? http://singldemo.wordpress.com/

The first box with the music player is page content of the static page set as the homepage under Settings > Reading. This page is set to use the Front Page template.

The concert schedule below that is a child page of the static page which is set as the homepage. This is a feature of Singl’s Front Page template – it displays child pages.

More info: http://theme.wordpress.com/themes/singl/

Let me know if this answers your question.

You can try this to keep the widgets panel open and hide the trigger:

.bottom-panel {
  display: block;
}

.widgets-trigger {
  display: none;
}

For any new questions, could you please start a new thread? Thanks!

Hmm, that’s odd, it worked fine on my test site. Could you provide a link to your site so I can take a look directly?

It looks like you’ve mixed in some of the code I provided with the default CSS, directly in style.css, is that right? I also see that you’ve hidden the widget trigger, but I don’t see the first piece of CSS I provided, which is what keeps the panel open.

Here’s what I suggest for proper CSS overrides:

First, revert back to the default style.css file that comes with the theme. You may want to make yourself a copy of the changed file in case you need to transfer over any other tweaks you’ve made.

Don’t edit the theme files directly, otherwise your changes will be overwritten when the theme is updated.

Since you’re already using Jetpack, an easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS.

Add the CSS I provided above to your custom CSS area.

Let me know how it goes.

Glad to hear it.

Using a child theme on my test site, no !important declarations were necessary. You might be able to omit !important by targettting a more specific CSS element.