HOMENCREATIVE

@tuanphan I added the code but nothing happens. Is it possible that there is code conflicting with it?

@tuanphan I noticed you provided solutions for a lot of similar scenarios. Is this something you can help with?

I am trying to help a client troubleshoot an issue viewing gallery grid captions on mobile - I did not design the original website or add the original code. It looks like they are using a plug-in code injection for the lightbox effect, so I'm not sure how to adjust it for mobile here. I would like the Gallery Grid captions to appear below the image lightbox for mobile and iPad only vs on hover. Currently, it just shows the image and there is no way to view the caption bio on mobile or ipad since the "hover" effect does not work for these devices. Is this possible? The website URL is https://www.experiencemomentum.com/about#team and I need this to work for all the gallery grid sections since there are several.

@tuanphan I saw you responded to a similar issue in a different thread. Any idea why this might be happening?

I cannot get the text and add/remove buttons in the shopping cart to appear! Even though I've edited the site style to be navy text, everything appears white and cannot be seen. I tried adding custom code but it kept changing the font color of the footer, too. I don't see any font color assignment sections for the shopping cart when editing styles either. Please help! Password: teamorder URL: https://www.blueprintcookie.com/team-member-ordering

@Ziggy hmm, I see! So do you suggest I not use this method and create the auto-scroll using individual images?

@Ziggy sorry about that, I added ot to the forum post so I thought it included it! https://www.tasteedmonds.com/home-2024

I've successfully added CSS code to have an auto-scrolling logo carousel. I created the effect by creating two files that are 3000px wide X 300px H using a Canva template with the logos spaced evenly instead of uploading individual logos to avoid spacing issues. For some reason, the auto-scroll is showing off of the webpage when I scroll my mouse to the right. I cannot figure out how to fix this! Help! I created the effect by using the following code to custom CSS. /* Infinite Logo Scroll */ #SECTIONID .gallery-reel-list { animation: scroll 20s linear infinite; display: flex; width: 3000px; overflow: visible; } @keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-1500px); } }

@tuanphan I got the resizing of the image to work, but I'm struggling to figure out how to increase the wrapper size so that it doesn't cut off part of the image on the top/bottom (see far right 'Souvenir Shop') See image below. www.cafe-club.squarespace.com password: cafeclub

@paul2009 URL: www.cafe-club.squarespace.com password: cafeclub

@paul2009 I used your code successfully, however I had to increase the height of the button and add padding to the text to center it because it was showing up very narrow! Just FYI. Secondly, for some reason, it's showing a fill behind the text of the button even though I've updated both the "color" and "background-color" correctly. Any idea why this is happening? The code I have is: /*MOBILE STICKY FOOTER CTA */ /* Mobile CTA bar - Squarespace 7.1 */ /* Left (secondary) button colours */ .sf-mobile-cta-btn:nth-of-type(1) { background-color: #000000; color: #fffff; font-family: "Futura-PT"; font-size: 1.2rem !important; //size font-weight: 600 !important; // padding-top: 13px!important; } /* Right (primary) button colours */ .sf-mobile-cta-btn:nth-of-type(2) { background-color: #006837; color: #ffffff; font-family: "Futura-PT"; font-size: 1.2rem !important; //size font-weight: 600 !important; // padding-top: 13px!important; } @media only screen and (max-width:800px) and (orientation: portrait) { .sf-mobile-cta-wrapper { display: block!important; } } .sf-mobile-cta-wrapper { background: #ebebeb; bottom: 0; left: 0; position: fixed; width: 100%; z-index: 10; transition: bottom .3s; } .sf-mobile-cta { display: flex; flex-direction: row; align-content: center; justify-content: center; height: 50px; } .sf-mobile-cta-btn { flex-grow:1; flex-basis: 0; text-align: center; } /* End of navigation hover effect */

@tuanphan works perfect, thanks kindly!

@tuanphan thank you so much, it works!!

@tuanphan I have a similar issue and can't seem to figure out to fix it! I have a gradient header, and made the opacity 100% for the 1st section background. But I want to get ride of the weird line showing between header and section #1. Any idea? Website : www.cafe-club.squarespace.com password: cafeclub

@tuanphan thank you it worked! How do I adjust the size of the image?