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


Circle Member
  • Content Count

  • Joined

  • Last visited

Posts posted by briang97603

  1. On 11/2/2019 at 7:43 AM, brandon said:

    Hi @briang97603. This is achievable via either JavaScript or CSS. JavaScript would be more complicated and would require swapping src attributes and other attributes in order to make use of Squarespace's dynamic image sizing, ImageLoader. CSS is simpler if you only load a single, high-resolution alternate image via the background-image CSS property. Using media queries, you'd then hide the <img> itself via either opacity, visibility, position, etc. I suppose you could also use media-queries to load various alternate images of various resolutions/sizes if you really wanted to. Usually, with Squarespace sites, I tell people to just load a single high-resolution image because it's usually not significant compared to the collective size of the page.

    In any case, you can upload the images via file storage or via an image gallery collection, etc. Then, use those file paths as the alternate img file paths, whether using JavaScript or CSS.

    Thanks Brandon. That sounds incredibly complicated for my knowledge level. 

    The original question is in relation to advertising graphics on a news site. Does anyone out there have a simpler solution that might work for the same issue? Maybe the solution lies outside the Squarespace Platform and is placed in the site via a code?

    FYI: The site in question is www.KlamathFallsNews.org

    Summary of initial question: I want the ads (currently loaded into galleries) to change in dimensions based on screen size. (i.e. 160x600 on desktop 300x200 on mobile).

  2. Hello guys

    Like many websites, mine has skyscraper ads of which are ideally designed for viewing on a full screen browser but do not work well for mobile use. I have seen code that would allow single images to be responsive in that a skyscraper (160x600) can be replaced by a square (250x250) advertisement when the browser window reaches a certain minimum/maximum width. Is there such a code that can be done with galleries on Squarespace?

    For example - I want to have a slideshow gallery of rotating skyscraper ads display on browser screens over 750 px wide. Where anything narrower, I want to have a slideshow gallery of rotatng square ads shown in the same place.  Thus optimizing mobile viewing.


  • Create New...