WordPress.com

1. erichagarty
   Member
   Apr 24, 2012, 4:33 AM

   Hi there,

   I'm using Twenty Eleven Theme with custom css upgrade. URL: http://ajgalestest.wordpress.com/

   I'm using the showcase template. Instead of having the showcase "featured post" slideshow link to a post, I was hoping to change the link to direct a person to specific page. For example, I'd like to make the current featured post take a user directly to http://ajgalestest.wordpress.com/about/ rather than http://ajgalestest.wordpress.com/2012/04/15/hello-world-2/

   I realize the design is not very good right now, and I have a ton of css work left to do, but wanted to get this last piece of functionality down.

   Thanks,
   Eric

   The blog I need help with is erichagarty.wordpress.com.

2. raincoaster
   Member
   Apr 24, 2012, 4:37 AM

   That's not possible. The CSS upgrade can change the look but not the function of a theme.

3. erichagarty
   Member
   Apr 24, 2012, 4:40 AM

   In that case, how would I go about making my "posts" follow the sidebar template rather than a blank template?

4. raincoaster
   Member
   Apr 24, 2012, 4:57 AM

   I'm afraid I don't know what the sidebar template vs blank template is.

   If there are things you want to draw attention to, you want to make them Posts, not Pages, for SEO reasons.

5. designsimply
   Staff
   Apr 25, 2012, 1:34 AM

   In that case, how would I go about making my "posts" follow the sidebar template rather than a blank template?

   The templates you're referring to are page templates, and those are not available for posts.

   There isn't a way to add a sidebar to posts in the Twenty Eleven theme, but maybe we could help you style the posts so they are full width? Would that help at all?

   Here is an example of a few updates that might help in case you're interested:

   .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular #comments-title {
   	width: 100%;
   }
   
   .singular h1.entry-title {
   	margin-left: 0;
   }
   
   .singular .hentry {
   	padding-top: 0;
   }

6. erichagarty
   Member
   Apr 25, 2012, 10:22 PM

   That does indeed help a lot. Thanks so much!

7. erichagarty
   Member
   Apr 25, 2012, 10:54 PM

   Actually still need help with one more thing.

   Now that I've got that code plugged in, I can't figure out how to get my 10px of padding on each side of the post. Also, how would I removed the 20px of #main above the post without screwing up the front page? Thanks for the help!

8. designsimply
   Staff
   Apr 26, 2012, 3:29 PM

   Now that I've got that code plugged in, I can't figure out how to get my 10px of padding on each side of the post.

   Padding should still work. You can add it to the block that starts with ".singular .entry-header", example: "padding: 0 10px;"

   But single posts like http://ajgalestest.wordpress.com/2012/04/24/news-item-3/ don't look like they need extra padding to me.

9. designsimply
   Staff
   Apr 26, 2012, 5:10 PM

   How would I removed the 20px of #main above the post without screwing up the front page?

   When I look at http://ajgalestest.wordpress.com/ right now, I don't see #main extending above the featured posts area, but the "#content" and ".featured-posts" areas to have extra spacing at the top, albeit a little bit hidden. Here is an example screenshot I took with Chrome showing the space taken up by the "#content" area on the home page for example: http://cl.ly/GAC7/o

   Also, since you have made so many modifications already, there are a lot of different ways this spacing question could be viewed or answered. Here is some CSS for how I would remove some of that extra, hidden spacing that I found and that I think you're referring to:

   #main,
   .featured-posts,
   .page-template-showcase-php #content {
   	margin: 0;
   	padding: 0;
   	overflow: hidden;
   }
   
   .featured-posts {
   	height: 298px;
   }
   
   .featured-posts section.featured-post {
   	top:0;
   }
   
   #content .feature-slider {
   	top: -25px;
   }
   
   #text-5 {
   	margin-left:0 !important;
   }
   
   section.recent-posts {
   	margin-right: 0 !important;
   }

   Note that a lot of these rules are overrides for what you already have in your Appearance → Custom Design → CSS page, and so for some of them you can just edit your CSS and remove the things that aren't needed. For example, you could remove the "margin-left" line from the "#text-5" block completely instead of setting the margin back to "0" with the "!important" attribute.

   Also, the !important attribute should be avoided if possible. Sometimes it really is needed, but if you start adding it too many times, then you keep overriding and overriding and overriding different little things and often what happens is that CSS becomes unmanageable at that point.

Topic Closed

This topic has been closed to new replies.