Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

benmeaker

Circle Member
  • Posts

    5
  • Joined

  • Last visited

  1. Hey Tuanphan, Thank you SO much! This worked like a charm! Woohoo! Really appreciate your help. Thanks again
  2. Site URL: https://www.znthtriclub.com Hi there, I'm desperately trying to add some form of "wrapper/banner/bar" on both the very top and very bottom of my website. I've currently managed to do so by hacking (in a rather bad way!) the announcement bar and footer modules. You can see this on the website and I've attached the image I'd like to use for reference. The issue I have is twofold: 1) The top banner isn't the same as the bottom 2) When scaled down to mobile, it looks terrible and there's a hideous black line beneath the top banner. Any help in coding something less clunky would be greatly appreciated. Thanks in advance. Cheers, Ben
  3. Thank you sooooo much! That worked a treat. You absolute legend. Thanks a ton.
  4. Hello Bangkank36, Thank you so much for taking a look at this for me, and for coding this up! Truly appreciated. I've injected the code below into the Custom CSS but alas, it doesn't seem to be working. There's now a box that appears on the page instead. Not sure what I'm doing wrong! Thanks so much. /* Join button */ .header-menu-cta * { width: 100px; padding-bottom: 19%; height: 0; position: relative; margin: 0 auto; } .header-menu-cta .btn { background-image: url(https://static1.squarespace.com/static/5fd7b9876223c8317d1720c2/t/60623f6139ba8b041474c9b6/1617051489136/join-us.png); background-size: contain; background-repeat: no-repeat; background-position: center center; position: absolute; left: 0; top: 0; margin: 0; padding: 0; width: 100%; height: 100%; min-width: inherit; } .header-menu-cta .btn:hover, .header-actions-action--cta:hover { opacity: 0.7; }
  5. Site URL: https://www.znthtriclub.com/ Hi there, I'm hoping someone way more knowledgeable than I am might be able to help with the issue I'm facing. In short, I'm trying to replace the standard CTA button one can have in the nav bar with a bespoke image, such as the one attached here for example. Ideally, I would love this image to change depending on the page you're own (i.e. a lighter version for a darker page, and vice versa) as well as the option of having a hover action. It also needs to work on mobile. You can see on my current website where I've got to. Basically, I've managed by boshing together some CSS taken from various bits and bobs I could find on the web. It's not pretty but at least I have an image for my CTA. The issue right now is that it doesn't work on mobile, there's no hover and I can't apply a different colored version for other pages. Here's the code I used in the Custom CSS field. /* Join button */ .header-actions-action--cta * { background: transparent !important; color: transparent !important; } .header-actions-action--cta { background-image: url(https://static1.squarespace.com/static/5fd7b9876223c8317d1720c2/t/60624222fc4584071e57dd8e/1617052194489/join-the-team.png); background-size: 100%; padding: 2vw; background-repeat: no-repeat; background-position: center center; } Any advice, tips or tricks would be immensely appreciated! Thank you so much, Ben
×
×
  • Create New...