# Adding an external resource conditionally

**URL:** <https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932>\
**Category:** Third Party Plugins\
**Created:** [May 12, 2017, 10:09am UTC](https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932 "2017-05-12T10:09:41Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Thomas](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/thomas/32/61_2.png) [@Thomas](https://forum.pinegrow.com/u/Thomas)\
**Post date:** [May 12, 2017, 10:09am UTC](https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932/1 "2017-05-12T10:09:41Z")

</div>

Hi guys,

another one:

Having this for loading an external stylesheet:

```
var res = new PgComponentTypeResource('https://clients.updog.co/Reginald-theMagicGrid/css/magicstyles.css');
res.type = 'text/css';
 f.resources.add(res);

```

That’s fine - however it appends it to all already existing sheets. Especially the default style.css . But it necessarily should load before the style.css (supposed for overwrite the external one).

If you could be so kind pointing me here as well into the correct direction.

Thanks in advance.

Cheers

Thomas

---

<div class="post-metadata">

**Author:** ![itsmeleo](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/itsmeleo/32/19_2.png) [@itsmeleo](https://forum.pinegrow.com/u/itsmeleo)\
**Post date:** [May 14, 2017, 4:05am UTC](https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932/2 "2017-05-14T04:05:29Z")

</div>

you can use hasDetect on your new pgFramework Object if

```
              f = new pgFramework 
              f.detect = function(check){
                    return check.hasScript(put here script name); <<< this function will get a regular expersions or script name.
               }
```

---

<div class="post-metadata">

**Author:** ![Thomas](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/thomas/32/61_2.png) [@Thomas](https://forum.pinegrow.com/u/Thomas)\
**Post date:** [May 15, 2017, 12:34pm UTC](https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932/3 "2017-05-15T12:34:02Z")

</div>

Thanks @itsmeleo

I have already this one in the plugin-script (adopted from the 960 grid example from @matjaz) but I’m certainly not really understanding it:

```
   //Auto detect 960 grid. It can also be manually added / removed from a page with Framework Manager
    f.detect = function (pgPage) {
        return pgPage.hasStylesheet(/(^|\/)960.*\.(css|less)/i);
    } 

```

Is it there to adjust the path?

Cheers

Thomas

---

<div class="post-metadata">

**Author:** ![itsmeleo](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/itsmeleo/32/19_2.png) [@itsmeleo](https://forum.pinegrow.com/u/itsmeleo)\
**Post date:** [May 15, 2017, 12:48pm UTC](https://forum.pinegrow.com/t/adding-an-external-resource-conditionally/932/4 "2017-05-15T12:48:39Z")

</div>

You have to change the RegEx here its only detecting 960grid if this css is added already so replace 960 with your css or add 960 in the name of your styles so they will get detected.