Link blocks - Webflow elements tutorial
HTML-код
- Опубликовано: 13 авг 2017
- Webflow's link blocks are similar to div blocks in that they can be used for structure and layout, but differ in that the area inside of the link block becomes a link. Link blocks can turn any element into a link.
In this video, we’ll be covering how to:
1. Add a link block to your project
2. Add other elements inside the link block
3. Set the link type
4. Style the link block
Note: We’re transitioning to a new UI, and are in the process of updating our Webflow University content.
----------
Get started with Webflow:
help.webflow.com/courses/gett...
webflow.com
/ webflow
/ webflow
you make it look so easy. I try it and pictures jump all over the map
How can you make sure each card image goes to a different page? The link block takes them to the same page and I have 6 card images
Is there a way to convert a div block to a link block I've already created the div and put everything in it... I'm just thinking I want all that stuff that's in there to link to a page. I know if I'm coding in html all I have to do is add the to the div. But I'm working in Webflow so...
Yes! Right click on the Div block, and you can choose to Convert to Link block.
Why is it when I try to put my SVG icon inside the link block it makes the icon move somewhere at the top and then the link block will be in the same spot the icon was? It just looks like they’re not put together
Hi Reva! Great question! It's possible that the link block element needs to be set to display: relative to resolve this issue. Though it sounds like this question may be specific to your Webflow site instance.
Can you please reach out to us here with more details, our team is happy to help: university.webflow.com/support
Thanks in advance!
Hi! I would like to know how to add a dofollow or no follow link into phrases? Thanks in advance
You can add a custom attribute to your links. Here is how: university.webflow.com/lesson/custom-attributes
Hope this helps :)
@@Webflow No, I didn't get it. If there was a practical demonstration like a video tutorial, it would be better. Placing do follow and no follow link are very important when it comes to SEO, so the process should have been easy. I didn't get anything by reading the blog that you shared
How do I put video inside the link block that plays on hover and onclick goes to a page?
You can add a background video element inside of a link block element. As for pausing and playing on hover, you can try adding custom code. Here is an article I Googled that might help you with this:
www.geeksforgeeks.org/how-to-play-video-on-mouse-hover-and-pause-on-mouseout-using-javascript/
This is such a pain in the ass. Why not add a link field directly in the image settings?
well this really sucks.... why cant you just add a 'link' function on the image setting...????
Sometime you can also do is change the div block element to link block..
Sorry what does this mean?
Im having a problem, I do exactly as the video explains, but when i drag the image into the Link Block, the image becomes smaller when its in full screen mode. its fine on all other screens. But I really need it to be the correct size on my full screen mode?
Any ideas?
Thanks :0
@@WonsPhreely yeah there are a couple of things You're doing wrong.
99 ProblemXX if you can explain what I’m doing wrong that would be why I asked.
@@WonsPhreely There's a way i go about doing mine, in order to achieve this make sure that the image youre moving in the link block is actually a child of the link block or else that means its not actually in the link block, you can check this by looking at the navigator, and if youre using a grid the image will not appear fully unless its a single column and, so you can use a container as the parent element as an example and then press cmd k add a link block in the container, when you do this there will be css styling to your image to resize the image.
another thing is that the image might be too wide or too long, but this information might be incorrect, if you want ur image full screen, make sure yuh're inserting it in a section or a container or div block, but i dont see hw yuh wanna make a link image fullscreen but anyways i hope this info helps yuh out... just take ur time, make sure yuh also add a new class to the elements if you want something different it might be that its inheriting the style from another element.
kam asf lol. You better make it more easier.
Is it me or do these Tutorials only seem so be aimed at the paid version. The designer in this video seems to be able to freely move everything in to place without any problems what so ever but when I do it, it messes the whole process up. I have done the exact same but the image ends up in a complete different box and the link is on another part of the website, I have no way to fix this. the limited way of not being able to move certain elements, images, text e.g ruins the work flow and takes the motivation away from actually finishing the website, I feel like it will be best if we always this free movement from the beginning because it would help the designer to become more creative by giving them freedom.
Hi, T.Winters, thank you for reaching out. Sorry to hear that the result isn't quite what you expected. Nothing in this video requires any paid upgrades whatsoever. We'd be happy to take a closer look at your design if you can post screenshots and a share link to the Webflow Community Forum (forum.webflow.com/ ). Alternatively, you can directly contact our customer success team at support@webflow.com. Looking forward to getting this sorted out!
yes , it's just you . These tutorials are quite helpful. You need watch the previous tutorials to figure out the problems. there are few detail things that you might miss. My advices is to start watching all the webflow tutorials from the very begining. it will make more sense ,especially if you have no background in webdesign.
@@Webflow Hello, Im having a problem, I do exactly as the video explains, but when i drag the image into the Link Block, the image becomes smaller when its in full screen mode. its fine on all other screens. But I really need it to be the correct size on my full screen mode?
Any ideas?
Thanks :0