Community

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
megan_fox
New Member

Removing small external link icon - need clear directions

Jump to solution

How do I remove the small external link icon in Canvas? It shows up on my homepage after I have inserted a link to words or pictures.  I am a teacher - not an HTML expert - please give clear instructions.  I searched and the answers given were not that clear to me.  Can anyone "dumb it down"?  Thanks!  

1 Solution

Accepted Solutions
ajdeeley
Community Participant

my 2 cents if you haven't figured this one out yet.

Currently in canvas, there is a way to easily remove that little arrow icon.  Having built the link in the RCE, look at the html behind the link and adjust the <a href="...">link text</a> adding this bit as follows: <a class="external" href="...">link text</a>

make sense?  adding that class="external" definition to the link effectively hides/removes the arrow icon.  Seems that whoever wrote the global CSS didn't like the arrows as well.

View solution in original post

8 Replies
chofer
Community Coach
Community Coach

Hello there,  @megan_fox  Welcome to the Canvas Community.  Thank you for posting your question.  Is the icon you are referring to this one (the box with the arrow pointing upward to the right)?

External Link

If so, when you hover over that icon with your mouse, the helpful hint says, "Links to an external site."  If this is what you are trying to get rid of, I'm not sure there is a way to do this?

Sometimes, however, there are rogue icons that show up if you've previously had other content on the page but didn't fully delete the links (and therefore the HTML didn't fully remove them, either).  You might be able to try out the steps I outlined in this blog post: HTML Cleanup.  You might want to try these steps on a separate page that your students cannot see or in a sandbox course first to make sure things look the way you want.

I'm hoping this information will be of help to you.  If you're asking about something different, however, can you please clarify so that we can continue to help you?  Thanks!

Thank you Chris - you were right - the Yahoo example was what I was talking about - that's probably why I couldn't find the answer on how to remove it....haha Smiley Happy

Thank you for taking the time to reply to my question.

ajdeeley
Community Participant

my 2 cents if you haven't figured this one out yet.

Currently in canvas, there is a way to easily remove that little arrow icon.  Having built the link in the RCE, look at the html behind the link and adjust the <a href="...">link text</a> adding this bit as follows: <a class="external" href="...">link text</a>

make sense?  adding that class="external" definition to the link effectively hides/removes the arrow icon.  Seems that whoever wrote the global CSS didn't like the arrows as well.

kmcgrath
Community Participant

Hi, @chofer - The HTML Cleanup link in your post above is dead...  Could you please re-post?  Thank you!

Hi there, @kmcgrath ...

Ah yes...a result of moving from the old Community site to the new Community site...links that don't work.  Doh!  The new link to my write-up is:

HTML Cleanup - Canvas Community

By the way, you can also use the search box at the top of the screen (make sure to choose "All community" from the drop-down), and then search for: HTML Cleanup, and it should be one of the first results.  🙂

kmcgrath
Community Participant

thank you!

gulick_24
Community Member

@chofer The blog link you posted isn't working anymore and I had the same question as @megan_fox. I've tried removing target="_blank" rel="noopener" from the HTML code, but the little icon still appears (even when toggling back to HTML view shows that the deleted code remains deleted). BUT, adding "external" like @ajdeeley mentioned, works perfectly! So my old code:

a class="instructure_file_link inline_disabled" href="https://newark.osu.edu/future-students/financial-aid/">Contact the OSU Office of Financial Services</a></strong></td>

Becomes: (adding "external" followed by a space, then the "instructure...")

a class="external" "instructure_file_link inline_disabled" href="https://newark.osu.edu/future-students/financial-aid/">Contact the OSU Office of Financial Services</a></strong></td>

Hello there, @gulick_24 ...

Ah...good catch!  The broken link in my reply is most likely the result of the Canvas Community site moving to a different platform last Summer, and that is a link that didn't re-direct properly.  The working link is HTML Cleanup.  Also, you can use the search bar at the top of most pages here in the Community to search for the words HTML Cleanup, and it should come right up as one of the first search results.  Thanks!