ArcGIS Hub customize from HTML/CSS Layout items?

[JillPlescher]

Hi,

I'm no expert in editing HTML/CSS code, but sometimes I am able to sort through and make minor changes. I was wondering if there is a way to change CATEGORY BOX SIZE (the graphic).  I imported an icon, made it 120x120 pixels, but it came in too large compared to the others ones which are from the ESRI gallery.  So I changed the png to 100x100 pixels, and its the same size, which is too large.  Leading me to wonder if there is someway to change the code so that all the icons line up.  I wanted to change the height of the BANNER too and can't figure out a way to do that either.  

Thanks, 

[Anonymous User]

I was wondering the same thing.. I'd love to customize the box size and banner CSS too. I see for things inside elements sometimes there is the little custom CSS entry area but enabling more access to layout CSS would be great in Hub. Is Hub able to be on prem, like Portal? And if so is it fairly easy to customize, like WebApp Builder is for CSS?

[Katie_Clark]

As far as I know, the "Hub" equivalent for Portal is Enterprise Sites. You can't access the HTML/CSS for all of the "cookie cutter/drag and drop" elements in the layout options, but if you just use a text element, it's pretty much anything goes as far as customizing because you can just put your HTML in the text element. That's what I did for a site I designed in order to get the layout I wanted for certain sections. 

[Anonymous User]

Awesome thanks Katherine. We have not deployed Portal but will soon. I will take a look at Sites. Hopefully it'll be straightforward to tweak the built in CSS and leverage existing classes or build customizations on top of them.

[Katie_Clark]

Jill Plescher‌, do you have an example of the HTML you are trying to change? 

Also, apologies if I'm stating the obvious as I don't know how much experience you have, but have you utilized the "inspect" option in your browser to be able to view the page's HTML? It's super useful for learning how web pages are structured, and you can even use it to for reference when designing your own pages. I've found it very helpful!

[JillPlescher]

Hi, As you suggested I used the inspect option, my icon is 120x120, Esri icon is "auto" in the box.  Oh well, its not that big of an issue. I just keep running into things I would like to tweak a bit.  I'll try the text box option in the future.