Mailing List Archive: Horizon Custom Logos (Queens, 13.0.1)

Hi Y'all,

I've been banging my head against a wall for days on this item and can't
find anything via google on how to get around it - I am trying to
install a custom logo onto my Horizon Dashboard front page (the splash
page). I have my logo ready to go, logo-splash.png. I have tried
following the instructions here on how to install a custom logo:

https://docs.openstack.org/horizon/queens/admin/customize-configure.html

But it simply doesn't work. It seems this stanza...

#splash .login {
background: #355796 url(../img/my_cloud_logo_medium.png) no-repeat
center 35px;
}

...doesn't actually replace the logo (which is logo-splash.svg), it only
seems to put my file, logo-splash.png as the *background* to the .svg
logo. And since the option there is "no-repeat center", it appears
*behind* the svg logo and I can't see it. I played around with those
options, removing "no-repeat" for example, and it dutifully shows my
logo repeating in the background. But I need the default
logo-splash.svg file to actually be gone and my logo to exist in it's
place. Maybe I'm missing something simple?

I'm restarting apache and memchached after every change I make when I
was testing.

And because the images directory is rebuilt every time I restart apache,
I can't even copy in a custom logo-splash.svg file. Which wouldn't
help anyway, as I want my .png file in there instead. I don't have the
means to create a .svg file at this time. ;)

Help!

As a side note, I'm using the Queens distribution via RedHat.

Many thanks in advance,
erich

_______________________________________________
OpenStack-operators mailing list
OpenStack-operators@lists.openstack.org
http://lists.openstack.org/cgi-bin/mailman/listinfo/openstack-operators

Hi Erich.

Yeah, I battled against this myself quite recently. Here's what I did to
add a logo to the Horizon splash page and to the header of each page
itself.

Create a file called _splash.html, containing:

<div class="text-center">
<img class="splash-logo" src={% themable_asset "img/logo.png" %}>
</div>

And a file called _brand.html, containing:

{% load branding %}
{% load themes %}

<a class="navbar-brand" href="{% site_branding_link %}" target="_self">
<img class="openstack-logo" src="{% themable_asset 'img/logo.png' %}"
alt="{% site_branding %}">
</a>

I then created a folder
called /usr/share/openstack-dashboard/openstack_dashboard/themes/default/templates/auth/
and copied _splash.html into there, copied _brand.html
into /usr/share/openstack-dashboard/openstack_dashboard/templates/header/,
and finally my 'logo.png' was copied
into /usr/lib/python2.7/site-packages/openstack_dashboard/static/dashboard/img/

Note that this approach might differ slightly from your setup, as in my
case it's a Kolla-based deployment so these changes are applied to the
image I'm using to deploy a Horizon container. But it's the same release
(Queens) and a CentOS base image, so in principle the steps should work for
you.

Hope that helps.

--

-Nick

On 20 August 2018 at 17:40, Erich Weiler <weiler@soe.ucsc.edu> wrote:

> Hi Y'all,
>
> I've been banging my head against a wall for days on this item and can't
> find anything via google on how to get around it - I am trying to install a
> custom logo onto my Horizon Dashboard front page (the splash page). I have
> my logo ready to go, logo-splash.png. I have tried following the
> instructions here on how to install a custom logo:
>
> https://docs.openstack.org/horizon/queens/admin/customize-configure.html
>
> But it simply doesn't work. It seems this stanza...
>
> #splash .login {
> background: #355796 url(../img/my_cloud_logo_medium.png) no-repeat center
> 35px;
> }
>
> ...doesn't actually replace the logo (which is logo-splash.svg), it only
> seems to put my file, logo-splash.png as the *background* to the .svg
> logo. And since the option there is "no-repeat center", it appears
> *behind* the svg logo and I can't see it. I played around with those
> options, removing "no-repeat" for example, and it dutifully shows my logo
> repeating in the background. But I need the default logo-splash.svg file
> to actually be gone and my logo to exist in it's place. Maybe I'm missing
> something simple?
>
> I'm restarting apache and memchached after every change I make when I was
> testing.
>
> And because the images directory is rebuilt every time I restart apache, I
> can't even copy in a custom logo-splash.svg file. Which wouldn't help
> anyway, as I want my .png file in there instead. I don't have the means to
> create a .svg file at this time. ;)
>
> Help!
>
> As a side note, I'm using the Queens distribution via RedHat.
>
> Many thanks in advance,
> erich
>
> _______________________________________________
> OpenStack-operators mailing list
> OpenStack-operators@lists.openstack.org
> http://lists.openstack.org/cgi-bin/mailman/listinfo/openstack-operators
>