Logo and text questions.

Illdy
1

Hi folks,

Awesome theme! Couple of quick questions:

  1. I’d like to center the header logo (which is currently just a title on my site). I figured that using “text-align: center” should have done the trick, but it didn’t:

#header .top-header .header-logo {
float: none;
text-align: center;
}

I know I’m controlling the right element because I can make the title disappear by using “display: none”. Also, I can move the title manually to the middle with “padding-left”, but that changes the spacing on mobile drastically and makes the site unusable. Can you help me center the title properly?

  1. I’ve turned the Team section into a contact section, using a text widget and a form from Contact Forms 7. I’m wondering if there’s any way to make the text larger under the Title, which currently reads “WE LAUNCH SOON”. The text in the Entry box underneath is very small, and I’d love to be able to enlarge it.

I tried using the “font-size” command in CSS to make it bigger, but that only affects the Contact Form itself, not the text above it.

Website is sightsee.world, for reference. Thanks a lot!

2

Hi @cole,

First you need to make sure that you have a child theme. After you will need to go in Appearance>Editor and edit the file Theme Header (header.php) by replacing <div class="col-sm-2 col-xs-8"> with this <div class="col-sm-12">

After you can play also with the padding-top to fix it where you want it:

#header .top-header .header-logo}
padding-top:80px;/*put here how much do you want*/
}

thank you,

Cristian

3

Thanks a lot, Cristian! I appreciate the reply. The title is centered now.

Any idea how I might enlarge that text in the Entry field of the “Team” section? The section that starts with “Want to get involved?”

One final question, if you have the time:

Is there any way to specify which part of the header image displays on mobile devices? I’ll attach a screenshot of what the site currently looks like on an Android device. It would be great if I could show the lower half of the photo (showing the girl in the red shirt) instead of just the trees up above her.

Thanks!

4

Re-attached!

5

Hi Cristian, quick update:

I did a workaround, so I won’t need to enlarge that text section after all.

However, I’d still love to find a way to display the lower half of the header image on mobile, if it’s possible :slight_smile:

Also, if you’ve ever been asked this: I’m trying to get my contact form to align properly on mobile. I’m using Contact Forms 7. I’ve tried many different fixes in CSS (from various sources on the internet), but the form is still slightly to the right of the screen on mobile devices. On desktop it’s centered correctly.

I’d be super grateful if you knew how to fix that. Cheers!

6

Hi @cole

Cool you figured it out. For the other question could you send me the livewebsite so I could see exactly what css code you need to change?

send me as a private message if you want.

Thanks,

Cristian

7

Great, thanks Cristian.

Do you need anything from me other than the url?

It’s www.sightsee.world

8

Hi @cole,

The only solution I could came up for image is if you could crop the picture.

For the other issue regarding contact form, as I see from it looks on the middle of the page, see attached.

thanks,

Cristian

9

Hi Cristian,

Yes, I was able to center the form by switching to a WPForms contact form instead of using Contact Forms 7. Woohoo.

Also, I was able to create something that worked for the image - I used the zoom function in CSS.

Thanks again for all your help!

10

Hi,

I am glad to hear that you solved.

Thank you,

Cristian