Altitude Pro – A few questions

[snatal8]

Any help would be appreciated - thanks!

I want to use a static homepage - this is the link in progress:

http://www.staceynatal.com/PutnamTemp/about-us/

and I want it to be wide like a landing page but still have the menu, header and footer. How can I keep it wide like a landing page and still have those other things show up? When I set it to Default Template, the header, menu and footer all show up but everything gets squished in like there are big margins.

If this will be the homepage, how can I remove the title and bar that appears under it?

Thanks!

[nutsandbolts]

Try the code here - upload it to your Altitude theme folder via FTP and name it something like page_landing2.php, then edit your page and select the new template (Landing 2): https://gist.github.com/nutsandbolts/ba73844299b7b28ac0da

---

Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+

[askdesign]

Home Page question
You establish which page is the home page by going to the Reading Settings and selecting "Static Page" for Front page displays and then selecting the About page in the drop-down menu for Front Page.

Full Width
Using a tool like Firebug (for Firefox) or Chrome developer tools, you'll be able to identify the selectors that control the styling. You must change the left and right padding to 0 for this particular CSS selector so that it becomes full-width:

.full-width-content .content {
    padding: 0 200px 50px;
    width: 100%;
}

becomes:

.full-width-content .content {
    padding: 0 0 50px;
    width: 100%;
}

Title and Bar
To limit the change to only this page...

.page-id-115 .entry-header::after {
    border-bottom: 1px solid #000;
}

becomes:

.page-id-115 .entry-header::after {
    border-bottom: 0px solid #000;
}

To limit the change to only this page...
.page-id-115 .entry-title { font-size: 36px;}

becomes:
.page-id-115 .entry-title { font-size: 36px; display: none}

Theme Features
It looks like this theme has some nice widgets for its built-in Front page. You might try using these features instead of a static Home page. The Readings Settings might need to change to "Front page displays latests posts", so check the theme set-up documentation.

---

Anne S. Katzeff
Designer | Artist | Teacher

[snatal8]

Thanks Anne and Andrea - I'll give them all a try! 🙂 Thanks so much for answering so quickly!

I agree that the theme has some good features for the front page. I was using it originally then got into some issues with spacing, etc so now I'm using visual composer and finding it easier.

Thanks!

Stacey

[snatal8]

Hi Anne,

Thanks for your help. I am making some of the changes you suggested but I can't find the code for the title and bar that you mentioned here:

.page-id-115 .entry-header::after {
border-bottom: 1px solid #000;
}

Where do I find that?

I don't see it in style.css

Thanks for being so patient with me! 🙂

Stacey

[askdesign]

Hi Stacey,
In the CSS file, the selectors would be found on or near the following lines:
line 1501 - .entry-header::after
line 773 - .entry-title

You won't see the page ID part, because I've added that to limit the change to only that page.

When editing the child theme CSS, I usually leave the original code intact and add my modifications toward the bottom (yet above the media queries). I put a comment right before my section of modifications, something like:
/* --- ASK Design customizations -- */

Have you started using Firebug? 🙂

my best,
Anne

---

Anne S. Katzeff
Designer | Artist | Teacher

[snatal8]

Thanks Anne! I'll give it a try and also check out Firebug 🙂

I have to run out for a bit but will do this when I get back

I'll let you know how it goes and I'm sure I'll have more questions! Ahhh!!

Thanks again!

Stacey

[askdesign]

Cool, let me know how things go.

If you prefer Chrome, there are the Developer Tools, which are great. Even Safari has developer tools now, although I haven't used them (don't use Safari much anymore)...

---

Anne S. Katzeff
Designer | Artist | Teacher

[snatal8]

Hi Anne!

I made those changes thank you and now of course I have more questions.

1 - I want to change the font size of the buttons and I thought I found the code of where it is but when I change it in the code, the text size on the button doesn't change.

2 - I want to reduce the top margin of just the home page. I see where the code is to change it for all pages but not sure the exact syntax for just that one page. It is currently at 170px and I want it reduced to 100px just for that page.

Thanks!

[askdesign]

Hi Stacey,
Making progress I see!

I'm not sure which button you're targeting. If it's the green one at the top "Request an Appointment", the font size is normally 14px. To change the font size:

.vc_btn3-container.vc_btn3-center .vc_btn3-block.vc_btn3-size-md {
    font-size: 12px;
}

The margin for the site-inner selector on this particular page would become:

.page-id-115 .site-inner {
  margin-top: 100px;
}

To find the page ID, use a developer tool like Firebug and look at the HTML section to find the first call of the body class:
<body class="home page page-id-115 page-template-default custom-header header-image header-full-width full-width-content wpb-js-composer js-comp-ver-4.9 vc_responsive" itemtype="http://schema.org/WebPage" itemscope="" data-pinterest-extension-installed="ff1.37.9">

cheers!

---

Anne S. Katzeff
Designer | Artist | Teacher

[Author]

Posts