Use Custom CSS and Cutline? Please Test Your Site
-
In four days (next Monday) we’ll be replacing the Cutline theme with a more-customizable theme named Coraline. The Cutline theme will no longer be available.
The two look largely the same but there’s been some improvements made under the hood. We think you’ll really like it.
If you’re currently using Custom CSS with Cutline there are some changes to the theme you should know about that could affect your site design—but only if you use both Custom CSS and Cutline. If you’re using Cutline without Custom CSS you might not even notice the change!
If your site uses Cutline and Custom CSS, please read on.
We want to give you a chance to activate Coraline, test out your CSS, and make any necessary changes before you absolutely have to.
- First, activate Coraline from Appearance > Themes.
- Open your Custom CSS in Appearance > Edit CSS.
- Save your CSS edits to a text file for reference.
- Edit your CSS based on the tips below, and save the Custom CSS.
You can use a tool like Firebug to quickly find spots where id and class names might have changed in the markup you’re styling with Custom CSS.
Changes in Markup from Cutline to Coraline
Here is a list of some of the more-likely-to-be-styled changes.
- #content_box becomes #content-box
- Like the Twenty Ten theme, the blog title is only wrapped in the h1 tag on the home, or front page of your site. Instead of selecting this element with:
#masthead h1 a {
/* styles */
}
Try the following:
#masthead #site-title a {
/* styles */
}
- The main menu items were #ul nav, and can now be targeted with #access ul
- #header_img is now #branding
- The “posts” and “pages” classes on the #content div have been replaced with the standard classes of “post” and “page” on the body tag. Change “.posts” to “.post” and “.pages” to “.page”
- The “hentry” class will allow you to select the content of both posts and pages.
- Styles targeting the h2 tag used for the entry title can now target .entry-title
- h2.archive_head is now h1.page-title.
- Styles targeting the h4 tag used to hold the post date can now target .entry-meta
- .entry becomes .entry-content on posts and pages and .entry-summary on archive pages.
- .tagged becomes .entry-info with some extra hooks for styling inside.
- .add_comment is now .comments-link
- Coraline has up to 7 available widget areas and that means changes to the sidebar markup. Luckily all the widget areas can now be selected with .widget-area
- Coraline has two main sidebars. Instead of selecting #sidebar, try #primary and #secondary or #main .widget-area
- Instead of just a class of comments_headers. There are now two types of comment headers that can be selected, #comments-title and #reply-title. You can target both with #comments h3
- #comment_form .text_input has been replaced with two selectable elements, #respond input[type=text] and #respond textarea.
-
It’s ludicrous to be announcing this with a mere four day heads up INCLUDING a weekend. People have many other things to deal with and many may be on vacation. On top of that, this could be a lot of work, which leads me to ask (a) why are you willy-nilly yanking a design; and (b) why aren’t YOU making the changes OR paying for the transition?
To sum it up, you’re imposing a major headache on your customers, and for reasons that I find completely unfathomable you’re doing it in a way that forces them to drop whatever else they’re doing in order to get it done in time, assuming they’re not on vacation?
What world are you living in, if I may ask?!!!!
-
I’ll second that, yachtlaw. I’m a CSS novice, and had friends help me with custom CSS edits, so it will be impossible for me to adequately transfer my customisations to the new theme by Monday.
Why is the Cutline theme even being removed? Please explain.
-
When we first added the Cutline theme to WordPress.com it was free software. That means the users of that theme had the freedom to use, share, and modify that theme as they wished—as long as they passed those freedoms on when they shared it. That freedom let us bring the Cutline theme here to WordPress.com and it’s the same freedom that’s made WordPress so popular.
Free software is something we believe is important: to use and promote.
Cutline was sold a few years ago and had a more restrictive license placed on it. The original author of the Cutline theme has gone on to produce other themes with more restrictive licenses. Using Cutline has been seen as a promotion of that work and that’s not something we want to do–so, we made something better: Coraline! The state of the art in themes has advanced quite a bit since Cutline and we’re happy to make the switch.
But don’t worry, we’re here to help you make the transition. Contact us in support or post your questions here and we can help you get your Custom CSS sorted out.
-
Well, we can all cheer free software, but the issue was the four day heads up including a weekend, which you didn’t explain. I mean, you’ve been working on this change, right, so you certainly knew it was coming. You control the schedule, right, so giving customers a month heads up is the reasonable, fair AND professional approach.
I have an email in right now regarding changes – still waiting.
-
I’m using Cutline without CSS changes. In testing Coraline, I notice a couple of problems. If Coraline is going to automatically replace Cutline, I’d appreciate it if some minor tweaks could be made so that there are no compatibility problems.
1. At the bottom of all my posts I have a line with several social bookmarking buttons. The buttons have a dot between them (made with alt-7). In the Coraline preview, those dots all drop down to a line of their own, which looks ridiculous. I’ve probably got a thousand posts with that line of buttons and dots, so at this point it’s not possible to edit them. The only solution is to fix the Coraline theme to keep the dots in the same line as the buttons. Otherwise, all my posts will look disfigured.
2. Are the drop-down menus optional for Pages? I’d prefer not to have the sub-pages automatically show up, as I now have links in the the main pages if I want the sub-pages to be accessible.
3. The amount of indenting for blockquotes seems to be greater than with Cutline. This creates some formatting problems. In particular, at the bottom of all my posts I’ve got a “copyright” notice (in blockquotes) that has always fit into a single line. In Coraline that notice breaks into a second line, which looks awkward. I suppose I should have “centered” that notice, but blockquotes worked, so that’s how I’ve always done it. I have this in over 1,000 posts, so I can’t go back to edit it now. The only solution is for the Coraline theme to be edited so that its blockquote feature doesn’t indent more than Cutline does.
4. If those changes can’t be made in Coraline, would it be possible to leave Cutline as an option, because I’m afraid my blog has become too dependent on it to change.
Thanks in advance for considering these issues.
-
@sensuouscurmudgeon I’m taking a look at 1 and 3 now. Those shouldn’t be a problem. For number 2, the menus will be fully customizable in Appearance→Menus. (You can read more about Custom Menus here.)
-
-
@sensuouscurmudgeon My pleasure. :) Let us know if the changes will will work out; they should be live now.
-
Yes! Problems 1 and 3 are fixed. You guys are fast! I’ll deal with #2, the custom menus, when the Great Change-over happens.
It occurred to me that the problem with the spill-over of my “copyright” line could also have been due to the fact that the widget column in Coraline seems wider than in Cutline, so there’s less width for the main posting area. Maybe not. I donno what you did, but everything looks okay now.
Much appreciated.
-
A quick tip for those that were using Custom CSS to hide the blog title and description – with Coraline that is controlled from Appearance > Header.
Find the Display Text option, check No, and save to remove the title and description from your header area.
@sensuouscurmudgeon You don’t have to wait to set up your menu – head over to Appearance > Menus, and when you switch over to Coraline your menu will also transfer over.
-
I was doing another preview of Coraline, and now I don’t see the tabs above the header pic for pages. Is that now gone from the theme?
Hey — they’re also gone from my blog that’s still using Cutline. Are you guys doing this, or am I having my own problems?
-
Forget my last comment. My fault. I was playing with my “menus” options in the dashboard. All fixed now.
-
@sensuouscurmudgeon :) No worries. Keep us posted if you see anything else out of place.
-
Now I do notice something, but I don’t think you can do anything about it. My tagline fits into one line when I’m doing a Coraline preview for my blog. That’s fine .It’s a big improvement, because Cutline doesn’t display the tagline.
I have a test blog, so for that I actually installed Coraline. It’s the same tagline, but when installed for the test blog the last word of the tagline spills over into a second line. It doesn’t make sense. I guess I can re-write it to be shorter, but I don’t know why the two blogs look different.
-
@sensuouscurmudgeon The taglines look to be the same length for me in both the preview and on a live site If it appears longer on your test site it will appear that way on your main site.
Let us know if you encounter any other theme wonkiness.
-
Okay. On the test blog I installed a wider header pic, which the new theme accommodates, thinking that might stretch things out. But the tagline still breaks into a second line.
As I said, I can edit the tagline when the conversion comes to my main blog, if that’s necessary to keep it to one line. This isn’t a problem for me. But it’s odd that I’m getting different tagline results (just a single line) when I preview that theme for my main blog.
One other thing: I never noticed any staff announcement that Coraline was available as a new theme. Did you guys forget that, or did I miss it? Except for the sticky about CSS users, there’s no thread on Coraline as there always is for new themes. This automatic change is going to catch a lot of Cutline users by surprise.
-
-
I am glad to have a replacement for cutline.
flexible-width??? How do I set the width of my posts.
- The topic ‘Use Custom CSS and Cutline? Please Test Your Site’ is closed to new replies.
WordPress.com Forums 