Problems setting up theme

Hi there,

1. Select the page in dashboard list and click quick edit where you can disable comments.
2. In Customizer > Colors > Footer - here you can change the Widget title then Customizer > Colors > Typography to change the heading font style - note there are shortcuts at the top of each of the customizer panels to switch from layout to colors to typography.
3. Use this CSS to compensate for the extra margin that the grid-containers are adding:

.entry-title {
    margin-left: 20px;
}

Thanks David

That fixed 1 and 3 but Im not sure about 2. Maybe when Im saying footer Im referring to the wrong area. Im talking about the area above the botton bar. The area where I have my contact details and suburbs.

I found that I could alter the headings and content font size in

Customising ▸ Typography > Widgets

but maybe thats also altering other widgets elsewhere. Im just trying to make the widget headings a different size in the footer widget area

Also with the current layout that I have in my footer widget area, I have 2 widgets. This creates quite a large area between the first widget and the second one. Ideally the first widget could be 1/3 width and the second one could be 2/3 width. Is there a different way that I could have approached this? I originally tried having just one widget and putting everything in that and using divs to divide up the area. I struck problems trying to style the headings and content that way. I also couldnt add padding between the heading and content when I put everything inside one div. Is there a better way?

Try this CSS to speficy footer widget title style:

.footer-widgets h2.widget-title {
    font-size: 25px;
    color: #000000;
}

For different footer widget width, check out this area:
https://docs.generatepress.com/article/footer-widgets/#choosing-different-widths-for-each-widget-area

I struck problems trying to style the headings and content that way. I also couldnt add padding between the heading and content when I put everything inside one div. Is there a better way?

Can you explain this a bit more? Might help if you guide me to the page/section in question as well.

Let me know :)

Thanks for that Leo.

The area that Im talking about the footer at the bottom of my homepage. That link that you gave me looks promising. Ive got everything in footer widget 1 and 2. Does that make each widget a specified width? How would I make footer widget one 35% and footer widget two 65%?

You would need to use the PHP snippet in the linked article to change the width.

Your code should be basically like this except with 35&65 split:
https://generatepress.com/forums/topic/footer-menus-left-right-footer-menus-bottom-copyright/#post-938970

Adding PHP: https://docs.generatepress.com/article/adding-php/

Perfect thanks Leo. It worked :-)

I downloaded that plugin because it seemed like the easy way. As time goes on is that code likely to break the site and need to be updated?

Is there some way of also removing the margin so that the heading in the footer widget aligns left with the content?

Thanks

It's unlikely that the code will need to be updated.

The structure of your footer widget seems to be weird.

Can you copy and paste your HTML here and make sure to highlight the code and click code button in the editor?

:-) All of my code is weird!

I think I noticed what you where talking about. How does that look now?

Are you adding the <div class="grid-container"> and <div class="grid-100 mobile-grid-100 tablet-grid-100"> part?

If so try removing it.

The content should simply be:

<h5>Contact:</h5>
<p>Mobile: 0417 799 303</p>
<h5>Business Hours:</h5>
<p>Monday - Friday<br>7.00am to 4.00pm</p>

Ok I did that. What about the list in widget 2. Do I remove it there too?

Yes - you don't need the 2 divs mentioned here:
https://generatepress.com/forums/topic/problems-setting-up-theme/#post-954526

Ok so if I remove that how do I create the 3 columns?

I also attempted to create a class for the list but it wont work :-)

<ul class=”footer-list”>

and css

ul.footer-list li {
    line-height:20px;
    list-style: none;    
    font-size:16rem;
    font-size:1.6px;
}

The class isn't working because you have curly quotes in there. Try this instead:

<ul class="footer-list">

:-) Curly quotes. I have plenty of those. I'm still a bit confused with this one. Do I still need these divs in footer widget 2? If I remove them then I dont see how I could divide the zone up into 3 columns.

<div class="grid-container" >
<div class="grid-33 mobile-grid-100 tablet-grid-100">

I'm also still struggling with the custom class for the list in the footer. Something isnt right.

This is my html

<div class="grid-container" >
<div class="grid-33 mobile-grid-100 tablet-grid-100">
<ul class=”footer-list”>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
</ul>
</div>
<div class="grid-33 mobile-grid-100 tablet-grid-100">
<ul class=”footer-list”>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
</ul>
</div>
<div class="grid-33 mobile-grid-100 tablet-grid-100">
<ul class=”footer-list”>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
<li>Some text or a link here</li>
</ul>
</div>
</div>

And this is my css

ul.footer-list li {
    line-height:50px;
    list-style: none;    
    font-size:16rem;
    font-size:1.6px;
}