I am using the Scroll to Top Button, but instead of going all the way to the top of the website (Hero Bloc), I would like to go back to the top of the Dynamic area where I have my menu.
Can I do something in Blocs or I have to modify the script when the project has been exported ?
Hi chrishsl, Iâm only a few hours into Blocs but some early response might be useful. I have seen there are options on a dropped Button to navigate to various places. You might have to define a target position too.
I was going to suggest you identify the id in the side panel for the bloc you want as the scroll to destination, then click on the scroll to toggle menu and select that id. In theory that should work, but then I tried it in 2.6.4 and it didnât⌠Maybe one for @Norm
Thank you @jamesGW & @Flashman, but the Scroll to Top Button is an option you tick in your page settings, so you donât have the option to choose the id of the blocâŚ
OK a slight misunderstanding. That refers to the small box with the arrow that you see on pages as you scroll down to provide a sort of elevator option taking you to the top. To do as you wish I think that would need to be edited somehow.
I was talking about the option of scrolling to a specific place from a link via text or a button. If you create a link, one if the options allows you to select a location, however this would be from a fixed element, rather than floating as you scroll down the page. There may well be a workaround for this, but nothing springs to mind.
Following more detailed suggestions from Flashman, got it to work OK. Can scroll upwards from a button at bottom of the dynamic area to the top of the dynamic area, across more than a screenful.
Selection of target block was a challenge, but clicking alongside the top-of-bloc + sign did show Bloc info in sidebar. Entered a custom ID (default #bloc-N seemed unsuitable, it looks like N is bumped on each new added-bloc no mater what position in layout).
So now have a more refined option than âScroll to Top Buttonâ Page Option. Can scroll to (the top of) any Bloc, perhaps even insert a dummy one for the purpose. Generic button can (I assume) be customised in size and label to suit, maybe even color.
@chrishsl, I imagine you could utilize an icon of that up arrow (caret symbol?) and use the âscroll to targetâ feature to target your navigation Bloc. Youâd need to place that element in its own Bloc and give it a unique name id. set the position of that element to âfixedâ in the css and then adjust also the horizontal and vertical position on the page using âbottom:â and âright:â etc. You can either add a css style to the page (in page settings) or link to an external style sheet by attaching it in project settings.
Hi Guys, if your feeling advanced the best but not the easiest way to manage this would be to change the scroll to top functions after export. You can find this file in js/blocs.js . After this scroll down to the line that says function scroll to target. This is the function that is responsible for the scroll to target abilities. If you then replace the name of the class names that are there for the class name of the bloc you would like to scroll up to then it should work. Give it a try and let me know how you get on
Good option, but the button would appear straight away on the website. What I like with the Scroll to Top Button is that it only appears when you start scrolling down. Im going to try to change the js file as @Blocs_Hosting suggest.
If you are prepared to accept editing an exported file, a simple option seems to be to edit the index.html. [how do I include HTML here?] Near the bottom is a line withâŚ
onclick="scrollToTarget(â1â)
Change the â1â to â#xxxxxâ, where xxxxx is the custom ID for the target bloc (mentioned earlier). But this must be done post-export.
I have found a solution by introducing an HTMLwidget at the end of the global footer area, with that line of HTML and edit already made for targetting the custom ID. So, no post-export editing. PageSettings still require the Scroll To Top Button to be set ON to generate the normal chevronâd button. By some magic, the HTML widget version seems to override the original target and you end up with just what you wanted. However, Iâd experiment a bit more first.
@Blocs_Hosting, are you fairly knowledgeable of Javascript programming? Iâm often needing some help with Javascript, php, etc and like to keep a âshort listâ of developers who I can call for different projects. If you are, and are willing to collaborate ocassionally, Iâll keep you in mind!
I like to think I am knowledgable in these areas as I work for a company that specialises in building websites using javascript and PHP. If you need me for anything give me a shout