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

clayyount

Circle Member
  • Content Count

    263
  • Joined

  • Last visited

  • Days Won

    3

clayyount last won the day on August 15 2016

clayyount had the most liked content!

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. You don't need anything in the content string, but you need to change our the css selector to match your images's classes. .image-block-wrapper:hover img.thumb-image[data-image="IMAGE_URL'] was for hannamathilde's site, and probably doesn't apply to yours.
  2. Use the code, but change: window.open(this.getAttribute("data-clickthrough-url"),'_blank'); to window.open(this.getAttribute("data-clickthrough-url"),'_self');
  3. It's probably someone in developer mode. It may be based off a current template, but it looks like when you switch to developer mode, your site gets a unique template id.
  4. This Custom CSS will vertically align the text in a consistent button height and gives the text a nice line-height. Good for a grid: .sqs-block-button{ display:table; min-height:60px; } .sqs-block-button .sqs-block-button-element--small{ display: table-cell; vertical-align: middle; line-height:1.2em; }
  5. Sorry, I edited it again to target the specific image URLs so you can move the content around on the page without breaking the code.
  6. Edited my answer to allow for multiple background images
  7. Custom CSS code. This increases font size of the list of selectable items: .form-wrapper .field-list .field .option{ font-size:18px; } This increases the text in the message area: .form-wrapper .field-list .field .field-element{ font-size:18px; } Change the font size from 18px to whatever your preference is.
  8. It's technically possible, but the "+ Legg til fler/+Add More/" part of the dynamic form you linked isn't very easy to replicate. First the good news: dynamically changing input or hidden field values based on sliders, radio buttons, and so on is relatively easy with some JavaScript injection code to manipulate the DOM, the tricky part is dynamically adding new fields. When you create a form block, Squarespace registers its parameters with the backend, and will only recognize the set amount of input fields you used to build it on submit. You can use JavaScript to dynamically add fields to the form in the DOM, but Squarespace won't recognize them, and will submit the form without passing their values. HOWEVER, you should be able to create a hidden form field in the Squarespace form builder, use JavaScript to dynamically add/remove input fields, then set the newly created fields to concat their values and dynamically change the hidden field. It's not super elegant, and requires a good amount of custom JavaScript code, but it should be technically possible. Unfortunately, there is no out-of-the-box form builder solution that will work with Squarespace forms, so making this work will require you getting your hands dirty with JavaScript. Hope that helps.
  9. No problem, I edited my answer above to allow for looping and speed control. Make sure you remove the old code so it works correctly. Change the duration variable to your desired milliseconds between transition. Unfortunately, there's no easy way to do a fade effect.
  10. You can't change the spacing of the text-decoration underline since that is determined by the font. However, you can use a 1px bottom border instead like so: #main-navigation ul li.active-link>a{ border-bottom: 1px solid YOUR-LINK-COLOR; color:YOUR-LINK-COLOR; padding-bottom:1px; }
  11. There is a way to do it using the default gallery. It requires doing an ajax load on the gallery json to get the clickthrough urls and then some DOM manipulation to change the thumb click event. Put the code below in your page header code injection for the page with your gallery: <script> var currentPageBaseURL=window.location.href.split("?")[0]; Y.on("domready",function(e){ Y.io(currentPageBaseURL+"?page=1&format=json-pretty", { on:{success: jsonLoaded} }); function jsonLoaded(err,data){ try{ var jsonResponse = Y.JSON.parse(data.responseText); var items=jsonResponse.items Y.all("#thumbList .thumb, #galleryWrapper .slide").each(function(e){ var thumbId=this.getAttribute("data-slide-id"); for(var i=0;i<items.length;i++){ if(thumbId==items[i].id && items[i].clickthroughUrl){ this.setAttribute("data-clickthrough-url",items[i].clickthroughUrl).on("click",function(e){ e.preventDefault(); e.stopPropagation(); window.open(this.getAttribute("data-clickthrough-url"),'_blank'); }) } } }) }catch(e){} } }); </script> EDIT: updated it to work on mobile too.
  12. Use this Custom CSS: @media only screen and (max-width: 800px){ .sqs-lightbox-meta{ opacity:1!important; z-index:100000001; background: rgba(0,0,0,.7); } }
  13. You can do this with just Custom CSS: EDIT:I realized it's probably better to just target the actual image urls as opposed to their row: .image-block-wrapper:hover img.thumb-image[data-image="http://static1.squarespace.com/static/533fb429e4b0aa2aaadd87ca/t/551ace0be4b05d27e545eaf5/1427820045453/flagship.jpg"]{ content:""; display:block; background-size:cover; /* FIRST IMAGE*/ background: url(YOUR_IMAGE_URL) no-repeat top left; } .image-block-wrapper:hover img.thumb-image[data-image="http://static1.squarespace.com/static/533fb429e4b0aa2aaadd87ca/t/551ace62e4b01144c47b8ffd/1427820132658/78.jpg"]{ content:""; display:block; background-size:cover; /* SECOND IMAGE*/ background: url(YOUR_IMAGE_URL) no-repeat top left; } .image-block-wrapper:hover img.thumb-image[data-image="http://static1.squarespace.com/static/533fb429e4b0aa2aaadd87ca/t/551ace30e4b01144c47b8e4d/1427820082298/"]{ content:""; display:block; background-size:cover; /* THIRD IMAGE*/ background: url(YOUR_IMAGE_URL) no-repeat top left; }
×
×
  • Create New...