AnsweredAssumed Answered

Creating different colored tabs in StoryMaps downloadable template?

Question asked by wuen0609 on Aug 23, 2015
Latest reply on Aug 24, 2015 by SSylvia-esristaff

I would like to have header type tabs that indicate the general theme of the underlying tabs which are all records of science research projects and ecology type monitoring (themes are general categories like wildlife, air quality, vegetation ecology, etc.) in my storymaps project. I'm privately hosting the template. It would be nice to visually distinguish these header tabs with different colors than their underlying projects, so users recognize quickly what they are how it is organized. I looked through the config.js page (pasted below) and it looks like everything is controlled the same. Does anyone know of a way to edit separate tab background colors?

Thanks very much,



            id: "accordion",

            thumbnail: "resources/tpl/builder/icons/builder-layout-accordion.png",

            liveApp: "",

            sizes: { small: '25%', medium: '35%', large: '45%' },

            positions: ["left", "right"],

            themes: [


                    name: "accordion-default-1",

                    group: "default",

                    themeMajor: "white",

                    header: "#283239",

                    headerTitle: "#FFFFFF",

                    headerText: "#D9D9D9",

                    panel: "#DBD9DA",

                    text: "#000000",

                    textLink: "#555555",

                    media: "#FFFFFF",

                    mapControls: "#DBD9DA",   

                    softText: "#444444",

                    softBtn: "#444444",

                    esriLogo: "white",

                    esriLogoMobile: "black",

                    // Arrow and entries separator

                    accordionArrow: "#58ADCC",

                    accordionArrowActive: "#FFFFFF",

                    accordionArrowHover: "#9ACCDE",

                    accordionNumber: "#60788A",

                    accordionTitle: "#000000"