Joomla Templates Club 406,261 posts

[bencarlin Friend bencarlinJoin date: May 2014Posts: 43Downloads:0Uploads:24 Thanks: 13 Thanked: 1 times in 1 posts]

#202003

Hi there,

Just wondering if I can make the whole rollover icons clickable links to other pages? Here is the code but just not sure how to make it into links!

<ol class=”timeline clearfix”>
<li class=”tl-wrap pull-left tl-danger active”>
<div class=”box-content”><strong class=”tl-title”>Freelance Actor & Digital Artist</strong><span class=”tl-content”><br /></span></div>
</li>
<li class=”tl-wrap pull-right”>
<div class=”box-content”><strong class=”tl-title”>Kingston University</strong><span class=”tl-content”>Sep 2011 to May 2014 · BA (Hons) Drama (1st)<br /></span></div>
</li>
<li class=”tl-wrap pull-left”>
<div class=”box-content”><strong class=”tl-title”>Truro College</strong><span class=”tl-content”>Class of 2009 · A-Levels</span></div>
</li>
<li class=”tl-wrap pull-right”>
<div class=”box-content”><strong class=”tl-title”>Richard Lander School</strong><span class=”tl-content”>Class of 2007 · Head Boy</span></div>
</li>
</ol></div>
<div class=”box circle clearfix”>

I’ve attached a screenshot as well for when my mouse is hovered over one of the icons.

Thanks again

B

---

Attachments:

1. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#552667

You can refer to this article for adding link using <a> HTML tag: http://www.w3schools.com/html/html_links.asp

In you case, you can use this format

<li class="tl-wrap pull-right">
<a href = "http://bbc.co.uk">
<div class="box-content"><strong class="tl-title">Richard Lander School</strong><span class="tl-content">Class of 2007 · Head Boy</span></div>
</a>
</li>

1 user says Thank You to Eragon H for this useful post

1. bencarlin

[bencarlin Friend bencarlinJoin date: May 2014Posts: 43Downloads:0Uploads:24 Thanks: 13 Thanked: 1 times in 1 posts]

#552766

Thanks that worked really nicely. The only other bit would be after adding it, I get a line that appear under the text when highlighted. Must be a default thing for links. Is there a quick way to get rid of that line?

Cheers

B

---

Attachments:

1. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#552800

You can use “text-decoration:none” to remove the underline in hyperlink

For examlple

<a href = "http://www.truro-penwith.ac.uk/" style="text-decoration:none">
<div class="box-content"><strong class="tl-title">Truro College</strong><span class="tl-content">Class of 2009 · A-Levels</span></div>
</a>

1 user says Thank You to Eragon H for this useful post

1. bencarlin

[bencarlin Friend bencarlinJoin date: May 2014Posts: 43Downloads:0Uploads:24 Thanks: 13 Thanked: 1 times in 1 posts]

#552874

SO HELPFUL. Thank you!

[bencarlin Friend bencarlinJoin date: May 2014Posts: 43Downloads:0Uploads:24 Thanks: 13 Thanked: 1 times in 1 posts]

#552974

I’ve noticed whenever I click to open the article the code goes missing. Even though I have saved it. Just that particualr bit of code that I’ve implemented with your guidance. The rest is as normal. I keep having to re-enter it.

This actually also happens with all of my youtube links on other articles. If I just open them up the youtube links disappear and have to re-enter them. Sometimes if I click on an article and notice the links have gone, then close the article and re-open it without saving, sometimes the links are there again.

Not sure why these things sometimes disappear!

[bencarlin Friend bencarlinJoin date: May 2014Posts: 43Downloads:0Uploads:24 Thanks: 13 Thanked: 1 times in 1 posts]

#552975

I’ve noticed if I close the article in the code edit mode rather than the front end mode, when I reopen everything is fine. It just seems to lose the data when it opens in the front end of JCE. Strange.

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#552991

It just because the editor normally hide/drop some HTML tags. You should disable the editor when add/edit the HTML tags

1 user says Thank You to Eragon H for this useful post

1. bencarlin

[Author]

Posts