Jump to content

NickScola

Circle Member
  • Posts

    50
  • Joined

  • Last visited

  • Days Won

    1

NickScola last won the day on July 4 2021

NickScola had the most liked content!

Personal Information

Recent Profile Visitors

287 profile views

NickScola's Achievements

  1. Sorry for the delay, try this: .gallery-grid--layout-grid .gallery-grid-item { position: relative; overflow: hidden; &:hover { .gallery-caption { opacity: 1; } .gallery-caption .gallery-caption-wrapper { transform: translateY(0); } } .gallery-caption { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.3); display: flex; align-items: center; opacity: 0; transition: opacity ease-in-out 0.25s; .gallery-caption-wrapper { height: auto; padding: 0 20px; text-align: center; transform: translateY(25vh); transition: transform ease-in-out 0.5s; } } }
  2. Can you share a link to the demo site you're currently working with?
  3. Instead of using the Name form field you can use a Text field and apply a placeholder value of name
  4. Yes, if you want to change the color of the LinkedIn SVG try something like this: a.icon.icon--fill[href*="linkedin"] svg { fill: blue; }
  5. Here's an example. Add this to the custom css and adjust where needed: a.icon.icon--fill[href*="linkedin"] { width: 124px; height: auto; }
  6. There's a couple ways to go about this. I suggest you use Javascript to create an entry in the localStorage, sessionStorage, or a simple cookie. Then if this entry or cookie exists you don't display the GIF. This way the user will only see the GIF upon initial / 1st time page load until the user closes out of the session, clear cookies, etc. Also, if you have AJAX enabled on your template you can detect if AJAX has been called. If it's been called then don't display the GIF. If you need help email me at nick@nickscola.com
  7. Make sure you convert your fonts to support all font types. Here's an example CSS font fact @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('webfont.woff') format('woff'), /* Pretty Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */ url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */ } You can convert your fonts and get them downloaded to these formats here: https://transfonter.org/ if it still doesn't work let me know, but it helps a lot if you do this first.
  8. It is possible, but you’ll need to use JavaScript to achieve this. You’ll want to fetch the JSON for each page and then render the content you need. Repeat this when the user scrolls past the last article or when the last article has entered the viewport. I can code up an example on Monday.
×
×
  • Create New...

Squarespace Webinars

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

Hire a Designer

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