Can I put a link anywhere in the image other than the text ?, link markup.
Hi @sifrec,
If I get what your saying, something like this might be helpful.
Then you just copy and paste the code it gives you into a code bric.
Thank you, but the link destination as a page seems to be configurable, but I don’t think you can set “blocID”, I wanted to use “Scroll to target” for the link.
But it’s a useful page, thank you
Sorry. Trouble following what you are trying to do. Maybe. @JDW can help with some translation again?
I think you know what I want to do, I think this page will be useful in the future, thank you.
Hey @sifrec, you can add an ID to the link on that website. Using the # symbol and the ID name you want to scroll too.
@sifrec wants to use Interactions > Scroll to Target in the right sidebar to jump to a specific point on a map. Heck, I want to do that too! But I can’t. Why can’t I? Because Blocs only allows “scroll to Bloc” when using “Scroll to Target.” Because I that, I think that popup menu setting should be renamed “Scroll to Bloc.” You think you can set any Target, but you can’t.
EXAMPLE#1. Let’s say I have 5 Rows inside #bloc-32. Of course, I see “#bloc-32” inside the “Scroll to Target” popup menu. But that is not what I want to scroll to. I want to scroll to a specific Row inside that Bloc and I do not want to create a different Bloc for each row!
EXAMPLE#2. Let’s saying I have several Columns inside one of the 5 rows and inside one of those Columns I have a block of text I want to scroll to. I can’t!
EXAMPLE#3. Let’s say I try to trick Blocs into obeying me by selecting one of my Rows and typing “bloc-33” inside the ID field of the right sidebar. Nope. Doesn’t work. That “bloc-33” won’t appear in the “Scroll to Target” popup menu.
THAT is the problem.
I have been frustrated by this for a long time. I want the power to scroll to any Target anywhere, according to any custom ID I set. I know that @sifrec wants the same thing. I can do that in SoftPress Freeway, and have since I first started using it in 1999. I can set an anchor on a single word of text or a graphic anywhere in my website using Freeway. Then, from any other page in that website, I can create a link to that anchor and when clicked, it will jump to that exact “anchor” point. I want to be able to do that in Blocs. Restricting us to jumping/scrolling only to Blocs isn’t flexible enough.
1 Like
You can do that by setting the URL of the link to the ID. If you want it to scroll you can add a small script that will enable scrolling on all the linked anchors.
Because it is bypassing the built in scroll to ID in Blocs, you need to add this code to the footer. It will work without the code, but it will just jump to the target not scroll… so it is optional. (this will work for all #ID links)
<script>
$(document).ready(function(){
$("a").on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
} // End if
});
});
</script>For now it is a valid solution until @Norm extends the scroll to feature to include any ID.
1 Like
Well, adding your code to the “Add Code” button of Page Settings doesn’t work to get a smooth scroll, but I do appreciate your tip about creating the URL to the ID. Thank you! I now see that you can jump to a single word too, simply by select that word, applying a SPAN, then adding an ID to that SPAN. For example, if your ID for a SPAN is “tester123” and if your link is on the same page, then link needed would be this:
Having Norm extend the scroll feature to any ID would be a timesaver!
1 Like
@JDW, check you pasted it correctly in the FOOTER not header as you will see in the video I posted, it works.
Yes.
So yeah the above Map Generator will work in Blocs, and with the script it will scroll smoothly.
1 Like
Yes, the default is target=“_self” when not set.
By the way, I got the code from
Their website is very useful.
That’s the key to using your code, thanks. It’s smoothly scrolls now!
2 Likes
I can not understand because it is all a program and English, but my hope is that the red part of the above image will be a different link destination button, so it seems that it can not be processed with “ID”, the former Web The editor had a method called mark tap, but …
I’m sorry, I don’t understand.
My hope seemed the same as what JDW wanted.
@PeteSharp Because @sifrec still has no solution, I was trying out your earlier suggestion to use the Map Generator. But that is not a simple “copy and paste” operation. When you upload a photo to that generator, the resulting code does not provide a specific link to that photo on your web server. So you see, it’s not as easy as copy and paste.
What @sifrec wants to do is create multiple links on his map of Japan, but he wants to do it EASILY. Using that Map Generator means a lot of changes to the code inside a Code Widget in Blocs. The entire reason we use Blocs is to get away from designing a website in text code. Indeed, without Blocs, hardly any of us would be making any website at all.
To repeat, @sifrec wants to put links on a graphical map OTHER THAN basic text links which he has shown in red, in his opening post. That is different from what you and I spoke about in the last several posts. In my own case, I don’t need a link map on top of a graphical map. I myself only want to jump around to different Anchors on a web page, and we have already established how to accomplish that AND smoothly scroll to the Anchors too. But what @sifrec wants is multiple links on a graphical map, and I assume he wants an easy way to change those around, which is not something CODE would allow him to change easily. In other words, I don’t see an EASY way to do this in Blocs.
It has two options, one is upload a file or link. If you upload a file, of course not, how would it know where the file is? you would need to add the URL location before the filename in the code. When you link a file the generator makes a complete link to it. (which is what I have done in the example project file below).
When you start moving into features and design like that, you often need to have a coded solution. I am not sure what you mean by a lot of code changes? It is copy and paste, and depending on what image you use, you might have to add a domain name to the image URL.
I offered the best, and actually the easiest solution I could find. If they need a more dynamic solution, they will have to find something else.
Yeah we highjacked the thread lol.
Here is an example of it working. No fancy code to make this work, it was a copy and paste.
EDIT: Updated fixed project file.
Map_Link_2.bloc (1.4 MB)
If you want to make a link map for a physical map AND if you plan to slowly make multiple changes to that map and its links over time, that’s potentially a lot of work to do in code. That is what I was saying.
By the way, the image in your example file won’t display in Blocs or in the browser when I try it. But if I copy out the URL and paste that URL only in the browser, then his photo will display.
Weird. Works for me. And no it won’t work in the Blocs preview but will in the browser.
@JDW is right, @PeteSharp you have some code in FOOTER page preferences that block the content…
I delete it and now I see his BIG NOSE…
1 Like
Whoops, thanks for that @Pealco . That was left over from something else. Interesting that it still works locally for me with that code there.
I have replaced the file in my previous comment with the code removed.
Map_Link_2.bloc (1.4 MB)