← Back to team overview

dhis2-devs team mailing list archive

Re: DHIS2 logo edit

 

Hi Anne,

I would suggesting using Apps —> Settings —> Appearance Settings
You’ll have to create an external-static/ directory on your web server and put the new images there (the dimensions are on the settings page)

If you simply swap out the logo image file in web apps directory it won’t persist if you deploy a new version of DHIS 2.

If  you’d like to make additional changes I suggest using the web API documented here: 
https://www.dhis2.org/doc/snapshot/en/developer/html/ch01s41.html

Here is a brief example:
---
If you want customize the look of DHIS 2 via CSS, here is an example of a clean way to use your own CSS.
In this example we'll hide the flag and the footer on the DHIS 2 login page.

Following the documentation here https://www.dhis2.org/doc/snapshot/en/developer/html/ch01s41.html

This is how to hide the flag and the footer on the home page.

I created a file mystyle.css (the name doesn’t matter) and it contained
#flagArea
{
  visibility: hidden;
  position: absolute;
  top: 22px;
  left: 52px;
  border: 1px solid #d5d5d5;
  border-radius: 2px;
  max-width: 105px;
  margin-bottom: 5%;
}

#footerArea
 {
  visibility: hidden; 
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 10px 0 9px 0;
  font-size: 13px;
  border-top: 1px solid #416f9d;
  color: #6b90b8;
  width: 100%;
}

Then make the following curl call which posts the file to the server.
curl -d @mystyle.css "https://example.com/api/files/style"; -H "Content-Type:text/css" -u username:password

If you view the source of the home page you’ll notice a call to 
<link type="text/css" rel="stylesheet" href="../../api/files/style/external" />

If you look here you’ll be able to see the CSS that I just added.
https://example.com/api/files/style/external

Please note that when you post a new file to https://example.com/api/files/style it will overwrite the current version, so you have to include all of your previous changes.
—




Dan Cocos
BAO Systems
www.baosystems.com <http://www.baosystems.com/>
T: +1 202-352-2671 | skype: dancocos


> On Dec 30, 2014, at 10:38 AM, Calle Hedberg <calle.hedberg@xxxxxxxxx> wrote:
> 
> Anne,
> 
> I don't know if you are running a local instance or a server instance, but the dashboard banner file can be found in the folder
> 
> Tomcat 7.0\webapps\dhis\dhis-web-commons\css\green\logo_banner.png
> 
> I picked this from a local instance on my machine - the initial path might be slightly different on a server.
> 
> So what you need to do is to modify that logo_banner.png file - keep the size etc but insert your logo (what is it - a big chain-saw or two axes?? ;-) ) instead of the DHIS2 text.
> 
> Regards
> Calle
> 
> 
> 
> On 30 December 2014 at 17:08, Calle Hedberg <calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>> wrote:
> Anne,
> 
> Hold on - I'm checking something out here...
> 
> Regards
> Calle
> 
> On 30 December 2014 at 16:59, Anne Grace <missannegrace@xxxxxxxxx <mailto:missannegrace@xxxxxxxxx>> wrote:
> just the "DHIS2"Logo on the left side.
> On 30 Dec 2014, at 16:53, Calle Hedberg <calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>> wrote:
> 
>> Anne,
>> 
>> So you want to replace the whole green banner on top? Or do you want to replace only the "dhis2" on the left side of it with a logo?
>> 
>> Regards
>> calle
>> 
>> On 30 December 2014 at 16:34, Anne Grace <missannegrace@xxxxxxxxx <mailto:missannegrace@xxxxxxxxx>> wrote:
>> Dear calle,
>> 
>> attached is the home page and the DHIS logo i would like to edit.<Screen Shot 2014-12-30 at 16.33.34.png>
>> 
>> On 30 Dec 2014, at 16:28, Calle Hedberg <calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>> wrote:
>> 
>>> Anne,
>>> 
>>> Sorry, forgot to mention: You can also design a complete custom start up form, if you want. The only thing I believe you cannot completely remove is the small icon in the lower left corner: "Powered by DHIS2".
>>> 
>>> Best regards
>>> Calle
>>> 
>>> On 30 December 2014 at 16:22, Calle Hedberg <calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>> wrote:
>>> Anne,
>>> 
>>> Open the "Settings" app, then select "Appearance"
>>> 
>>> Here you can specify things like flags etc, OR you can enter text, OR you can use HTML to insert your own logos/picture.
>>> 
>>> For instance, in the Namibia instance I'm working on right now, we have a Namibian flag in the upper left corner and the Ministry of Health and social Services logo under the login&password section. To get the latter, we pasted the following into the "Application Notification" box:
>>> 
>>> <img id="health_logo" width="240" vspace="0" hspace="0" height="204" border="0" align="centre" alt="" src="http://www.hisp.org/logos/nam_moh_logo.png <http://www.hisp.org/logos/nam_moh_logo.png>"></img>
>>> 
>>> Regards
>>> Calle
>>> Cape Town
>>> 
>>> On 30 December 2014 at 15:21, Anne Grace <missannegrace@xxxxxxxxx <mailto:missannegrace@xxxxxxxxx>> wrote:
>>> Dear Devs,
>>> 
>>> I would like to remove the DHIS2 logo on my system home page and replace it with our system name.
>>> How can i do that?
>>> 
>>> Thanks,
>>> 
>>> Anne
>>> 
>>> 
>>> _______________________________________________
>>> Mailing list: https://launchpad.net/~dhis2-devs <https://launchpad.net/~dhis2-devs>
>>> Post to     : dhis2-devs@xxxxxxxxxxxxxxxxxxx <mailto:dhis2-devs@xxxxxxxxxxxxxxxxxxx>
>>> Unsubscribe : https://launchpad.net/~dhis2-devs <https://launchpad.net/~dhis2-devs>
>>> More help   : https://help.launchpad.net/ListHelp <https://help.launchpad.net/ListHelp>
>>> 
>>> 
>>> 
>>> -- 
>>> ******************************************* <>
>>> Calle Hedberg
>>> 
>>> 46D Alma Road, 7700 Rosebank, SOUTH AFRICA 
>>> 
>>> Tel/fax (home): +27-21-685-6472 <tel:%2B27-21-685-6472>
>>> Cell: +27-82-853-5352 <tel:%2B27-82-853-5352>
>>> Iridium SatPhone: +8816-315-19274 <tel:%2B8816-315-19274>
>>> Email: calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>
>>> Skype: calle_hedberg
>>> 
>>> *******************************************
>>> 
>>> 
>>> 
>>> 
>>> 
>>> -- 
>>> ******************************************* <>
>>> Calle Hedberg
>>> 
>>> 46D Alma Road, 7700 Rosebank, SOUTH AFRICA 
>>> 
>>> Tel/fax (home): +27-21-685-6472 <tel:%2B27-21-685-6472>
>>> Cell: +27-82-853-5352 <tel:%2B27-82-853-5352>
>>> Iridium SatPhone: +8816-315-19274 <tel:%2B8816-315-19274>
>>> Email: calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>
>>> Skype: calle_hedberg
>>> 
>>> *******************************************
>>> 
>>> 
>> 
>> 
>> 
>> 
>> -- 
>> ******************************************* <>
>> Calle Hedberg
>> 
>> 46D Alma Road, 7700 Rosebank, SOUTH AFRICA 
>> 
>> Tel/fax (home): +27-21-685-6472 <tel:%2B27-21-685-6472>
>> Cell: +27-82-853-5352 <tel:%2B27-82-853-5352>
>> Iridium SatPhone: +8816-315-19274 <tel:%2B8816-315-19274>
>> Email: calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>
>> Skype: calle_hedberg
>> 
>> *******************************************
>> 
>> 
> 
> 
> 
> 
> -- 
> ******************************************* <>
> Calle Hedberg
> 
> 46D Alma Road, 7700 Rosebank, SOUTH AFRICA 
> 
> Tel/fax (home): +27-21-685-6472 <tel:%2B27-21-685-6472>
> Cell: +27-82-853-5352 <tel:%2B27-82-853-5352>
> Iridium SatPhone: +8816-315-19274 <tel:%2B8816-315-19274>
> Email: calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>
> Skype: calle_hedberg
> 
> *******************************************
> 
> 
> 
> 
> 
> -- 
> ******************************************* <>
> Calle Hedberg
> 
> 46D Alma Road, 7700 Rosebank, SOUTH AFRICA 
> 
> Tel/fax (home): +27-21-685-6472
> 
> Cell: +27-82-853-5352
> 
> Iridium SatPhone: +8816-315-19274
> 
> Email: calle.hedberg@xxxxxxxxx <mailto:calle.hedberg@xxxxxxxxx>
> Skype: calle_hedberg
> 
> *******************************************
> 
> 
> _______________________________________________
> Mailing list: https://launchpad.net/~dhis2-devs <https://launchpad.net/~dhis2-devs>
> Post to     : dhis2-devs@xxxxxxxxxxxxxxxxxxx <mailto:dhis2-devs@xxxxxxxxxxxxxxxxxxx>
> Unsubscribe : https://launchpad.net/~dhis2-devs <https://launchpad.net/~dhis2-devs>
> More help   : https://help.launchpad.net/ListHelp <https://help.launchpad.net/ListHelp>

References