- This topic has 28 replies, 2 voices, and was last updated 7 years, 2 months ago by Andrew Misplon.
- AuthorPosts
- July 23, 2017 at 2:38 am #7389
clickmelaParticipantCan I mail screenshot to your mail
July 23, 2017 at 4:04 am #7390
Andrew MisplonKeymasterI 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.
July 23, 2017 at 4:32 am #7391
Andrew MisplonKeymasterWith 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.jpgDownload 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.
July 23, 2017 at 5:04 am #7392
clickmelaParticipantSir now I have applied for fit to screen can u see the problem. Please answer where the image is coming full
July 23, 2017 at 5:06 am #7393
clickmelaParticipantI have upload and use fit to screen can u see the problem why image not coming tip to bottom
July 23, 2017 at 5:10 am #7394
Andrew MisplonKeymasterGood 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(https://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 areaSummary: If you want to fill the entire area you must use Fill Screen because Fill Screen will use background size cover.
July 23, 2017 at 5:40 am #7395
clickmelaParticipantI 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.
July 23, 2017 at 5:45 am #7396
Andrew MisplonKeymasterThis is all expected.
Let’s look at your home page. The content length is
4055px
long. But, your background image is1272px
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 of1272px
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.)
July 24, 2017 at 3:33 pm #7397
clickmelaParticipantMeta slider work in free polestar theme
July 24, 2017 at 3:35 pm #7398
Andrew MisplonKeymasterAre you asking if Meta Slider works in Polestar? If that’s the case, yes, Meta Slider works in Polestar.
July 24, 2017 at 3:43 pm #7401
clickmelaParticipantIn free version its not working for me how to bring the sliders in the header
July 24, 2017 at 3:47 pm #7402
Andrew MisplonKeymasterThe 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.
July 24, 2017 at 4:03 pm #7407
clickmelaParticipantBut I think I saw a vedio on YouTube slider in ur theme and how to input search bar
July 24, 2017 at 4:05 pm #7408
Andrew MisplonKeymasterThere 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.
- AuthorPosts
You must be logged in to reply to this topic.