Sidebar Content Sidebar Layout « ThemeShaper Forums

ThemeShaper Forums » Thematic

Sidebar Content Sidebar Layout

(9 posts)

Started 3 years ago by gougeaway
Latest reply from gougeaway
This topic is resolved

Tags:

sidebar layout columns

gougeaway
Member

I'm just diving into Thematic, and so far I really like what I see. For most pages I'll be dealing with one sidebar on the right, content on the left. However, for the home page I'd like:

Sidebar1 Content Sidebar2

Is there an easy way of doing this? It'd be nice if I was using one of the thematic sidebars, but if this has to just be a sidebar using plain html/php in functions.php, that could work too. I'm just looking for the best way of doing this. I'm hoping this is achievable with just CSS, but if I have to mess w/ the functions.php let me know.

I'm doing this as a child theme, which may be important to note, but probably goes without saying.

Posted 3 years ago #
Chris
Moderator
Hey,

this can be done using plain CSS.

You should have included 2c-r-fixed.css in your style.css. Now copy thematic\library\layouts\3c-fixed.css to your child theme's directory. Edit this file and change each css selector from selector to .home selector .. for example: body should be changed to .home body

Now edit your style.css and enter a new line after:
```
@import url('../thematic/library/layouts/2c-r-fixed.css');
```
new line:
```
@import url('3c-fixed.css');
```
Now you'll have your frontpage in 3c-fixed layout and all other pages in 2c-r-fixed layout.

Cheers,

Chris
Posted 3 years ago #
gougeaway
Member

Surely there's an easier way?!?!

Just kidding, that worked great.

Thanks for the quick help.

Posted 3 years ago #
gougeaway
Member

Okay, maybe I spoke too soon. The sidebars are working fine, but either of these lines:

@import url('../thematic/library/layouts/2c-r-fixed.css');
@import url('3c-fixed.css');

will cause the dropdown to stop working? Is this normal?

Any ideas?

Posted 3 years ago #
Chris
Moderator

Sorry for this .. I'm working on it.

Posted 3 years ago #

Chris
Moderator

OK .. there's more that needs to be fixed than just the drop downs .. and the drop downs are the easy ones.

Let' take the fast lane .. We will use two different style.css .. the one with 2c-r-fixed and another one with 3c-fixed. Both are the same except of the one line loading the layout css.

Add the following to your functions.php:

function my_stylesheet($content) {
  if (is_home() || is_front_page()) {
		$content = "\t";
		$content .= "<link rel=\"stylesheet\" type=\"text/css\" href=\"";
		$content .= get_bloginfo('stylesheet_directory') . "/style3.css";
		$content .= "\" />";
		$content .= "\n\n";
  } else {
		$content = "\t";
		$content .= "<link rel=\"stylesheet\" type=\"text/css\" href=\"";
		$content .= get_bloginfo('stylesheet_directory') . "/style.css";
		$content .= "\" />";
		$content .= "\n\n";
	}
    return $content;
}
add_filter ('thematic_create_stylesheet', 'my_stylesheet');

style.css is the one with 2c-r-fixed and style3.css the one with 3c-fixed.

This will work! .. it is working here. Again sorry for this inconvenience.

Cheers,

Chris

Posted 3 years ago #

gougeaway
Member

Okay, I have two files. style.css has the lines:

@import url('../thematic/style.css'); @import url('../thematic/library/layouts/2c-r-fixed.css');

style-home.css has:

@import url('../thematic/style.css'); @import url('3c-fixed.css');

I added your function above, replacing the style3.css with style-home.css. Everything loads fine, but still no dropdowns.

I guess I'm not sure how this is any different from the code before, and appearance wise things seem the same. I have a feeling I'm missing something (it is 3 in the morning, I really ought to be in bed).

A bit more information: Other than Akismet, I've got no plugins installed or anything like that - fresh wordpress install, fresh thematic install, with just the function above, and the css files.

Thanks again, Chris.

Posted 3 years ago #

Chris
Moderator

Hey,

take a look into thematic\thematic-sample-child-theme\style.css .. this is your basic style for starting your own design.

Taking this basic style.css your style.css should be:

/* Reset browser defaults */
@import url('../thematic/library/styles/reset.css');

/* Apply basic typography styles */
@import url('../thematic/library/styles/typography.css');

/* Apply a basic layout */
@import url('../thematic/library/layouts/2c-r-fixed.css');

/* Apply basic image styles */
@import url('../thematic/library/styles/images.css');

/* Apply default theme styles and colors */
/* It's better to actually copy over default.css into this file (or link to a copy in your child theme) if you're going to do anything outrageous */
@import url('../thematic/library/styles/default.css');

/* Prepare theme for plugins */
@import url('../thematic/library/styles/plugins.css');

Again using the same basics with a different layout your style-home.css should be:

/* Reset browser defaults */
@import url('../thematic/library/styles/reset.css');

/* Apply basic typography styles */
@import url('../thematic/library/styles/typography.css');

/* Apply a basic layout */
@import url('../thematic/library/layouts/3c-fixed.css');

/* Apply basic image styles */
@import url('../thematic/library/styles/images.css');

/* Apply default theme styles and colors */
/* It's better to actually copy over default.css into this file (or link to a copy in your child theme) if you're going to do anything outrageous */
@import url('../thematic/library/styles/default.css');

/* Prepare theme for plugins */
@import url('../thematic/library/styles/plugins.css');

Tested and approved with Thematic 0.9 .. Drop Downs working .. Home using 3c-fixed layout all others using 2c-r-fixed layout.

Cheers,

Chris

Posted 3 years ago #

gougeaway
Member

That seems to be working. I'll do some testing later today, and let you know if there's a problem, but I'll mark it RESOLVED for now. Thanks!

Posted 3 years ago #

RSS feed for this topic

Reply

You must log in to post.