Tree View
Tree
List View
Alphabetical List
Share
Share
Search:
id:
180

name:

Changing the Logo



description:
You can change the logo that appears in the top left corner of your app to your company logo. Save a copy of your logo with a maximum width of 150 pixels and a maximum height of 80 pixels.

First, upload your logo as an attachment in your Qrimp app. See Adding Attachments

Copy the url where your image is located ie: http://mysite.qrimp.com/attachments/12345mylogo.png

There are two ways to change the logo:

Changing your logo in the skin (CSS)



Go to Design > Skins

Search the skin for #logo. Change or add the background element so the url for the background is the file location of your image, as below. Every character as symbol is needed, so type carefully!

#logo{
background: transparent url("http://mysite.com/attachment/12345mylogo.png") no-repeat scroll 0%;
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}

Remove the logo altogether


If you just want to remove the logo, you can comment out the 'background' line for the logo style, like this:

#logo{
/*background: transparent url("http://mysite.com/attachment/12345mylogo.png") no-repeat scroll 0%;*/
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}

Or mark it as none:

#logo{
background: none;
top: 25px;
left: 1px;
width: 200px;
height: 100px;
}

Adding a logo to a Custom Header


Below the Edit Skin section you can create a custom site header see Site Header. You can enter whatever HTML you wish in there, including the image link to your logo image. Note that if your logo is contained in a div called #logo, the CSS from the default Qrimp app skin, positions.css, will also apply to the div.

If you do this, the existing contents of your table header, such as your login link and search form will be overwritten, so be sure to include these in your site header as well.


ParentTopic: