External CSS links for Portal Site Pages?

933
6
12-06-2019 06:37 AM
SBerg_VHB
Occasional Contributor

Hello, is it possible to include external css references into a portal site page?

An example would be adding font-awesome to be able to include icons for social media links in the footer, ie.:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

  <li><a href="https://twitter.com/<>" aria-label="Twitter"><i class="fa fa-twitter"></i></a></li>

We have tried including the link reference in the header css but it is getting stripped out of the published page.

0 Kudos
6 Replies
JoeCatanzarita1
Occasional Contributor II

Sam Berg‌,

This documentation might be what you're interested in: Set advanced portal options—Portal for ArcGIS (10.7 and 10.7.1) | ArcGIS Enterprise. I would take a look at the footerLinks section in particular, some examples are given.

The config.js file that you can alter is located at: C:\Program Files\ArcGIS\Portal\customizations\<portal_version>\webapps\arcgis#home\js\arcgisonline. Prior to making any changes to this file, I would recommend making a backup of the existing config.js.

Best of luck!

Joe

0 Kudos
SBerg_VHB
Occasional Contributor

Joe Catanzarita‌, thanks - this documentation looks like it applies to customizing the portal landing page itself.  Our use case is instead for custom "site pages"- sorry if that was not clear.  Is there support for external style sheets in a site page as well?

Thanks for the info.

Sam

0 Kudos
DavidMcCorkindale1
New Contributor III

@SBerg_VHB  did you ever get a resolution to this? I'm also looking to do this.

Thanks.

David

0 Kudos
SBerg_VHB
Occasional Contributor

Hi @DavidMcCorkindale1 - yes we found that if you use a style import as opposed to a <link> it works as expected.

ie.

<style>
@import("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
</style>

-hope that helps.

Sam

DavidMcCorkindale1
New Contributor III

That's great, thanks. Much appreciated.

0 Kudos
AlderMaps
Occasional Contributor

@SBerg_VHB can you confirm that @import is still working for you for this purpose? Tried it and am not having any luck, and this post seems to imply that they are no longer allowing importing css (though this post does specifically reference <link> rather than @import). At first I thought the fact that @import worked for you was because the original post was from 2019, but I see your latest reply is only from a week ago. 

Would love if this still worked and my issue is simply user error; my embedded css is getting a little cumbersome. Thanks.

0 Kudos