Changing Code in Fifteen Plus Theme

Hi there,

I think I can help you out:

1. Change the Page Header

The page header (home) is a H1 tag – you can either change the font size of all H1’s :

h1, .h1 {
  font-size: ?px;
}

or just the ‘page header’ :

.container.single-entry-title {
  font-size:  ??px;
}

2. Reduce the space between the logo and the menu

There is some space below the logo for social icons – this is what is creating the unwanted gap.

#social-icons {
   display:  none;
}

3. Change page background color to white

Try this:

.single #content, .page #content {
  background: #fff;
}

#primary {
  background: #fff;
}

You can paste this code in your child theme’s style.css or in a custom css plugin such as Simple Custom CSS.

I hope that helps!

Luke the Daft Duke

Thank you for the response. Sometime in the next few days, I will be able to jump in and try the suggestions you provided.

Most of the the page content is now updated. Could you help out with a few other minor edits?

For some reason, the footer is centered at certain page sizes. As I adjust and make my page wider, the content (I’m assuming the container) becomes left aligned and the text will break onto two lines. How do I fix this so the footer content is always centered within the page? I’d also like to add some white space underneath the footer, so it’s not sitting at the bottom of the page/window.
Is there a way to remove the gray line that is in the background? Or change it to white, so it’s not so obvious?

Try this:

#footertext {
   padding-bottom: 20px;

}

#footertext.col-md-7 {
  width:  100%;
}

#parallax-bg {
  border-bottom: none;
}

Thank you!

Ok, one last question (I hope). On the homepage, if you adjust your browser width, at certain widths, the copy extends left/right past the image. I would like to keep the copy underneath the image, either keeping the same left margin, or even being indented.

I fudged this by I have adding padding, however if I preview the copy in a mobile browser, you see one letter per line. So, I need a more mobile-friendly solution ??

I’m certain I understand what you mean but perhaps this will do the trick:

.entry-content > p {
  margin-left: 9%;
  max-width: 82%;
}

.entry-content > ul {
  margin-left: 10%;
  max-width: 82%;
}

Failing that you could use media queries to target different screen sizes.

I hope that helps ??

Luke the Daft Duke

It doesn’t seem to do the trick.

Also, I moved the menu buttons into the blue bar. Now I can’t seem to delete the original menu bar (under the logo in blue type). I have deleted it from the header.php, and checked the full-width-page-template.php. Am I missing another spot that it should be deleted from?

I figured out the menu bar question. I knew I was close ??

Ok, I’m not sure I really understand what your trying to achieve.

I’m not getting one letter per line at mobile size:

Screenshot

Perhaps try reformatting your html in the post editor with div classes so you can control each element more precisely?