Sharif_Shimanta

I am trying to migrate https://www.tablerock.church/sermons from 7.0 to 7.1 In 7.0, there is a code used in header code injection for dropdown filter (you can see the dropdown in this page https://www.tablerock.church/sermons ) which is stated below: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i=0;i<vars.length;i++) { var pair = vars[i].split("="); if(pair[0] == variable){return pair[1];} } return(false); } if( $('#collection-5c9e4b1553450a6213e3a5a7 .Main--blog-list').length == true ) { var postHTML = []; var categories = []; var tags = []; var preacherIds = []; var preachers = [ { 'name' : 'Andrew Knight', 'id' : '5d2515a11dfbb500011c1cf4' }, { 'name' : 'Don Straka', 'id' : '5cb4faab25a88200014f192b' }, { 'name' : 'Luke Miller', 'id' : '5d2515ad4ffbbe00012e4ca6' }, { 'name' : 'Luke Salik', 'id' : '5d251581b06cd600016393ad' }, { 'name' : 'Ryan Eagy', 'id' : '598c964b59cc689d94d32c00' } ]; var books = ['Genesis','Exodus','Leviticus','Numbers','Deuteronomy','Joshua','Judges','Ruth','1 Samuel','2 Samuel','1 Kings','2 Kings','1 Chronicles','2 Chronicles','Ezra','Nehemiah','Job','Psalms','Proverbs','Ecclesiastes','Song of Solomon','Isaiah','Jeremiah','Lamentations','Ezekiel','Daniel','Hosea','Joel','Amos','Obadiah','Jonah','Micah','Nahum','Habakkuk','Zephaniah','Haggai','Zechariah','Malachi','Matthew','Mark','Luke','John','Acts','Romans','1 Corinthians','2 Corinthians','Galatians','Ephesians','Philippians','Colossians','1 Thessalonians','2 Thessalonians', '1 Timothy','2 Timothy','Titus','Philemon','Hebrews','James','1 Peter','2 Peter','1 John','2 John','3 John','Jude','Revelation']; var xhrPosts = new XMLHttpRequest(); xhrPosts.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { if (this.responseText[0] === "<") { var start = this.responseText.indexOf("[{"); postHTML = JSON.parse(this.responseText.substr(start)); } else { postHTML = JSON.parse(this.responseText); } categories = postHTML.collection.categories.sort(); tags = postHTML.collection.tags.sort(); var dropDownItemsCategories = ''; var dropDownItemsTags = ''; var dropDownItemsBooks = ''; var dropDownItemsPreachers = ''; // Create Category Select Options for (var i = 0; i < categories.length; ++i) { dropDownItemsCategories = dropDownItemsCategories.concat('<option value="'+categories[i]+'">'+categories[i]+'</option>'); } // Create Preachers Select Options for (var i = 0; i< preachers.length; ++i) { dropDownItemsPreachers = dropDownItemsPreachers.concat('<option value="'+preachers[i].id+'">'+preachers[i].name+'</option>'); preacherIds.push(preachers[i].id); } //Create Topic Select Options for (var i = 0; i < tags.length; ++i) { if ( !(books.includes(tags[i])) ) { dropDownItemsTags = dropDownItemsTags.concat('<option value="'+tags[i]+'">'+tags[i]+'</option>'); } } // Create Book Select Options for (var i = 0; i < books.length; ++i) { if ( tags.includes(books[i]) ) { dropDownItemsBooks = dropDownItemsBooks.concat('<option value="'+books[i]+'">'+books[i]+'</option>'); } } var dropdown = '<div class="category-select-block" style="margin-bottom:28px;text-align:right;"><div class="style-wrap-arrow"><select class="category-select" style="max-width:100%;"><option selected="selected" disabled="disabled">Filter sermons by</option><optgroup label="Sermon Series:"><option value="All Sermons">All Sermons</option>'+dropDownItemsCategories+'</optgroup><optgroup label="Preachers:">'+dropDownItemsPreachers+'</optgroup><optgroup label="Books:">'+dropDownItemsBooks+'</optgroup><optgroup label="Topics:">'+dropDownItemsTags+'</optgroup></select></div></div>'; $('.Main-content').prepend(dropdown); if (getQueryVariable('category')) { $('.category-select option[value="'+decodeURI(getQueryVariable('category'))+'"]').attr('selected','selected'); } else if (getQueryVariable('tag')) { $('.category-select option[value="'+decodeURI(getQueryVariable('tag'))+'"]').attr('selected','selected'); } else if (getQueryVariable('author')) { $('.category-select option[value="'+decodeURI(getQueryVariable('author'))+'"]').attr('selected','selected'); } $('.category-select').change(function(){ if(this.value !== 'All Sermons' && categories.includes(this.value) ) { window.location.href = location.protocol+'//'+location.host+location.pathname+'?category='+encodeURI(this.value); } else if(this.value !== 'All Sermons' && tags.includes(this.value) ) { window.location.href = location.protocol+'//'+location.host+location.pathname+'?tag='+encodeURI(this.value); } else if(this.value !== 'All Sermons' && preacherIds.includes(this.value) ) { window.location.href = location.protocol+'//'+location.host+location.pathname+'?author='+encodeURI(this.value); } else { window.location.href = location.protocol+'//'+location.host+location.pathname; } }); } }; xhrPosts.open("GET", location.protocol+'//'+location.host+location.pathname+"/?format=json-pretty", true); xhrPosts.send(); } }); </script> It is not working on 7.1 blog page. The 7. 1 website link https://springtail-nonagon-dchs.squarespace.com/sermons password: tablerock Anyone can assist on this please? Thank you in advance!

@bangank36 It is working absolutely Fine!!!! Thank you so much. Much appreciated.

@paul2009 I have attached the actual function it should do. bandicam 2021-11-10 15-15-23-115.mp4

@paul2009 Thanks for the reply. It should dynamically populate new reviews to slide up. Please run the code in https://www.w3schools.com/html/tryit.asp?filename=tryhtml_default_default to get the exact idea. For example, a 4th hidden review block should take place of the 3rd review after a certain time period.

Site URL: https://www.hairdresserswellingborough.com/test Site URL: https://www.hairdresserswellingborough.com/test Hello, I have a script provided from https://www.mylocalsalon.co.uk/. Which working fine in https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_lib_google . But in Squarespace, I inserted the script and nothing showing! However, I managed to show the block but it is not changing dynamically as it should do. Website link: https://www.hairdresserswellingborough.com/test Script used : <!--Your plug-in code can be customised to look like your website using the following styling elements. .SCMyWebsitePlugin-score .SCMyWebsitePlugin-score div .SCMyWebsitePlugin-mlsLink li#SCMyWebsitePlugin-firstItem li#SCMyWebsitePlugin-lastItem #SCMyWebsitePlugin-main #SCMyWebsitePlugin-reviewListDiv --> <div id="SCMyWebsitePlugin-main" data-site_id="43a01004-5146-e911-a9a6-000d3a81ec09" data-number_of_reviews="3" data-no_styles="true" data-change_time="1000" data-character_limit="200" data-total_reviews="20" data-use_microdata="true" /> <script type="text/javascript"> (function() { var newScript = document.createElement('script'); newScript.type = "text/javascript"; newScript.src = "https://ratings.mylocalsalon.com/widget/mywebsite"; var firstScript = document.getElementsByTagName('script')[0]; firstScript.parentNode.appendChild(newScript); })(); </script> Any Idea about how to solve this? Thanks in advance!

@tuanphan Hi, I have been using lightbox plugin but did not know it works for hover. Can you tell me how to use it for hover?