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

Search the Community

Showing results for tags 'jquery'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location

Found 15 results

  1. Hello there, I have written a javascript with some jQuery to call an api and get some data to be rendered when a user clicks on a specific page. I have put this code inside the header of code injection section. But the problem is the script seems to execute only when user access the site the first time, not when they are accessing that specific page. Can anyone be able to help me out to have a workaround to this problem?
  2. Hi all, Site URL: https://www.brookebuilt.com/ The home page contains a gallery. 2 images have description. On select images, there is a info icon at top right corner. When clicked, the image shrinks and description slides out. Now I want to have the description showing up WITHOUT clicking the info icon. I don't find any settings regarding the info icon behaviour. I also tried to inject jQuery to simulate the click, but the debug console gave me this error: Thanks for your help in advance.
  3. Hey all, Just thought I'd share my little hack to create navigation on a group of subpages belonging to the same folder in the main navigation. Disclaimer: This was done in somewhat of a hurry, and I haven't used jQuery in a long time, so there's likely a more efficient way to code it. If you know or come up with a better way, please do share it! The way to use this, is simply by creating a folder in the main navigation with pages in it. Then on each page, using the code block, insert a DIV with the ID "pageMenu". Then add the code below using code injection to all pages (Settings > Advanced > Code Injection) in either the Header or Footer, making sure to replace "yourdomain" with – you guessed it, your domain 😉 The code first checks if a DIV with ID "pageMenu" exists on the page currently being viewed. If it doesn't, the code won't run. If it does exist, the code then looks through all Main Navigation folders for a match between the current page url and links inside those folders. If one is found, that parent folder's code and all the links inside it (basically a UL list) will be appended to the DIV with ID "pageMenu". All you need to do then is style it using some custom CSS. Also, I wanted to make it possible for the guy responsible for the content on this site to hide any folders with subpage menus on its pages. So to do that, using this code, all he needs to do is name the folders "Foo" (feel free to change this). If you do this, chances are you might want to also hide the folder name from the new page menu, which the code below also does. FYI 1: Of course no code is actually moved, as you can see by viewing source on the resulting page, the page only acts as if it was. FYI 2: You may need to tweak the selectors a bit depending on which template you are using, since not all main navigation menus are constructed the same way. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ //Move Main Nav folder where current page is a child to wherever an object with ID "pageMenu" is placed manually on page if ($("#pageMenu").length){ //Get current page url without domain var canonical = $('link[rel="canonical"]').attr('href'); var pageurl = canonical.replace('https://www.yourdomain.com', ''); //Find menu in Main Nav that contains a link matching the url of current page and get its HTML content into a variable var mainmenuFolder = $(".main-nav .folder-parent a").filter( function(index) { return $(this).attr("href") === pageurl; return false;} ).closest("div.folder-parent").get(0).outerHTML; //Append the Main Nav folder found to the #pageMenu object $("#pageMenu").append(mainmenuFolder); //Hide the Parent Folder link in the newly created Page Menu $("#pageMenu .folder-parent a:first").hide(); } //Hide all Parent Folders in Main Nav if they're named "Foo" $(".main-nav span").filter(function(index) { return $(this).text() === "Foo";}).parent().hide(); }); </script>
  4. I'm working on a site using the Tremont template see here I would like to transfer the mouseover effects of the index-navigation and apply these to the main-nav at the top right of the screen so as when you hover over the menu items they change the background video/image see here. I have achieved a similar effect on other projects but am having difficulty with 1. targeting the background video and 2. placing the images I wish to replace it with. Thanks in advance, any help would be greatly appreciated as I've been battling with this one for too long.
  5. Hello, I am working in the Jaunt Template - looking to move the additional tab to below the 'add to cart' button. I am using a toggle hide/show in the additional info tab as I can't seem to work out how to inject code to the product description. Thanks
  6. I'm trying to load a group of blocks from one of my pages (/testimonials) into another page using jQuery's .load function (an Ajax method) and then display them with a fadeIn/Out animation to create a slideshow of testimonials on the current page. The load executes but the lines following do not. Here is a snippet of the code that's injected into the page header: $(document).ready( function() { $(".col.sqs-col-12.span-12:has(.sqs-block-quote)").addClass("slideshow"); $(".slideshow").load("/testimonials .col.sqs-col-8.span-8 .sqs-block.quote-block.sqs-block-quote.null"); $(".slideshow > div:gt(0)").hide(); }); The last line, to hide all but the first block, never executes. However, if I paste that line into Chrome's javascript console, it executes as expected. I'm guessing this might have something to do with Ajax but I really have no idea. My site is using a template with Ajax loading enabled - I've tried disabling it but it makes no difference. I have Googled and tried various suggestions but am stumped. Any help would be greatly appreciated!
  7. Hi I have created one page and i am sending data to my other site through third party api url on jquery click event , but when i am submitting form my api is not calling. It's sometime work and sometime not work. Can you please tell me is anything blocking squarespace ? I have put my code inside Page Settings -> Advanced. E.x $(document).on('click', 'target', function () { // ajax code here })
  8. I have a form with radio buttons. If a person answers/clicks "yes" to the first question then I want them to see question #2. If the person answers "no" then I want them to see a message showing they are not qualified. So depending on how the user clicks, makes a selection will determine what that user sees in the form. Thank you. I attempted this code, but it did not work:
  9. I have a script that executes within a form perfectly fine when the form is on the webpage, but as soon as I switch the form to a lightbox, the jquery stops executing. Anyone know how to make it compatible?
  10. I'd like to change "Related Posts" to say "Related Projects" – using the Farro template. I assume this involves jQuery but haven't managed to find anything other than this article for amending the search input. https://answers.squarespace.com/questions/13459/how-to-change-search-text-to-something-custom.html I guess it has to be something similar to this but none of these solutions work in my case!
  11. I have read the documentation on how to load custom JavaScript into the developer site, such as jQuery. I have implemented it the way the documentation suggests: <script>window.jQuery || document.write('<script src="scripts/jquery-1.9.0.min.js"><\/script>')</script> Loading the JavaScript file that I have uploaded to my ‘scripts’ directory on the server. That returned an 404 error saying that the file doesn’t exist. Because it was looking under /index/scripts/.. which of course does not exist. Thus the documentation is wrong. I then went ahead and wrote this: <script>window.jQuery || document.write('<script src="../scripts/jquery-1.9.0.min.js"><\/script>')</script> Adding a ‘../’ infront of the referenced source. This stopped the 404 error meaning that the script does get loaded. But it’s not affecting anything on my page as expected? I'm starting to fail to understand the benefit of using the squarespace developer platform as it posses more errors than suggested solutions. Any help would GREATLY be appreciated!
  12. I am trying to change the background color of the header element in my site using custom CSS and code injection. I found this previous, non-Squarespace solution. I have attempted to adapt it, but given my lack of jQuery knowledge and how exactly Squarespace uses code injection, I am at a loss. In the custom CSS area I have added .transparent-header #header { background-color: rgba(0,0,0,0.7); } In the code injection area I have added <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $(window).on('scroll',function(){ if ($(window).scrollTop() >= 100) { $('.transparent-header #header').css({ 'background-color:' : 'rgba(0,0,0,0.7)' }); } else { $('.transparent-header #header').css({ 'background-color:' : 'rgba(0,0,0,0.0)' }); } }); </script> The homepage of our website can be accessed here. Expected result: After scrolling some distance x (currently 100px) navigation header will add a semi-transparant fill Current result: no change
  13. I want to add a testimonial carousel without having to use images. Any ideas?
  14. I’m building a site — firstpersonessaycoaching.com — and I’d like to hide the answers to the questions on my FAQ page so that they are revealed when you click on the text of the question. I read Silvabokis’ How to create hide/show FAQs in Squarespace — but I would be out of my depth with jQuery. Would someone be able to suggest another way, or perhaps provide a little more guidance for the jQuery suggestions so that someone with very little experience can do it? Thanks in advance.
  15. I'm want to use Google Analytics to track conversions from my Squarespace 6 site - those conversions being a completed form on the site - but cannot find a way to include the code in the submission button or the form submitted page. Does anyone know of a workaround to allow me to track completed forms?
×
×
  • Create New...