Jump to content

Vicks

Member
 View Profile  See their activity

  • Posts

    65

  • Joined

  • Last visited

 Content Type 

Everything posted by Vicks

  1. Vicks
    I cannot access the website. it says wrong password
  2. Vicks
    by the way, you can target individual links by their target ( href attribute ). if you are familiar with CSS, its written like this: [href='/path/to/your/link'] { your custom styles here }
  3. Vicks
    go to setting > site availability, choose password protected. give any password, and then you can post the link with password here.
  4. Vicks
    thats what came into my mind because articulate generates a static site. which you can host on netlify/github pages or S3, and then embed as iframe into your SS site.
  5. Vicks
    can you please share the website url. So I can check what is the font family in the other fields. It should normally be applied if you have changed it in the editor, but lets check in the code.
  6. Vicks
    Hi, I assume this code should add thick borders to every input boxes in the form. Because I no longer see the .field-element class in your form fields. For this, you can try changing the css to the following: .form-wrapper .field-list .field textarea, .form-wrapper .field-list .field input { background-color: #fff !important; border: 2px solid #000 !important; } !important is needed because I see that squarespace is applying a class directly to the input (for example: class="eTv7qUMqLR9lJxpIAC3F" ) and adding css. so you need to override it.
  7. Vicks
    Hi, can you try instead of injecting the code in the footer. Use the Code block to inject it on the homepage only. Its the same place where you add a block on text, or image. There is an option "code" to inject code into only one page.
  8. Vicks
    is it some custom css you are using? Can you share that?
  9. Vicks
    Found the issue: You have this position: fixed !important on header. which is also setting top:0; Thats whats causing your menu to disappear on mobile. If I remove the top:0, it solves the issue. is it done with custom css or is it squarespace default ?
  10. Vicks
    I see this: The topnav element is display:none. I am not sure what is causing it. because my script is only adding and removing a class called 'hide' in the #headerwrapper element. which is just moving it 100px up or down. it cannot hide the menu. Can you remove my script from the page, so that I can see the normal behavior? Also please send me the script which you have added to your website. Is it just this or is there some more lines ?
  11. Vicks
    I do not see any navigation menu on your website neither on desktop nor on mobile. Looks like there is no item inside the topnav element. ( see your website code attached in image) Are you using some other scripts also on your site which might be malfunctioning and removing it? The script I provided only moves the header up and down 100px based on scroll position, it does not remove anything from HTML. So there must be something else causing it. can you explain how do I see the nav menu? If its caused by my script, can you remove my script only and check if the menu appears again? because I do not see the menus at all.
  12. Vicks
    updated the original answer
  13. Vicks
    here is code for the button .list-item a.sqs-button-element--primary { letter-spacing: 0em !important; } .list-item a.sqs-button-element--primary:hover { /* notice the 0.5 in the last argument in the hsla, thats alpha, 0.5 means 50% transparent. */ background-color: hsla(289.41,92.73%,10.78%,0.5) !important; } This will update the hover color also.
  14. Vicks
    you can add code block and paste your embed code in it. https://support.squarespace.com/hc/en-us/articles/206543167-Code-blocks?platform=v6&websiteId=64431e6b45301c5a00f08373 there is also an embed type block. perhaps that might suit your need.
  15. Vicks
    where are you injecting this code? are you adding it to advanced > code injection panel ? if you add a code block using add button in the homepage. I think it will only work on homepage. OR try changing the second line by this: const landingSection = document.getElementById('block-yui_3_17_2_1_1682011830342_7436');
  16. Vicks
    were you able to fix this issue? whats the state of the website at the moment? If I want to give it anther try 😄
  17. Vicks
    <style> a[href="/the-rk-green-promise"] { color: green; } </style> This should do it. you can add this custom css. and if you want different color, you can replace the green with your color code.
  18. Vicks
    You can do this by using some JavaScript. The code below uses intersectionObserver to look if the first section is visible in the browser, and until its intersection the browser window, it keeps the class 'hidden' added to your logo. As soon as the section completely disappears from the browser visible area, it removes the 'hidden' css class from logo. In the .hidden class I have added visibility:hidden. or if you prefer, you can use display:none. Try both.. let me know if it works. <script> const logo = document.getElementById('site-title'); const landingSection = document.getElementById('block-yui_3_17_2_1_1682011830342_7436'); const observer = new IntersectionObserver(entries => { entries.forEach(entry => { if (entry.target === landingSection) { if (!entry.isIntersecting && entry.intersectionRatio === 0) { logo.classList.remove('hidden'); } else { logo.classList.add('hidden'); } } }); }); observer.observe(firstSection); </script> <style> .hidden { visibility: hidden; } </style> This shows the logo only once the first section is completely out of browser window. if you want it to display early, you need to tweak the intersectionRatio.
  19. Vicks
    You can add a block just before gallery, and add a heading in that block lets say "my work" and anchor the link to that block. that will scroll to the heading thus showing the gallery.
  20. Vicks
    If your font does not have dedicated bold style then on desktop the browser tries to render it automatically whereas on mobile devices it causes problem. You can try including: -webkit-font-smoothing: antialiased; if that does not help, then please provide some more details about how are you including your custom font in the site. does your @font-face declaration has bold style or not. To give an example, here is the declaration of font with the same name and different weights: https://www.smashingmagazine.com/2013/02/setting-weights-and-styles-at-font-face-declaration/#style-linking The link is pointing to the section where they have used two different files for different weights of the font. So when we use weight 700, it uses Ubuntu-B-webfont.eot font to render bold style and when you use weight 400, it uses Ubuntu-RI-webfont.eot for normal style. This way, the browser doesn't have to emulate the bold font from normal style.
  21. Vicks
    perhaps this might help: https://gist.github.com/vikramsoni2/2c9a255860e572db193eb6935834134f
  22. Vicks
    You can apply some custom css to not break the word on smaller screen. Here is some hint. If you provide website link and some detail where its happening, someone here can assist you better. https://developer.mozilla.org/en-US/docs/Web/CSS/word-break
  23. Vicks
    after this you will need to solve the positioning of link in Want Free Yoga card. 🙂
  24. Vicks
    I see you tried to move it using flex order attribute, but the issue here is that the price is not the part of the summary-content flex. its part of its child flexbx summary-excerpt. So it can move anywhere inside summary-excerpt using flex positioning and ordering, but it cannot be moved next to title because thats not inside summary-excerpt. I can suggest a simple css which will make it without worrying about flexbox. 1. make the summary-content position:relative, that means inside this DOM container anything we place using position: absolute will be placed relative to the position of summary-content. just add this line, in your css, you can include it in any previous css that you have already written. @media screen and (max-width: 640px) #collection-64165b0cfb51c6694bd1e502 .summary-content { position: relative; // just this line } 2. now we make the price container absolute positioned. @media screen and (max-width: 640px) #collection-64165b0cfb51c6694bd1e502 .summary-excerpt p:last-of-type { position: absolute; right: 0; top: 0; padding: 10px; } giving position:absolute will place it right next to the top left corner of the summary-content box. we add right:0 and top:0 to move it to the top-right corner of the box, and then we just add some padding so it aligns with the title.
  25. Vicks
    <script> let content = document.querySelector('.eventitem-sourceurl').innerHTML content = content.replace("Source: ", "Buy Tickets: ") document.querySelector('.eventitem-sourceurl').innerHTML = content </script> hope this helps
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources