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


Circle Member
  • Content Count

  • Joined

  • Last visited

  • Days Won


Posts posted by jasonbarone

  1. Yo Kathy-o, what's the goal of the Shop? Does it related to you or the Kathy-o brand in any way? I generally think about it in terms of overall brand. If KickinAss relates to Kathy-o, then I would keep them on the same website. If it's a completely separate brand, then keep them separate. I would remove the fact about it being an ecommerce site and focus more on brand. 

  2. This is very easy to solve. Simply modify the AjaxLoader prototype to add an additional custom init function right along side of where Squarespace runs their own block init.

    This assumes you've bound some sort of custom object that holds your init function(s). Sometimes to better to use some sort of custom event emitter for this, but that would be some additional dev. This seems much easier.

    window.onload = function() {
     this.AjaxLoader.prototype.initializeSqsBlocks = function () {
       console.log( "Foo!" );

    The end result is that when the ajaxloader fires, it will trigger the initializeSqsBlocks init as usual, which you've now hijacked to add your own additional init function.

    --Jason Barone
    Founder at Squarefront and Talk Squarespace.
    Host of Talk Squarespace Live Code and Talking Squarespace.
    Designer, developer, creator of all things Squarespace.

  3. This is indeed possible on any template regardless of what some users below are saying. Please clarify whether you need a Gallery Block full-bleed, or a Gallery Collection, and I'll provide the code. Gallery Block is my recommended choice and all that's required to make that full bleed is a few lines of CSS, and selecting a few options in the block.

  4. Hello everyone, I do not work for Wistia but use that with most commercial projects. Vimeo will work with this method, however they are adamant about NOT given developers access to hide the play button, which makes them not usable for this idea. That's not to say Vimeo wouldn't work with other methods though. Wistia's team also built this responsive, cropping video plugin: http://wistia.com/labs/crop-fill/ which makes it perfect for many great ideas, with little to no coding. The reason I did not suggest Youtube is because it requires playing with all kinds of video parameters.

  5. I noticed this thread surfaced again so I wanted to throw a simple, less technical idea for anyone who's not comfortable with coding. Here's a way to install background video into templates that have "Index" collections (Hudson, Pacific, etc).

    Index pages normally support Galleries, and if you only use one image/video in a gallery, it will normally span the entire width of the website. Also, Index pages will normally have a feature built-in that lets the navigation stay visible on top of the image/video if the Gallery happens to be the top position. This tutorial plays into that behavior.

    Step 1: Pick a template with an Index

    I picked Hudson. The Index is already there.

    alt text

    Step 2: Add a Gallery

    alt text

    Step 3: Add a Video

    alt text

    Step 4: Use Wistia.com or YouTube

    I uploaded my video, chose the following settings, and copied my embed code into the video in Step 3. I recommend Wistia.com because the built-in player has all the options you need, available with simple checkboxes. Vimeo could also be used, but if you use Vimeo's video player, they are firm about the inability to hide various items that appear on the video player. Wistia on the other hand, offers full control. YouTube also offers full control, but the process to get the correct code can be confusing because it requires using "video parameter" settings. This is the best article I have to explain: http://squarefront.com/addons/youtube-video-parameters, although it probably needs to be updated.

    alt text

    alt text

    And here it is, working on a completely default template. I do realize that many people want an editable content area to appear on top of the video. That is possible, with coding. I'll try to find a simple way to do that to extend the tutorial further.

    alt text

  6. I'm sure it's not exactly the answer you want to hear but this stuff is very easy to do with Javascript, once you learn it. Javascript libraries like jQuery, and even various scrolling plugins (which are just a collection of pre-packaged custom javascript), allow you to do all sorts of interactions based on what's called the "viewport" position. The plain-english translation of the effects are essentially something like this: when THIS element appears between these two locations of the browser viewport, apply this CSS.

    For example, this illustration from the Skrollr.js library lays out the position attributes you can use to control when an interaction takes place.

    alt text

    Skrollr is used on http://squarespace.com/seven. The start attribute has one CSS setting. The end attribute has another CSS setting. Skrollr animates the CSS from start to end. These animation don't need to be so complex though. They can be done with Javascript alone.

  7. I've seen this being thrown around as a solution to create a membership site. The only thing I wanted to mention here is that it's worth noting that Sentry will NEVER truly lock your content down because all content put into a Squarespace website is public in nature. There is no secured content. It's likely that non-technical users will never know the difference, so it really depends on the audience. That being said, in my opinion Tinypass.com is cool solution too.

  8. Mailchimp, although awesome, is slightly confusing to setup properly. Here are a few things that may help:

    Groups vs Segments vs Merge Fields


    Groups are Mailchimp's way of creating user-editable interest groups. It's important to note that these Groups are always visible by your user and are not recommended for tracking data that you're not comfortable with your user seeing.


    Segments are Mailchimp's way of creating internal lists of users based off of active search criteria. A user doesn't necessarily get added to a Segment through a field or opt-in. The user gets added to a Segment because that user falls within the search criteria of a currently active Segment. That being said, Merge Field data is the way to automatically place users into your Segments.

    Merge Fields

    Merge Fields are data fields in your list. When using Squarespace's Mailchimp integrations, the field mapping is not great, and sometimes causes issues. I've seen everything from fields not mapping, to Squarespace renaming my merge fields, to duplicate fields, to forms just not working.However, the point is to add fields to your lists for all sorts of data. Obviously you'll want the basics that your users can added themselves– name, email, phone, company, etc. But you may also want to pass hidden tracking data into Mailchimp Merge Fields as well. This can be done on Squarespace using Form Block "Hidden Fields".

    Squarespace Help Doc: http://help.squarespace.com/guides/how-do-i-track-referral-sources-for-form-block-submissions

  9. To do this, you'll want to create additional Squarespace "Contributors" as per this article: http://help.squarespace.com/guides/adding-and-managing-contributors

    Each user you create will be associated with the email address you used during signup.

    If you assign the proper contributor permissions these accounts will receive Commerce notifications by default (I think). If not, just login to that user account and turn on the notifications as per this article: http://help.squarespace.com/guides/how-do-i-enable-email-comment-notifications

  10. I created a CSS addon for any template that will convert Menu Blocks into Price Charts. Try this: http://squarefront.com/addons/price-charts-squarespace-menu-block-version

    I'm in the process of rewriting a lot of addons, so this is sort of beta, but hopefully it can help.

    I'm redoing the code to support titles and additional prices. The Menu Block is a bit quirky in how it converts text/numbers into code.

    Here's an example of one done with Code Blocks. The website template is a prototype for one that will be available for sale at Squarefront.com http://coreviewtech.com/pricing/

    Jason Barone

    Designer, Developer, Squarespace Expert
    Founder, Squarefront, Talk Squarespace
    Host, Talking Squarespace, Unauthorized Squarespace Show

    alt text

  • Create New...