Archive

Image in the top left of Splunk View

Path Finder

Hi i have created an app and included a logo(.png file) for that.

The logo can be seen in Splunk > Home.

But i also want it when i click on that app, like we get the logo in top left of the splunk window in Sideview utls app, Google maps app etc.

Can we do that on our own app, ie to get logo my own app in the top left of the splunk window.

Tags (3)
0 Karma
1 Solution

Legend

In your app's appserver/static/application.css:

.appLogo {
    height: <somethingappropriate>px; 
    width: <somethingappropriate>px;
    background-image: url(yourpic.png);
    background-repeat: no-repeat;
}

Your image should also reside in appserver/static.

View solution in original post

Legend

In your app's appserver/static/application.css:

.appLogo {
    height: <somethingappropriate>px; 
    width: <somethingappropriate>px;
    background-image: url(yourpic.png);
    background-repeat: no-repeat;
}

Your image should also reside in appserver/static.

View solution in original post

Contributor

Ok. I found the proble.
I had copied everything in the appserver/static (also the images iteself).
While I had to put them into /static and the .css file under /appserver/static

0 Karma

Contributor

Hi,

Here is what I have:
/opt/splunk/etc/apps//appserver/static
[splunk@splunk static]$ ls
appIcon2x.png application.css appLogo2x.png

and here is the application.css part of the content:
.appLogo {
height: 80px;
width: 308px;
background-image: url(appLogo_2x.png);
background-repeat: no-repeat;
}

I tried also with double quotes, but it doesn't work... The dimesnsions are the one suggested by the Splunk docs about customizing apps and appearance...
But I just do not understand what is the bug....

Any suggstions?
Thanks,
Skender kollcaku

0 Karma

Legend

No double quotes necessary I think, but it doesn't hurt either.

0 Karma

Legend

That's because your image URL is wrong. Like I said your image should reside in the appserver/static directory but the URL you supply should not be anything else than just the filename. So if you have the file appIcon.png, then that's the only thing you should put in the background-image url.

Path Finder

Hi Ayn, thank you got it. What you should change in your code is background-image: url("yourpic.png");
Double quotes.
It will work like a charm.

0 Karma

Path Finder

Hey Ayn,
I did this

.appLogo {
height: 36px;
width: 150px;
background-image:url(/opt/splunk/etc/apps/dataflow/appserver/static/appIcon.png);
background-repeat: no-repeat;
}

splunk logo has gone but i m not able to see my image? its showing only blank space

0 Karma