nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Can I change the Header Link Text COLOR.

KennethBusby

Is there a way to change the color of the Header Link Text in a Journal map? I do not see a way in settings and have only been able to do so through Inspecting and changing the color that way but it is only temporary as any refresh and the change is lost. The default color is almost invisible.

Thanks.

Ken

Vind meer berichten getagd met

Accepted answers

oevans_storymaps

Hi Ken,

Sure, no problem. Here you go...

<style type="text/css">.link {
     color: blue !important;
}
</style>

It's the link element you need to change the color on (not linkContainer), and you'll also need to use !important to make sure your style change overrides the existing style.

Some more good examples are in this article, which is linked to in the one I referenced above: Create buttons for main stage actions using the style tag

Owen

2016-06-24 at 8.39.38 AM.JPG

2016-06-24 at 8.38.08 AM.JPG

All comments

oevans_storymaps

Ken -- if you've found the right CSS property to override that color you can pass that in via a <style> tag in the HTML editor in any section to make the change permanently.

Check this blog out for more detail on how to do that: https://developerscorner.storymaps.arcgis.com/using-custom-html-in-map-journal-70913cfff66e

Owen

KennethBusby

This is great to know but does it allow for customization of the header text above the description container?

oevans_storymaps

Yup!

KennethBusby

How. Do I put the HTML in the line for the Header link

oevans_storymaps

Hi Ken,

As that article says, style overrides are global so your can put them (even ones that impact the header) in any section. Just edit a section of your story, go to the HTML Source View, and paste your <style> tag code at the top of bottom.

Owen

KennethBusby

Maybe I am missing something. can you show me what code I should use. I attempted to put

</style>

div.header {color:black;}

</style>

oevans_storymaps

Hi Ken,

Sure, no problem. Here you go...

<style type="text/css">.link {
     color: blue !important;
}
</style>

It's the link element you need to change the color on (not linkContainer), and you'll also need to use !important to make sure your style change overrides the existing style.

Some more good examples are in this article, which is linked to in the one I referenced above: Create buttons for main stage actions using the style tag

Owen

2016-06-24 at 8.39.38 AM.JPG

2016-06-24 at 8.38.08 AM.JPG

KennethBusby

Thank you

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.