nick_sh Posted July 4, 2022 Share Posted July 4, 2022 Is there a way to detect if the page is in editing mode (e.g. button EDIT was clicked) with JavaScript? I used to check for .sqs-edit-mode class with JS, but it doesn't seem to work anymore. document.body.classList.contains('sqs-edit-mode') returns false every time now, but I swear it was working month or two ago. Link to comment
creedon Posted July 4, 2022 Share Posted July 4, 2022 This is how I check in my code. if ( window.frameElement !== null ) return; // bail if in preview Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
paul2009 Posted July 5, 2022 Share Posted July 5, 2022 (edited) 14 hours ago, nick_sh said: Is there a way to detect if the page is in editing mode (e.g. button EDIT was clicked) with JavaScript? I used to check for .sqs-edit-mode class with JS, but it doesn't seem to work anymore. Your code is still valid. However it is worth noting that it checks whether the site is in edit mode (in other words you are logged in to the site. It does not check if the page is in edit mode - when you click the EDIT button to edit page content. Creedon's suggestion will also work, by checking if it is running in a frame. Squarespace also has a built in way to check specifically for the Config frame: Y.Squarespace.Utils.isInDamaskFrame() Edited July 5, 2022 by paul2009 creedon 1 About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. Link to comment
nick_sh Posted July 7, 2022 Author Share Posted July 7, 2022 @creedon's suggestion seems to be working, thanks! @paul2009 for some reason Y is undefined. I'm inserting code in the footer. Link to comment
creedon Posted July 7, 2022 Share Posted July 7, 2022 4 hours ago, nick_sh said: for some reason Y is undefined. I'm inserting code in the footer. I have noticed lately that Y seems to be initialized later in the page load cycle. Not that I've used Y a lot so this is just an impression. I think this is on v7.1 sites. I think v7.0 sites are mostly unchanged. paul2009 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
paul2009 Posted July 8, 2022 Share Posted July 8, 2022 16 hours ago, creedon said: Y seems to be initialized later in the page load cycle. Exactly 🙂 The JS needs to include the proper checks to ensure everything has loaded. No site URL was provided in this thread so I wasn't able to check the code being used. About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links. Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.Improve your online store with our extensions. Link to comment
nick_sh Posted December 8, 2022 Author Share Posted December 8, 2022 On 7/4/2022 at 10:59 PM, creedon said: This is how I check in my code. if ( window.frameElement !== null ) return; // bail if in preview Let us know how it goes. Seems like Squarespace is inserting another iframe now – do we need to target by id or something? Link to comment
creedon Posted December 8, 2022 Share Posted December 8, 2022 10 hours ago, nick_sh said: Seems like Squarespace is inserting another iframe now – do we need to target by id or something? I've not seen any issues with my check code. It is pretty basic though and one could certainly check more deeply for ids or classes. If you have a particular use case where the basic check fails, we'd be interested in seeing it. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
sophietnc Posted March 31 Share Posted March 31 I tried to implement this in my own header code injection, but is does not seem to work. Where should I exactly place this line of code? This is the code i want to run outside of edit mode only: <script> window.onload = function() { var nextArrow = document.querySelector(".summary-carousel-pager-next"); function clickNext() { nextArrow.click(); } setInterval(clickNext, 3000); }; </script> My next issue was that I wanted to control the time that it takes to rewind the carousel. I did this by changing the code to this: window.onload = function() { let nextArrow = document.querySelector(".summary-carousel-pager-next"); let prevArrow = document.querySelector(".summary-carousel-pager-prev"); let clickCount; function clickNext() { nextArrow.click(); clickCount++; }; function goBack(){ clickCount = 0; prevArrow.click(); prevArrow.click(); }; function clickHandler(){ console.log(clickCount); if(clickCount <= 2){ clickNext(); }else{ goBack(); } }; setInterval(clickHandler, 3000); }; Link to comment
creedon Posted March 31 Share Posted March 31 9 hours ago, sophietnc said: Where should I exactly place this line of code? Generally you'll want to put the check in as the first line of your function. That way the rest of the code in the function won't run. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment