UtopiaCreates Posted August 1, 2013 Share Posted August 1, 2013 As brought up here: http://answers.squarespace.com/questions/8532/folder-navigation-top-folder-doesnt-link-to-anything-can-i-get-it-to-or-remove-link-behavior Folders should have a click through link so that it can be clicked to go to another page. It should work the same as a regular folder in that it should still have an active colour if that has been set so that if you are on a page that is held within that folder or the page the folder link is connected to the "active color" works. Please vote up if you agree. Another possible option is to make a special kind of page that works like a folder in that anything placed under it shows up in navigation as a drop down but it is also a normal page and can have content on it. That would save having to create a special no linked page that works with the pass through. Maybe have a check box or such for people that want it to just act like a normal Folder. Link to comment
forrestbaer Posted October 24, 2014 Share Posted October 24, 2014 You can do this with a bit of JavaScript hackery. Here is some code to do it using jQuery, let’s say you had a folder called “Donate Now” that contained links to other ways to donate, but if you wanted the user to be able to click the folder directly you could add to your header code injection: <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(function() { $('.main-nav li a').each(function () { if ($(this).text() == 'Donate Now') { $(this).attr('href','http://www.paypal.com'); } }); }); </script> That would search through your main navigation links, find the one named “Donate Now”, and change the link from nothing to, PayPal in this example, put whatever you want there. Cheers,Forrest (cloudyreason.com) Link to comment
sailors_choice Posted October 27, 2014 Share Posted October 27, 2014 Doesn’t work in the Five template as the mouseClick-event is not handled. The status bar shows the new link target but nothing happens onClick. Any additional advice? Link to comment
forrestbaer Posted October 27, 2014 Share Posted October 27, 2014 You can add a line that says : $(this).attr('onclick','true'); after the attr('href') line, that will fix it. So: <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(function() { $('.main-nav li a').each(function () { if ($(this).text() == 'Donate Now') { $(this).attr('href','http://www.paypal.com'); $(this).attr('onclick','true'); } }); }); </script> Make sure the 'Donate Now' is the exact same text as in the HTML, capitalization matters. Best,Forrest (cloudyreason.com) Link to comment
sailors_choice Posted October 27, 2014 Share Posted October 27, 2014 Of course, stupid me, worked. Thanks. Link to comment
bigGerman Posted January 5, 2015 Share Posted January 5, 2015 This JavaScript works great for me in the desktop mode of the Wexley template.Instead of 'PayPal' the folder links to a gallery page ('/food/') which is placed in the "Not Linked-Section" – but in the mobile view this clickable folder is not displayed in the mobile menu. I need that folder beeing part of the mobile menu as well. Any ideas how to fix that? Link to comment
Scoobie Posted January 5, 2015 Share Posted January 5, 2015 Same question here, for Five template on mobile. Link to comment
jpwv Posted January 8, 2015 Share Posted January 8, 2015 This html goes in Settings / Advanced / Code Injection / Header...And it works. Add more sections if you have more folders to include. } if ($(this).text() == 'Folder 2') { $(this).attr('href','http://www.page2'); $(this).attr('onclick','true'); Link to comment
deux etoiles Posted January 25, 2015 Share Posted January 25, 2015 I am looking for this functionality and was glad to find this solution, but it doesn't work with my Wells site. Any suggestions? Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 You must be sure you are injecting this into the HEADER CODE INJECTOR space for HTML. This is not CSS. To find this space, go to the editing pane where there is a list on the left that starts with PAGES and ends with HELP. Just above Help is the SETTINGS link. Click that, then Advanced, then Code Injector. The Header window injection place should be at the top of the that section. Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 Paste in code from below. Replacing FolderName with your folder, and TargetWebPage with the page you want the link to open. Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 Here is a repost of the code. This bloggish site takes out returns... See the post that begins with Last try.... Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 Last try: <!-- makes navigation folder a clickable link --> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(function() { $('.main-nav li a').each(function () { if ($(this).text() == 'FolderName') { $(this).attr('href','http://www.TargetWebPage'); $(this).attr('onclick','true'); } }); }); </script> Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 OK. Finally. This is what you paste into the Header Code Injector. Replace FolderName and TargetWebPage with your info. The first line with the < ... > is only a note and will not affect coding if deleted. You can add more folder actions by adding the following code after the last single } . Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 if ($(this).text() == 'FolderName') { $(this).attr('href','http://www.TargetWebPage'); $(this).attr('onclick','true'); } Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 This goes between the last single } and the following line }); I hope this is clear now. Link to comment
Scoobie Posted January 25, 2015 Share Posted January 25, 2015 what does this code do if you're viewing on mobile? Thanks Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 This code is incomplete. See later post below beginning with Last Try.This snippet will add folders to the list if you insert it in the right place. See below as well. Link to comment
jpwv Posted January 25, 2015 Share Posted January 25, 2015 See the code in the post starting with " Last try: " Link to comment
deux etoiles Posted January 25, 2015 Share Posted January 25, 2015 Hi jpwv. Thanks for your reiterations. I appreciate your help, even though following instructions was not my problem. I was having a very frustrating time. I was doing it right EXCEPT when I cut and pasted into a text editor, it was converting into smart quotes. D'oh! When I fixed those it now works beautifully! Link to comment
Guest Posted January 31, 2015 Share Posted January 31, 2015 I've tried all this and still not working. My template is Dovetail - has anyone done this and could help me out? Link to comment
jpwv Posted January 31, 2015 Share Posted January 31, 2015 No experience with Dovetail. All I can think of is to be sure you are putting this into the HEADER INJECTOR, not the CSS injector. Be sure you capitalize your folder name in exactly the same way you use it in the header. Also be sure the target URL is exactly correct as well. Link to comment
jpwv Posted January 31, 2015 Share Posted January 31, 2015 Be sure you copy the code exactly and do not delete any of the ' marks when you copy your links into it. I suggest making the changes in a text editing window and pasting that into the Header Code Injector. Be sure you are not working on a single page, but the whole site. Link to comment
Guest Posted February 1, 2015 Share Posted February 1, 2015 This is the site - www.loveandsage.squarespace.com and this is the code: Any mistakes Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.