Search the Community
Showing results for tags 'full-bleed'.
-
Site URL: https://daeverettgroup.com/ I've tried every code that I've found on the forum but none seem to work. Is there a way to get this slideshow on the homepage to be full bleed under the header? I've attached a photo of what it looks like before full bleed. -
Site URL: https://eagle-trumpet-4knc.squarespace.com/config/design/custom-css Hello, I would like to know how to incorporate custom CSS that allows for my slideshow to be full bleed- even within the header. Attached is a screenshot of what I have, and a screenshot from a website that has the style that I am going for. Any help would be appreciated, thank you! -
Hello! I looked through other posts regarding full bleed blocks and tried various proposed solutions that didn't work for me. I would like that video block to display full screen (as per my screenshot) Appreciate all you in the community! Current: Desired:
-
Site URL: https://www.evolvehumanlabs.com/ I currently have full-bleed static images on top of all my pages and they appear behind the header menu as well. For the homepage, however, I need to change the static image of the eclipse into a slideshow that scrolls between several images. The problem is that when I do this, it no longer bleeds behind the menu but, instead, a solid bar appears behind the menu and the slideshow underneath that. This creates an inconsistency with the rest of the website. I need the slideshow to appear behind the menu the way the static images currently are. Can anybody please point me in the right direction as to how to do this? I have searched high and low and cannot figure it out. Thank you so much in advance! :Alex -
Hi, What CSS code would be required to remove the bottom padding on a full bleed image? I would like the padding at the bottom removed, so my markdown block can sit right at the bottom of the image Thanks for the help.
-
Hi, I would like to show a full bleed video on the lock-screen. On pages i'm able to upload the video to squarespace and it works the way i want it to be. with text on top of the video when showing a video on the lockscreen that i had to upload to vimeo/youtube, it does not show full bleed , the password box is showing below the video. is there a way to do this, can anyone share the custom code ? I used this code for code injection, which displays the video but not full bleed <div class="plyr__video-wrapper"><video autoplay="" loop="" muted="" playsinline=""><source src="https://video.squarespace-cdn.com/content/v1/6161e6a92b253b6eddc1d2c0/94314c70-2583-40d1-acd5-b91b44889c9d/mp4-h264-1080:1080" provider="html5" size="1080"><source src="https://video.squarespace-cdn.com/content/v1/6161e6a92b253b6eddc1d2c0/94314c70-2583-40d1-acd5-b91b44889c9d/mp4-h264-360:360" provider="html5" size="360"></video><div class="plyr__poster" hidden=""></div></div> thank you for you kind help, appreciated! 🙂 URL is www.fio.re according to squarespace this is not a valid URL when submitting to the forum, i did configure the domain succesfully ....
-
Remove Whitespace between Gallery Images in Wells
Alnoor posted a question in Coding and Customization
Site URL: https://alnoormeralli.com/beauty In the Wells template, the Gallery pages have a fixed-width whitespace separating the images / thumbnails. Any way to remove the whitespace so the images appear "full-bleed"? I want a look similar to Project 5 in Version 7.1, but want to continue using the Version 7.0 Wells template. -
How can I get a full bleed slideshow block on mobile?
grizzy13 posted a question in Coding and Customization
Site URL: http://www.grismphotography.com I have a specific code that makes it so this slideshow only shows up on mobile and tablet devices, or screens smaller than 800 px. The issue is that the image is very small when viewed on mobile. I would like for the image to extend for the entire width of the page. In the image attached, I want the image to go to the red borders. This is a gallery slideshow block as part of an index page. I cannot add another gallery page because the block ID remains the same and will treat it as such. -
Site URL: https://www.goldenllamaproductions.com/rhythms-of-peru-video Like so many others, looking for a custom code to all the videos on pages like this be a full bleed video with sound. NOT a background banner video. https://www.goldenllamaproductions.com/rhythms-of-peru-video I want it to work like this: https://www.tylerkalberg.com/work-samsung-gear-anybody Thank you for any help!!
-
Site URL: https://www.marquesredd.com Hi there, I am trying to make the image currently on my homescreen of www.marquesredd.com completely full screen. The effect I am looking for is on this page but with a single image: https://www.linaviktor.com/ I would like the image to reach all edges of the screen and for it to cover the menu bar and title text like in the example link above. I would also like for the menu bar and title text to be white #FFFFFF. Any and all help is greatly appreciated!
-
Dropdown menu full height of the site
HandegardArkitektur posted a question in Coding and Customization
Hello 🙂 I'd like to know if I can make my dropdown menu as high as the site? On the chat with squarespace they've told me the height goes as far as the links in the menu itself but there's a way with custom code. Any ideas? Thank you so much in advance! -
Site URL: http://www.coachhenrylam.com My full size banner images are cropped by like 80% on 7.1 mobile. How do I fix it? I tried this 7.1 code but it didn't work /* CSS FOR TABLET AND MOBILE */ @mobile: ~"only screen and (max-width: 640px)"; @tablet: ~"only screen and (min-width: 641px) and (max-width: 949px)"; /* CSS FOR TABLET */ @media @tablet { /* Insert Code for Tablet Below This Line*/ /* Insert Code for Tablet Above This Line */ } /* CSS FOR MOBILE */ @media @mobile { /* Insert Code for Mobile Below This Line*/ /* Insert Code for Mobile Above This Line */ } Resizing Image Blocks Site-Wide .sqs-block-image { width: 80%; margin: 0 auto; } -
I'd like specific pages to have a full-screen landing video section. I want this video (or photo in other cases) to fill the entire window of the user. So regardless of the window size the video/photo will adjust so that the first section fills the entire screen (width and height). What code injection would I use for this and would I put it in the page header code injection or the design custom CSS setting?
-
Site URL: https://saffron-aqua-j5mp.squarespace.com/config/ Hi there, Could you please help me how to make an image as a full bleed card block like attached? This is for my homepage and the link is below: https://saffron-aqua-j5mp.squarespace.com/config/design Password: chichi2021 If you could help me with the custom codes or any solution, that would be great. Look forward to hear back from you. Cheers
-
Site URL: https://lifelab.world/landing-page-sample-1 Hello Squarespace experts! I am in need of help in doing a full width summary carousel block. I need to remove to the extra space on top and bottom. Please see picture below I have made the codes but it doesn't seem to work for me. I tried these section[data-section-id="6239c51561fe2a1158583990"] .content-wrapper { max-width: 100%; padding-left: 0 !important; padding-right: 0 !important; } AND #block-yui_3_17_2_1_1648549152222_22108 .content-wrapper { max-width: 92%; padding-left: 0 !important; padding-right: 0 !important; } May I please ask for help in fixing the code? thank you!
-
Site URL: https://lifelab.world/landing-page-sample-1 Hello Squarespace experts, I am in need of some help regarding creating a full bleed/width gallery carousel with autoplay. I have been doing some research and trying some codes from other threads. But I can't seem to find the right block/collection marker for this gallery. I am not sure if it is #collection-623066c3259d593e990d4272, #block-yui_3_17_2_1_1647341220455_3672 or #block-yui_3_17_2_1_1647427086839_509 I am not an expert, but with this community I am learning and try to solve on my own. I am just stuck at this one. Site URL: https://lifelab.world/landing-page-sample-1 These are the codes I tried that I also found in the answers from the community: 1. { #collection-61f13c374d7bc663be38628a .gallery-fullscreen-slideshow[data-width="full-bleed"] { height: 30vh !important; } 2. #collection-61f13c374d7bc663be38628a { .slide .imageWrapper img { width: 100% !important; left: 0 !important; height: auto !important; } .slide .imageWrapper { top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; }} 3. #block-yui_3_17_2_1_1647427086839_509 { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; } 4. body#collection-623066c3259d593e990d4272 { div#canvas { max-width: 100%; padding-left: 0; padding-right: 0; } I have attached a photo of the header gallery that I am referring to for reference and another gallery within the same URL. Please let me know if there is anything more needed. Thank you in advance! NOTE: I have added a code to remove the nav bar on the page header code injection for this page index. I am not sure if it affects the codes above <style> header.Header.Header--top { display: none !important; } </style> -
I want to create a section like the image on my clients homepage. Any coding that could help achive this look?
-
Make images full bleed when shown on a mobile
anjaemzen posted a question in Coding and Customization
Site URL: http://anjaemzen.com/ Hi! I was wondering if it's possible to add custom CSS to my Squarespace site, so that all the images are full-bleed when shown on mobile devices? And if yes, what CSS code do I need to add? Thanks a lot, I really appreciate it! All the best, Anja -
Site URL: https://amphibian-porcupine-6hk9.squarespace.com/interior-design-services-1 Hi! To make the full bleed photo at the bottom I used this code: #block-45a3f8f650e172ec1b38{ padding: 0px ! important; margin-top: 10% !important; margin-left: -20% !important; margin-right: -20% !important; } However, when I try and change the height the entire page gets messed up. Is there a better code to make this photo full-bleed & if not how can I adjust the height using the code I have now. Thanks!
-
How do I display a full bleed Vimeo playlist/showcase? Either horizontal order or vertical order?
-
Site URL: https://adamsonvisuals.com I'm revising my site and trying to get functionality like this site https://www.yannb.net/ which is also based on Wexley. When you arrive on the site you have a gallery of several images that auto scroll - in full page full bleed format. From there menu items will take you to regular image galleries of standard layout - just struggling to work out how to get the initial full bleed home page look - any advice? Seems simple but can't work it out. Thanks -
Site URL: https://amphibian-porcupine-6hk9.squarespace.com/interior-design-services-1 https://amphibian-porcupine-6hk9.squarespace.com/interior-design-services-1 I am updating a website and am having trouble making this full- bleed, I dont think it is supported by the template chosen, any help with code? Thanks, Lindsey
-
Site URL: https://www.celsodinizphoto.com/ Hi, Is there a way to make this page https://www.celsodinizphoto.com/new-page behave like this https://www.celsodinizphoto.com/behind-the-scenes or like this https://www.celsodinizphoto.com/videobts/ in the sense of using the whole real state instead of being limited to the max width size allowed on the style set up? Thanks! Celso. -
Adjusting Full Bleed Images to fit to Mobile Screen
SoniaSmith posted a question in Coding and Customization
Hi There, I am currently trying to make my website mobile friendly, however it will not allow images that fill the screen to shrink down to fit the mobile size. I used some code to remove unwanted padding and gaps on desktop, unsure if this has anything to do with the problem. Thanks! -
Site URL: https://optimum-time-dev-site.squarespace.com Hi! I am having a slight issue/bug appear on mobile and desktop after adding some custom-css to make an image block have two images side-by-side and full screen/viewport. Please see attached mobile screen view: Basically the first image is greyed-out in the CMS View and when viewing the website on desktop and mobile. It just fails to appear on page load, then appears finally on page scroll. The 'slide-in' animation I have set globally also fails to transition, I'm guessing this is purely down to the image not appearing? I've tried a few things in the custom css to target the image block independently but no joy. Any help or pointers would be much appreciated! And thanks to everyone who helped me get this far by adding custom css fixes to the forum, they have been so helpful in customising the out-of-the-box Squarespace templates. Oh, password is: OptimumTime Thanks in advance!
