Home Forums Support Fullscreen HomePage

Viewing 11 posts - 31 through 41 (of 41 total)
  • Author
    Posts
  • #71205
    Stephane

    Tom,

    I don’t know who have to do this but when you resize the window (or on mobile view), the background is not centered/resized. Is it normal?

    Have you an idea to put the navigation background transparent?

    Thanks,
    Stephane.

    #71353
    Tom
    Lead Developer
    Lead Developer

    Hi Stephane,

    I agree that an option to set the header/navigation to transparent in the page header options would be a good addition – I’ll look into that.

    The background image image should resize according to the size of the browser – can you link me to the page?

    To set the navigation to transparent, you’ll have to target that specific page with its unique body class.

    For example, if the ID of the page is 20, your CSS would be:

    .page-id-20 .main-navigation, 
    .page-id-20 .main-navigation ul ul {
        background-color: transparent;
    }
    #71392
    Stephane

    Ok. Thank you Tom.

    For the background image size, you can have a look at http://dev.proteo-interactive.com/. I notice it is only for the video background. Others work well.

    I try also the transparent background with the custom css of jetpack plugin. Not seems to work!

    #71408
    Tom
    Lead Developer
    Lead Developer

    Hmm – maybe videos/gifs don’t resize like other images, interesting..

    As for the background, as your nav is inside the header you’ll need to use this code:

    .page-id-20 .main-navigation, 
    .page-id-20 .main-navigation ul ul,
    .page-id-20 .site-header {
        background-color: transparent;
    }
    #71410
    Stephane

    I’m very confused but it seems not working.

    #172610
    Rachel

    Hello there!

    I just came across this forum post and I’m hoping someone will see this…
    I’ve had this problem CONSTANTLY since trying to make my website, but I’m so frustrated- only now am I speaking up. I just can’t get my background pictures to center fully. They are always zoomed in/ cropped and I can’t see the rest of the picture. It is located in the ‘Page Header’ section (background image).

    I’ve tried what I think is every possible option, but I’m no pro. Far from it. I would love it if someone could tell me what I’m doing wrong.
    -Also, does anyone know how I can center (or push right) my opt-in form? I’m missing something.

    Pic of webpage:
    https://picasaweb.google.com/lh/photo/z9EaNTNTSQEoldQAycY4CtasDPyScxwZxDt0l1MaJvY?feat=directlink

    Pic of actual image, obviously more to see than what is shown on the webpage:
    https://picasaweb.google.com/lh/photo/YgJUezTU06MPwJZHMFBNZdasDPyScxwZxDt0l1MaJvY?feat=directlink

    I’m pulling out my hair, please help before I go bald πŸ™‚ Thank you!!

    #172618
    Tom
    Lead Developer
    Lead Developer

    Hi Rachel,

    Backgrounds images in Page Header are set to take up the entire area that they’re set to, meaning if the aspect ratio of the image isn’t the exact same as the aspect ratio of the element it’s set to fill, certain parts of the image can be cut off.

    The amount of image showing/not showing will vary depending on screen size (both height and width).

    Unfortunately there’s no real way around this, but you can change the background position to left, right etc..

    Let me know if you need more info πŸ™‚

    #172719
    Rachel

    Thanks so much for getting back to me, Tom! What a relief.

    I tried to change the picture to the width of the website layout size and it did nothing. I’m now having to do what I’ve been doing, which is just taking a set canvas size and placing the picture on it, scaling the picture until it fits where I want it to on the website space.

    I’m afraid that all this editing will be for nothing though when I go to view my website on my phone. Guess I’ll deal with that when I get there.

    #172726
    Tom
    Lead Developer
    Lead Developer

    It will definitely look different on your phone because of the aspect ratio.

    I’m contemplating an option to upload a mobile background image in Page Header/Sections so a separate image can be uploaded just for mobile with a different aspect ratio.

    Going to try and work it into the rebuild πŸ™‚

    #172777
    Rachel

    Wow, yes, that would please a lot of people! Very handy indeed.

    Thanks for helping us all out. Will definitely be buying you a coffee for the assistance πŸ™‚

    #172781
    Tom
    Lead Developer
    Lead Developer
Viewing 11 posts - 31 through 41 (of 41 total)
  • You must be logged in to reply to this topic.