tomR0510 Posted October 27, 2020 Share Posted October 27, 2020 Site URL: https://www.dustycloudmusic.com/ Hello everyone, can someone help me please. The landing page is looking ok on my computer, but it's looking terrible on mobile device. How can I add a different photo for the mobile device version only please? Bonus question: Why the image quality is trash when I upload on squarespace? 😞 Thank you! 🙂 Link to comment
tomR0510 Posted October 27, 2020 Author Share Posted October 27, 2020 I'm the biggest noob when it comes to CSS code, I think I know where to add some CSS code to the website, but what is this one doing? Cause nothing changed when I tried it 😞 Thanks for your help tho! Link to comment
Beyondspace Posted October 27, 2020 Share Posted October 27, 2020 Hold on let me check your link again BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Beyondspace Posted October 27, 2020 Share Posted October 27, 2020 8 minutes ago, tomR0510 said: I'm the biggest noob when it comes to CSS code, I think I know where to add some CSS code to the website, but what is this one doing? Cause nothing changed when I tried it 😞 Thanks for your help tho! To answer the blurry images, I checked the image, it was too small I think, size is 1000x800 only when upload, so it scaled on big screen To add new image background 1. Upload new image and get its url here Using the CSS Editor – Squarespace Help 2. In your homepage, add a custom css like so Pages -> Gear Icon next to the page -> Advanced 3. Replace the image url with this code <style> @media only screen and (max-width: 768px) { .collection-type-template-page #outerWrapper { background-image: url( replace-this-text-with-image ); } } </style> BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
tomR0510 Posted October 27, 2020 Author Share Posted October 27, 2020 Thank you very much! It worked! Thank you for your help! Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.