Inserting a hyperlink on an image or text

I’m new to BSS and using 5.8.6 I’ve been going through the tutorial pages but can’t find how to add a hyperlink to an image or on text. So how is it done?

To wrap an image or text in a link, you drop a Link component and place the image or text inside it. You will likely want to remove the text of the link before dropping the image.

We’ve covered this in the video lessons, but we haven’t explained it in the online docs. We are open to suggestions where in the docs we should include this so that it’s easily discoverable.

In the Images section and call it Image Links? Would make good sense to me :slight_smile:

Actually, I’d really like to see “link” appear in either the left click or right click on an image.

Ok, tried that. I dropped the link component on the navbar, removed the text, added the logo, went to the options panel on the right, clicked on the link tab, and entered the URL. That worked.
Next I tried adding a link to a phrase in a paragraph. I Control+X the phrase I wanted to have as a hyperlink, dragged the link component into the paragraph where the phrase was located, then pasted the phrase into the link box.
This separated the two word phrase from the paragraph all by itself on a new line.
I didn’t want the hyperlinked two words on a line by itself in the middle of the paragraph and could not get the phrase back into the paragraph text so I went to the link options panel and tried the various text options. Nothing worked. I tried the text options for the paragraph. The linked phrase was still on it’s own line in the middle of the paragraph.
But then I tried just using the link icon that appears in the menu when I select a word or phrase - that worked perfectly, much better than the link component.

There are different scenarios for the 2 different ways to do links:

If you want to put a link within a line of text and you “do not” need to add any css to it, then direct linking of selected text via the text editor at the top is the easiest route. You don’t delete or cut the text, highlight it instead.

If you need to be able to give it css and any other attributes, then using the link component is better. You can drag them right into a line of text and put it right where you want it, it doesn’t make it go to the next line if you do it that way. Just depends on what you need it to do.

1 Like

Thankyou jo-r That’s very clear.
I really appreciate this helpful forum. I’m slowly moving up the learning curve.

You’re quite welcome, takes a bit of time to get it all figured out, but it’s well worth it. Enjoy and welcome to the forums.