- This topic has 11 replies, 3 voices, and was last updated 6 years, 3 months ago by
Mahesh.
-
AuthorPosts
-
June 2, 2017 at 11:46 am #116624
jacusczolgista
ParticipantHello,
Hope someone can help me. I use Full Frame theme on my website. Everything is great, BUT
I have an issue with the background image of the featured content
The image appears great on the laptop and on the previews for tablet and mobile, but when I actually view my website on my iphone or ipad the image doesn’t look good at all, just looks like a blurry zoomed in part of my image, not good.
Please help 🙂
June 3, 2017 at 6:30 am #116666Pratik
KeymasterJune 3, 2017 at 6:44 am #116669jacusczolgista
ParticipantHello,
yes sorry, should have done that before
jacobyrugs.co.uk
thank you 🙂
June 4, 2017 at 11:51 pm #116728Pratik
KeymasterHi @jacusczolgista,
Try following code in Appearance=> Customize=> Additional CSS box:
@media screen and (max-width: 767px) { #featured-content { background-position: center center; background-repeat: repeat; background-size: contain; } }
Let me know how it goes.
Regards,
PratikJune 5, 2017 at 10:54 am #116769jacusczolgista
ParticipantHello,
thank you, yes that helped 🙂
but
what’s the best way to display this image in the full background area but without having to repeat it…..is there a way of fixing it, so when scrolling the image is fixed, but the rest is scrolling, otherwise it would have to be a very high image….June 6, 2017 at 12:17 am #116802Mahesh
Keymaster@jacusczolgista: Current image is a landscape(horizontally long), so its kinda hard as desktop and mobile’s orientation is different. Do you have a portrait image of the same(vertically long)? If yes, please send me the url, and I’ll provide you the CSS.
Regards,
MaheshJune 8, 2017 at 4:54 pm #117132jacusczolgista
ParticipantHello,
what would be the ideal resolution or ratio of the image, I don’t have the same in portrait, but could get something else sorted and uploaded, but would like to get the resolution right 🙂
thank you 🙂June 9, 2017 at 2:27 am #117168Mahesh
Keymaster@jacusczolgista: I guess 490×750 works fine.
Regards,
MaheshJune 9, 2017 at 5:19 am #117190jacusczolgista
Participanthttp://jacobyrugs.co.uk/wp-content/uploads/2017/06/Persian-Rug-Cleaning-Rug-Repair.jpg
made it the size you said
thank you 🙂
June 9, 2017 at 7:50 am #117196Mahesh
Keymaster@jacusczolgista: Add the following CSS:
@media screen and (max-width: 767px) { #featured-content { background-image: url("http://jacobyrugs.co.uk/wp-content/uploads/2017/06/Persian-Rug-Cleaning-Rug-Repair.jpg"); } }
Regards,
MaheshJune 9, 2017 at 2:41 pm #117213jacusczolgista
Participantdid that and nothing happened, still the same image is displayed, not the new one 🙁
June 10, 2017 at 10:51 pm #117298Mahesh
Keymaster@jacusczolgista: I checked your site and cannot find the CSS I gave you above. Where have you put it? Let me know further.
Regards,
Mahesh -
AuthorPosts
- The topic ‘Full Frame: Featured Content Background Image on Mobiles’ is closed to new replies.