Twenty Fourteen Theme CSS Customization

writtininstone · Member · Dec 12, 2013 at 7:09 pm
Copy link

Add topic to favorites
I would like to expand the amount of space the body text takes up in the Twenty Fourteen theme. In other words, I want the content to be wider throughout the theme.

Also, I need to make it so my tables don’t show any lines. HTML isn’t working unfortunately.

Thanks!

The blog I need help with is: (visible only to logged in users)
staff-totoro · Staff · Dec 13, 2013 at 12:35 am
Copy link
Hi there,

You can try the following line of code.

.site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content .entry-meta, .page-content { margin: 0 auto; max-width: 1038px; }

To use it, go to Appearance > Custom Design and click on the “Edit” button under the CSS section, and paste it in.

Be sure to save your changes when you are done. If you like you can tweak that CSS value to find what works for you. Feel free to experiment. :)

Also, I need to make it so my tables don’t show any lines. HTML isn’t working unfortunately.

You will also need to remove these lines using CSS. Do you have a link to the page/post in question? I’m happy to take a look.

Hope that helps. Please let me know if you have any further questions.
writtininstone · Member · Dec 13, 2013 at 1:29 am
Copy link
OMG! That worked, thanks so much.

But I do see a slight problem with it: The right aligned pictures are going off page. Here’s an example in case I’m not explaining it adequately.

http://auteurati.wordpress.com/2013/10/07/cumberbitchcraziness/

You see how the horizontal bar at the bottom has appeared? I don’t want that. Tweaking it so that it’ll fit is tricky and cuts back on the full-width effect.

And yes. I have several pages in mind:

http://auteurati.wordpress.com/thesithandthesenator-2/

and

http://auteurati.wordpress.com/the-end-of-everything/

These are just some examples.

Thank you so much for your help, by the way. =]
staff-totoro · Staff · Dec 13, 2013 at 9:13 pm
Copy link
Hi there,

But I do see a slight problem with it: The right aligned pictures are going off page. Here’s an example in case I’m not explaining it adequately.
http://auteurati.wordpress.com/2013/10/07/cumberbitchcraziness/
You see how the horizontal bar at the bottom has appeared? I don’t want that. Tweaking it so that it’ll fit is tricky and cuts back on the full-width effect.

Everything looks good when I visit it in my browser (Chrome on a Mac) so have you tried a different browser, or tried disabling any browser extensions you have loaded, to rule out any conflicts?

Generally speaking, changing the width of the blog container has a ripple effect, so it may take time to chase down any little things that come as a result of such a big change. A good thing to try is to get help for those issues in our CSS forums here: https://en.forums.wordpress.com/forum/css-customization

The community there is very talented and helpful!

And yes. I have several pages in mind:
http://auteurati.wordpress.com/thesithandthesenator-2/
and
http://auteurati.wordpress.com/the-end-of-everything/

You can try this:
```
table,
th,
td {
	border: none;
}
```
Let me know if you need assistance or if you have any questions. :)
writtininstone · Member · Dec 15, 2013 at 10:03 pm
Copy link
Yes, that did work. Sorry I didn’t respond, I’ve been sick.

One more thing before I release you.

How to put a picture in like… the menu and the sidebar? Just curious about how to do it in case I get especially creative later on.
staff-totoro · Staff · Dec 18, 2013 at 1:04 am
Copy link
How to put a picture in like… the menu and the sidebar? Just curious about how to do it in case I get especially creative later on.

While there is not really an easy way to put a picture in a menu, it is easy to put them in a sidebar, or any “widget area” that you theme may support. You can add single pictures, or entire image galleries, using either of the following:

http://en.support.wordpress.com/widgets/image-widget/
http://en.support.wordpress.com/widgets/gallery-widget/

Best of luck!
writtininstone · Member · Dec 18, 2013 at 4:08 pm
Copy link
jerrysarcastic:

You are a kind and very helpful guy. I have two more requests before I release you.

1. What’s the code for making an individual post full-width?

2. Is there any code to outline the like the sidebar and the featured grid articles?
staff-totoro · Staff · Dec 18, 2013 at 6:21 pm
Copy link
Hi there,

What’s the code for making an individual post full-width?

I’m not sure I understand. The code I gave you originally to adjust the width of posts on the main blog feed also extends to single post (they’re the same) so do you mean something different, like removing the sidebar completely when viewing single posts?
writtininstone · Member · Dec 18, 2013 at 6:25 pm
Copy link
I was saying just in case I decide to put in the left sidebar, it would appear throughout the theme.
staff-totoro · Staff · Dec 18, 2013 at 7:20 pm
Copy link
Well, if you are referring to making certain widgets visible (or hidden) on certain pages, this is a big help:

Widgets

The topic ‘Twenty Fourteen Theme CSS Customization’ is closed to new replies.

WordPress.com forums

Twenty Fourteen Theme CSS Customization