# Issues adding CSS/JS component: Robustifying links to preserve link functionality

**URL:** https://meta.discourse.org/t/issues-adding-css-js-component-robustifying-links-to-preserve-link-functionality/240997
**Category:** Development
**Created:** [October 5, 2022, 9:36am UTC](https://meta.discourse.org/t/issues-adding-css-js-component-robustifying-links-to-preserve-link-functionality/240997 "2022-10-05T09:36:21Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![MSH](https://avatars.discourse-cdn.com/v4/letter/m/e19b73/32.png) [@MSH](https://meta.discourse.org/u/MSH)
#### Post date: [October 5, 2022, 9:36am UTC](https://meta.discourse.org/t/issues-adding-css-js-component-robustifying-links-to-preserve-link-functionality/240997/1 "2022-10-05T09:36:21Z")

</div>

TL;DR summary:

- Issues incorporating javascript & CSS links to enable Robustify tooltip pop-ups to hyperlinks on [our Discourse](https://ukwa.discourse.group/).
- Some similarities to this [earlier case](https://meta.discourse.org/t/difficulties-in-correctly-adding-external-javascript/118099/4) although we’re stopping short of querying the [Robustify API](https://robustlinks.mementoweb.org/tools/); maybe sensible to go this route eventually but had intended to start just by enabling popups for correctly wrapped hyperlinks.

Details:

I am writing with a hopefully straightforward question about implementing a small CSS/JS app on [our Discourse forum](https://ukwa.discourse.group/): we are trying to use a neat little app [put together by Mementoweb](https://robustlinks.mementoweb.org/tools/) that attaches a pop-up box to any hyperlinks on a page, allowing you to choose between accessing the site or viewing an earlier cached version of the site if the link is no longer functional. It is a really neat feature!, & we’re hoping it might solve some of the inevitable problems around coming back to a website a couple of years later & finding dead links to unmaintained pages. Initially I hoped to just try ensuring it would work when one of us manually generates a code on the Robustify site ([example](https://robustlinks.mementoweb.org/robustify/?anchor_text=Archive.Org&url=http%3A%2F%2Farchive.org)).

The app runs on a couple of lines of code - links are wrapped with a longer _a href_ tag, & there are links to a CSS stylesheet and some Javascript code in the head tags. I was a little unsure whether Discourse would permit Javascript customization but was really encouraged reading the [Beginner’s guide](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) & seeing how much scope there was for modifications. We’re using a remote theme (Sam’s Simple Theme) and I’ve tried to add our code to the site header as a new component:

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/4/f/e4fd8635d63c232f1896f005fdaf17cfc069f4b9.png)  
 ![image](https://global.discourse-cdn.com/meta/original/4X/5/d/f/5dffb80a64089b221e9d29736daeaa5a4e51c9dd.png)

I haven’t been able to get this up & running yet but thought I’d solved it yesterday, reading up on plugins & switching out our JS type value to _“text/discourse-plugin” version=“0.8.13”_; I’ve also tried to solve around the slight variables of relocating the CSS (linking the sheet directly instead of as a DOI; copying the tags directly into the CSS space; including as Embedded CSS, etc) without any luck - posts with wrapped links still appear without a popup:

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/7/9/f79f4d5f1158e55016932434db22a4d90189d22a.png)  
Any guidance much appreciated here!, & I’ll bump this post if I stumble on a solution in the meantime.

---

<div class="post-metadata">

### Author: ![fzngagan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/fzngagan/32/259349_2.png) [@fzngagan](https://meta.discourse.org/u/fzngagan)
#### Post date: [October 11, 2022, 8:24am UTC](https://meta.discourse.org/t/issues-adding-css-js-component-robustifying-links-to-preserve-link-functionality/240997/4 "2022-10-11T08:24:20Z")

</div>

Can you share a screenshot of your browser’s javascript console and the `Network` tab. It could be a Content Security Policy (CSP) issue which is preventing the js code to be loaded on the page.

---

<div class="post-metadata">

### Author: ![MSH](https://avatars.discourse-cdn.com/v4/letter/m/e19b73/32.png) [@MSH](https://meta.discourse.org/u/MSH)
#### Post date: [October 11, 2022, 11:42am UTC](https://meta.discourse.org/t/issues-adding-css-js-component-robustifying-links-to-preserve-link-functionality/240997/6 "2022-10-11T11:42:09Z")

</div>

TY Faizaan 🙂 Including a screenshot below, can’t immediately see a CSP issue but happy to try another machine if it might help:

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/0/5/d05807e70240790faaff8ee6fa43594f4eca312a.png)

Have glanced at the code & it does look like there’s some sort of overwrite preventing the Javascript tags pictured in the screenshot in the earlier post from being incorporated:

![image](https://global.discourse-cdn.com/meta/optimized/4X/9/b/7/9b778aef1fe2ab5a6f61475e52dc0e4842d1ff39_2_690x48.png)

I’m not 100% sure whether this is a result of switching out the script-type value from _text/javascript_ to _text/discourse-plugin_; have a feeling it wasn’t working with the original value, & there’s no longer a pointer to the JS DOI indicated in the Component code.

TY for support with this one - wonder if it might end up being easier to try to configure the fuller API if more problems getting the individual links up & running.
