[Resolved] Backgrounds

This topic contains 28 replies, has 2 voices, and was last updated by  Andrew Misplon 6 months ago.

  • Author
    Posts
  • #7389

    clickmela
    Participant

    Can I mail screenshot to your mail

    #7390

    Andrew Misplon
    Keymaster

    I need to see the problem live.
    I’ve asked to see the problem live many many times.
    Please, explain to me why you can’t just save the image and show me the problem live.

    There are no exact dimensions for an image to not be distorted when full screen, it would depend on the display size being used to view the site.

    #7391

    Andrew Misplon
    Keymaster

    With regards to this question:

    My next question is when we choose picture to apply fill to screen format ,it applies full top to bottom(except header & footer) but the quality reduced like blur image or pixel spread or tear even full image doesn’t appear it crop the image automatically

    There is no dimension I can offer you that was cause no blur. Each monitor/screen/display being used by each person has different dimensions. The solution is to use a background image that is bigger than the one you are using now.

    Try this image as a demo:
    https://demo.purothemes.com/polestar/wp-content/uploads/sites/4/2017/03/site-speed.jpg

    Download it. Upload as a background image. Use Fill Screen as the Preset and select to center position. Does that display nicely on your screen? If the answer is yes then use similar dimensions. That image is 1440 × 1019.

    #7392

    clickmela
    Participant

    Sir now I have applied for fit to screen can u see the problem. Please answer where the image is coming full

    #7393

    clickmela
    Participant

    I have upload and use fit to screen can u see the problem why image not coming tip to bottom

    #7394

    Andrew Misplon
    Keymaster

    Good work.

    This will be the result with Fit Screen no matter which theme you use. When you use Fit Screen, this is the CSS output from WordPress, not Polestar, from the WordPress core:

    body.custom-background {
        background-image: url(http://clickmela.com/wp-content/uploads/2017/07/flowers-164860.jpg);
        background-position: center top;
        background-size: contain;
        background-repeat: no-repeat;
        background-attachment: scroll;
    }

    See this declaration: background-size: contain; Let’s look what that means: https://www.w3schools.com/cssref/css3_pr_background-size.asp.

    Contain:
    Scale the image to the largest size such that both its width and its height can fit inside the content area.

    Across the content area being the key word. So, if you’d like, try this with another theme, you’ll see, the result will be the same. If you want the background image to stretch from header to footer you should try using Fill Screen rather.

    Fill Screen will use: background-size: cover;. Let’s go look what that does:

    Cover:
    Scale the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area

    Summary: If you want to fill the entire area you must use Fill Screen because Fill Screen will use background size cover.

    #7395

    clickmela
    Participant

    I have tried in custom top left right. Etc. Its not working slight position change and when we apply fill screen see the result live. Now. Plz help. See pixel tear and full image content not appearing.

    #7396

    Andrew Misplon
    Keymaster

    This is all expected.

    Let’s look at your home page. The content length is 4055px long. But, your background image is 1272px long. In order to cover the entire area, yes, the background image has to be proportionally stretched, that is what is causing the pixelation.

    There is no special solution for this. If you temporarily change themes you’ll see the result will be the same. It’s important to understand what is happening which is why I spoke about the different CSS background-size properties earlier and sent a link explaining.

    So you’re with me? Content area of 4055px with background image of 1272px long (flowers) means pixelation. There is no way around this.

    (If there is an example website that you are looking at, send me the link, I can look at what they have done and explain it.)

    #7397

    clickmela
    Participant

    Meta slider work in free polestar theme

    #7398

    Andrew Misplon
    Keymaster

    Are you asking if Meta Slider works in Polestar? If that’s the case, yes, Meta Slider works in Polestar.

    #7401

    clickmela
    Participant

    In free version its not working for me how to bring the sliders in the header

    #7402

    Andrew Misplon
    Keymaster

    The Polestar header offers a logo, a menu and a search icon. There is currently no way to insert a slider or a widget into the header.

    #7407

    clickmela
    Participant

    But I think I saw a vedio on YouTube slider in ur theme and how to input search bar

    #7408

    Andrew Misplon
    Keymaster

    There is a YouTube video on our channel that shows how the Ultra theme / Meta Slider integration works. However that video is for the Ultra theme, not Polestar. Ultra also can’t insert a Meta Slider into the header.

Viewing 14 posts - 16 through 29 (of 29 total)

You must be logged in to reply to this topic.

Scroll to top