HollyM

@tuanphan - thanks so much, that was strange, I've added !important again and it does work now.

Hi, Sorry to jump in as well but I've applied custom font to loads of webistes but suddenly it isn't working on one of them, can anyone help please? CSS used: @font-face { font-family: 'baby'; src: url('https://static1.squarespace.com/static/645379c7223c5220548322f0/t/64593930757b5d6ba534c9c3/1683568945577/OoohBaby-Regular.ttf'); } //ASSIGN baby to H4// h4 {font-family: 'baby';} I've also tried adding !important but tells me there is a syntax error when I do. Website url: https://sponge-paddlefish-2ln6.squarespace.com Password: MaryPreview The pink writing at the top of the homepage should be in the applied decorative font but isn't. I also can't make sense of it when inspecting the element. It appears to be formatted differently for some reason. Any advice greatly appreciated. Thanks, Holly

@tuanphan I had to hide them due to a website launch (the homepage looked bad with them in situ). I'm going to revisit this next week but imagine I'll have to pay someone to fix. Thanks for the offer of help though.

@tuanphan I've taken a different approach but now can't seem to move my social icons. I've split the nav using script: <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> jQuery(document).ready(function($){ $('.header-display-desktop nav.header-nav-list').clone().insertAfter('.header-actions.header-actions--right>.showOnMobile'); }) </script> <style> .header-display-desktop .header-actions--right .header-nav-list .header-nav-item:nth-child(-n+2) {display: none;} .header-display-desktop .header-title-nav-wrapper .header-nav-list .header-nav-item:nth-child(n+3) {display: none;} .header-nav-item:nth-child(n+3) { margin-right: 2.0vw; } .header-actions.header-actions--right * { opacity: 1; transform: unset; } .header-nav-item a { color: #ffffff; } </style> and css: /* left right menu align */ .header-nav-wrapper { text-align: right;} .header-actions.header-actions--right { justify-content: flex-start;} I need my social icons to move to the right hand corner (screenshot attached) with decent spacing between them and the nav items. Any idea how I could achieve this please? Or, if I would be better using different script then I'll be happy to try it!! Any advice would be greatly appreciated. Thanks, Holly

Hi @tuanphan, Yes, the website is on a business plan. I hadn't thought of that option, in the past the css I quoted above has worked (and is still working on other sites), so I'm a little confused as to why it isn't working this time. I've also tried far bigger z indexes but nothing is working. Thanks,

Site URL: https://www.hellohubble.co.uk I've added a split navigation to this site but the problem is that the nav bar appears to be over the logo meaning that half the logo is not responding to a cursor (i.e. it won't link to the homepage on the bottom half of the logo - the top half works). I've inspected the elements and feel that the z index I have for the logo should work, however, it isn't working at all. Please can anyone help? password: HubblePreview css used: //split navigation// @media(min-width:800px){ .header-nav { position: absolute; top: 40%; bottom: 0; margin-top: 0!important;} .header-nav-item:nth-of-type(2) { margin-right: 25vw!important;} .header-title-logo a { z-index: 1000000000 !important; position: relative; }}

Hi atiq97, would you be happy to share your solution please? I'm really struggling with a solution to the same problem as I can't use after to my CSS input and I'm not getting anywhere with the Javascript. Thanks.

I've solved it by creating a separate mobile stacked version but thank you for responding.

I've also been working on a counter but can't seem to make the counters mobile responsive as they have set boundaries on the page. I've also tried your code but have the same issues. I essentially need them to stack on mobile devices, do you have any ideas please? Thank you!

@amritanan Hi, yes I did figure it out (see image below). Lodgify don't make it easy to find the answer to this but you need to add an iframe to a code block. I had to contact the Lodgify help for the correct code so I'd suggest you try the same. At least it is doable and actually straight forward, just be careful with the iframe size on mobile, it can be a bit tricky! Good luck.

Sorry for reactivating this thread but I'm pretty new to the Circle and am trying to wrap my head around an embedded Lodgify calendar on a Squarespace page, did you manage to do this Anghared? I'm trying to display a Lodgify calendar on a page but can't seem to find the answer from Squarespace of Lodgify. Lodgify sent me an example of the following Squarespace website and it has an embedded calendar, how do I make this happen, any ideas?? Thanks! https://www.moorlandviewcottage.co.uk/prices-availability