Search the Community
Showing results for tags 'mobile'.
-
Banner Image Won't Resize for Mobile View
TheIDBootCamp posted a question in Coding and Customization
Hello, Our banner artwork appears fine on our site when viewing on a computer screen, but the mobile view does not resize the banner and cuts off the bulk the image versus resizing for the mobil platform. Any tips on why this is happening, and how resolve it? We've found that the majority of site visitors use mobile, and don't want to reduce the impact of the image. Thanks in advance. -
Site URL: http://www.ryanballphotography.com Hi there, I have setup my homepage with three images as a grid:overlay. I have set this to show text after I hover, this is perfect for desktop browsers and I don't want to change this. However for mobile devices, the text doesn't show (as the hover function does not work on touch devices). I therefore want to change this to "show text before hover" for mobile browsers, without affecting the desktop browser. So how do I keep "show text after hover" on the desktop browser and "show text before hover" on mobile devices. I'm using squa
-
Media query show/hide page not working on mobile
GregLassale posted a question in Coding and Customization
Site URL: https://gregorylassale.com I created two versions of my homepage: "homepage-medium" for large screen. "homepage-small" for mobile. I am trying to sho/hide the correct version via media query. It's working on my desktop but not my tablet. @media only screen and (max-width: 1194px) { #homepage-medium { display: none; } } @media only screen and (min-width: 1195px) { #homepage-small { display: none;} } I have tried different breakpoints, but on mobile (iPad) either both versions are shown or only "homepage-medium" (instead of "homepage-small"). I am -
Site URL: https://www.ambiancecurator.com/interviews Hello, I would like to use a custom CSS code so that my "Interviews" tab and "Blog" tab show the different posts in two columns (side by side) on the mobile only. Does anyone know the custom css code for this? -
I have created a 2 page website in 7.1. I want to disable the mobile breakpoint of 991px and just keep the regular menu bar visible as there is only 1 button to a contact page on there. Does someone have the CSS code to disable the mobile menu in 7.1 since there isn't an option to set it to 0px in the style editor?
-
Changing size of one banner heading for mobile only
GenuineContent posted a question in Coding and Customization
So I am building a website using the Impact template in the Brine family. I kept much of the original formatting, as it worked well for my client, including the large block header 1 format. However, one of my banner page titles has a word ("recreational") that is too long for the mobile view and getting cut off or wrapped mid-word (I included a screenshot). How do I change the font-size only on this page, and only for the mobile view? I don't want the font-size to change on the full-screen size; and I want the other mobile-view page title font-sizes to remain the same. Site: Recreational -
Site URL: https://www.jivamorelife.com Hi! I am trying to show multiple product blocks per row in mobile view. When I am in the web view, I have 4 blocks, but when I switch to mobile, they stack and are only 1 per row. How can I show 2 or 3 product blocks per row on mobile? For example, I am trying to do it on this page: https://www.jivamorelife.com/watercolor-splatters
-
I am using an image card wrapper template which looks great on desktop but when we get down to mobile the text content is far too long and stretches the wrapper which makes it a difficult experience for the end user. I wondered if there was a way to target these particular blocks that allowed me to reduce the number of characters contained within the text block so that it doesn't stretch the wrapper. Any help or advice would be greatly appreciated, thank you very much. -
Site URL: https://tuba-octopus-s32b.squarespace.com/ Hello friendly helpers! I'm working on this website and managed to add a background image to the navigation. Is it possible to add this on the mobile version behind the logo, like a header? I already have a plan B, the image is now in the navigation, but I would love to add it as a header. It should look like the attached example. I'm using a brine template: https://tuba-octopus-s32b.squarespace.com/ The password is: umoweb It would be nice, if anyone could help me.
-
Site URL: https://www.maslowproject.com/ Hi, When you use a mobile fallback image with Squarespace, the mobile fallback image pops up first before the video loads from either YouTube or Vimeo which looks awkward. Is there any way around this without using custom code. If not, does anyone know the css that will enable this? Thanks for taking the time to reply. Frank -
Site URL: https://seabltd.squarespace.com/ On desktop the block content is in a zig zag order. First section shows as below: Second sections shows as below: However on the mobile we want the order to show as 1. Image, 2. Heading, 3. Body text, 4. Keywords, 5. Button. It shows like this for th e section where the images are aligned left but not for the section section where the images are aligned right.
-
Disable Mobile Styles in Degraw - HEEELP!!!
meagangonzales posted a question in Coding and Customization
Site URL: https://www.viprec.com/ I would like to disable the mobile style on my website, but unfortunately, the template I use doesn't have that option. That being said, is there a code I can input? I would like my website to look like it does on the computer on a phone. Thanks! -
Site URL: http://www.berlinheadshots.com Hi Everyone! Trying to take away (or at least reduce below 17) the padding around a gallery on a mobile site only. Goal is for it to look more like a banner, and in the process giving a greater space for the images sit in. Attached is how it currently looks! Template is Nueva. Any tips welcome! ps also does anyone know ifs there's code to stop the words from hyphenating?!!! super annoying!
-
Changing Product Layout on Shop Pages for Mobile
ImmyH posted a question in Coding and Customization
Site URL: https://www.immyhowardmillinery.com/bandanna-bows Hi there, I am in the process of building some product pages on my website (the current products listed are demos set up by my Squarespace template and are unlinked, but the pages are enabled) and the current layout of my products is 3 per row on Desktop view. I am trying to alter the mobile view of my product pages to have 2 products per row, instead of 1 product per row. Is there a way I would be able to do this? Any help would be much appreciated. I am very new to using Squarespace so apologies if I have overlook -
Remove left/right margin from gallery images on mobile
IdeaFrau posted a question in Coding and Customization
Site URL: http://ideafrau.com I would like the images on mobile only to bleed to the edges of the website—but keep my text as is. Is this possible with custom css? -
Remove spacer blocks using CSS, on one page only
David_Cass posted a question in Coding and Customization
Site URL: https://davidcass.art/latest Hello. On this page (davidcass.art/latest) I've deliberately used a staggered design. On laptop, desktop & tablet, I'm happy with this. On mobile, however, the placing of the spacers makes uneven gaps between the artworks. Is there a way to ignore spacer blocks on mobile on this single page? I can't do this site-wide as I rely on spacers elsewhere in my site. Thanks so much. David -
Site URL: https://www.kendracampbell.com.au/home2 Hi! I have dropped in some custom made icons using the markdown block (I did this rather than an image block so I could keep the icons as svg). What I am now trying to achieve is to have these blocks break into two columns on mobile. Currently they just stack one on top of each other but that just makes it seem like you're scrolling for ages to get past that section. If anybody has any idea how to achieve this it would be greatly appreciated!
-
Site URL: https://kargo.com/test-mb Hello, I've noticed that the mobile fallback image I've dropped into the banner area of this page shows on desktop before the video plays. Is there a way to disable this? Also, what is optimal size / aspect ratio for the mobile fallback image? I'm noticing that the currrent image is far too wide on mobile. See header are of https://kargo.com/test-mb
-
Site URL: https://sunflower-endive-zddl.squarespace.com/ Hi everyone, Wondering if anyone can help me rearrange the text I have set up in a particular section on my Home page to make it more mobile friendly. It's supposed to mimic buttons but I just placed a border and some padding around each word to create that effect. They are lined up in a row perfectly on desktop, but on mobile, each word is on a different line and I'd like them to be side by side if they fit. I'll attach an image of the effect I'm trying to achieve. Any advice or help is greatly appreciated! I've been
-
Site URL: https://lion-pike-eywa.squarespace.com/ Hi, I'm trying to resize the banner image on my website for mobile so that the logo doesn't crop off in this display. I'm a beginner at CSS codes and have tried several codes i found online, of which none seem to work. Here's one I'm currently using: @media only screen and (max-width:640px) { #block-55e89da83b15440928f7 {width:0%; margin:auto}} Can someone help me figure out what I'm doing wrong? https://lion-pike-eywa.squarespace.com/
-
Lots of folks have asked a similar question in different ways and there don't seem to be answers posted, so I figured I'd try again. This community is such an amazing resource! I am wondering if there is a way to use CSS to swap the order of blocks in mobile view so that you can specify some blocks to stack right to left rather than the standard left to right. So something like: @media only screen and (max-width: 640px) { //identify blocks you want to swap and change their order } My site is informd.co.in or informd.squarespace.com . Here's what I want to do specifically (on
-
How can I make my website logo show *only* when on mobile?
venuswtlau posted a question in Coding and Customization
Site URL: https://www.venuswtlau.com/ Currently, when I add a mobile logo to the header, it shows both the website title and the mobile logo. What I want is for the site title to show on desktop and the logo on mobile. Thanks in advance! 🙂 -
Site URL: https://www.maslowproject.com/ Hi, We are using a video background for our homepage (hosted on Vimeo) and when it shows up on mobile devices, it looks awkward. Is there any way to adjust the focal point of the video background like we can currently do with a mobile fallback image? If you have found a workaround for this, thanks for taking the time to reply. Best, Frank
-
Site URL: https://www.maslowproject.com/ Is there any way to change just the mobile background color and not the desktop background color? What is happening is that our background video is not playing when using Firefox mobile and just a white background color is showing up. When I change the background color on desktop from white to another color, it looks awful. I need the background color white on desktop and ideally need to just change the color when using mobile devices. If you've found a solution to this, thanks for taking the time to reply. Best, Frank
-
Site URL: http://www.plantologyflorist.co.uk Hi, is there a way to remove the mobile top background that is currently green? I would like it to just be the hero image with logo, menu and cart overlaid. Thanks
