# Logo image in the Nav-bar

**URL:** https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211
**Category:** Ask for Help
**Created:** [January 28, 2023, 11:58am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211 "2023-01-28T11:58:05Z")
**Posts on this page:** 18
**Page:** 1

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [January 28, 2023, 11:58am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/1 "2023-01-28T11:58:05Z")

</div>

Hi,  
Can anyone help me with pages CSS to put an image in the top bar?

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/e/7e6437dfa994f11dbf493e9318130c27f19ea407.png)

---

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [January 28, 2023, 12:10pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/3 "2023-01-28T12:10:46Z")

</div>

not working

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/4/244cdea3bab15022df838991a4832f17fac85743.jpeg)

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [January 28, 2023, 12:18pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/4 "2023-01-28T12:18:32Z")

</div>

You can include a logo in the top nav bar without CSS.

Go to Settings-\>Name & Icon, add a logo and choose “Show Logo and Title”

---

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [January 28, 2023, 12:20pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/5 "2023-01-28T12:20:38Z")

</div>

its really small can hardly see it  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/7/578070643fc0560fd3f4bc1192369b1a49caf37e.png)

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [January 28, 2023, 12:29pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/6 "2023-01-28T12:29:38Z")

</div>

You might be able to adjust that with CSS, but it’s not something I’d want to mess around with.

I’d try experimenting with different image sizes and width/height ratio.

@Lin_Altshuler - I checked a couple of mine, and it looks like the rendered aspect ratio is 7:3. So if you prepare an image that matches that then that’s probably the best you’ll get without messing with CSS.

![Screen Shot 2023-01-28 at 8.34.13 PM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/b/db987c63c780636af91a9c384daa83bc7de26c77.png)

---

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [January 28, 2023, 1:42pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/8 "2023-01-28T13:42:43Z")

</div>

I was also able to fix using this  
.gqqeok {  
max-height: 55px;  
max-width: 340px;  
}

\*\* The class name is not stable

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [January 29, 2023, 2:26am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/9 "2023-01-29T02:26:12Z")

</div>

That class might change on different devices, in addition to the problem that Glide can change it anytime, so please don’t use it.

In addition to what Darren said, I found the underlying transformation that Glide uses (with Cloudinary) for the logo to be: h\_75, c\_limit.

“h\_75” stands for “height 75”, which sets the height of the image to 75 pixels.

“c\_limit” scales your image down if the original asset is larger than the specified limit (in this case height = 75). The asset is scaled down so that it takes up as much space as possible within a bounding box defined by the specified width and height parameters. The original aspect ratio is retained (by default) and all of the original asset is visible. This mode doesn’t scale up the asset if your requested dimensions are larger than the original image size.

Hence, it seems like the best size is 175 x 75 px.

---

<div class="post-metadata">

### Author: ![S\_Kem](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/s_kem/32/53536_2.png) [@S\_Kem](https://community.glideapps.com/u/S_Kem)
#### Post date: [January 29, 2023, 5:03pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/10 "2023-01-29T17:03:51Z")

</div>

Does anyone know why the logo shows up only in the Glide pages up, but not the glide mobile app?

This was working previously but now it’s missing…

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [January 30, 2023, 12:01am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/11 "2023-01-30T00:01:26Z")

</div>

Where did you see the behaviour of logos showing in the Glide “mobile app”? Is it the app version of Glide Pages, or Glide Apps?

---

<div class="post-metadata">

### Author: ![S\_Kem](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/s_kem/32/53536_2.png) [@S\_Kem](https://community.glideapps.com/u/S_Kem)
#### Post date: [February 2, 2023, 1:42pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/12 "2023-02-02T13:42:06Z")

</div>

it was the app version of glide pages

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [February 2, 2023, 11:47pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/13 "2023-02-02T23:47:26Z")

</div>

Can you add some screenshots of the difference between what you saw before and now? I would be able to get the team to look at it with your screenshots. Thank you!

---

<div class="post-metadata">

### Author: ![Nele\_Inaduled](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nele_inaduled/32/45014_2.png) [@Nele\_Inaduled](https://community.glideapps.com/u/Nele_Inaduled)
#### Post date: [February 5, 2023, 3:53pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/14 "2023-02-05T15:53:17Z")

</div>

Yo uso este codigo para colocar el logo arriba en la barra:

#app-root div[opacity='1'] { color: transparent; } .nav-bar-root { content: ""; display: block; background-image: url(https://i.pinimg.com/originals/b6/75/78/b67578896d5cef5764cb110631ca8858.gif ); background-size: 100% 100%; background-repeat: no-repeat; background-position: center, center; ;}

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [February 6, 2023, 12:07am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/15 "2023-02-06T00:07:55Z")

</div>

That will be deprecated with the transition from Apps to Pages, so I wouldn’t recommend using CSS going forward.

---

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [February 14, 2023, 8:15pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/16 "2023-02-14T20:15:35Z")

</div>

> [@ThinhDinh](#):
>
> with the transition from Apps to Pages

Can you please explain?  
Anything mew on this subject?  
I have a huge app hat I want to rewrite in pages and it will take me forever.  
Anything automated planned?

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [February 14, 2023, 11:21pm UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/17 "2023-02-14T23:21:03Z")

</div>

Here’s the latest update:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/e/2ef4420a3e8b92d8c48b47bbb6a26b69f9ceb7ec.png)

It includes “better default generated page from existing data”, so I know they’re working on that transition. Of course we don’t have an ETA on when it would be close to perfect on a converter between Apps and Pages, but there’s progress.

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [February 15, 2023, 1:34am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/18 "2023-02-15T01:34:04Z")

</div>

> [@Lin\_Altshuler](#):
>
> Can you please explain?  
> Anything mew on this subject?

Have you seen the below?  
You should watch.

> [@Recording: Gliding into the New Year tada](https://community.glideapps.com/t/recording-gliding-into-the-new-year/55482):
>
> Hello Gliders! wave We wrapped 2022 with our Gliding into the New Year meetup. Glide co-founder & CEO @david covered: Highlights & milestones of the past year A look ahead to 2023, with a sneak peek at work in progress Answering as many of your questions as we can Thank you to everyone who joined us! Here are the highlights: [[Gliding into the New Year 2022 (in 9 minutes)] ](https://www.youtube.com/watch?v=_ELWUuaiGjA)[You can also watch the full replay on YouTube.](https://youtu.be/F5pXIZy71Oo) Have any questions or comments? Drop them below!

---

<div class="post-metadata">

### Author: ![Lin\_Altshuler](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lin_altshuler/32/32591_2.png) [@Lin\_Altshuler](https://community.glideapps.com/u/Lin_Altshuler)
#### Post date: [February 15, 2023, 2:09am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/19 "2023-02-15T02:09:07Z")

</div>

I am not sure if I should wait or start rebuilding the app in pages.  
Do you think Glide will ever convert an app to a page at least partially?  
I took me more than a year to build the app…

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [February 15, 2023, 2:12am UTC](https://community.glideapps.com/t/logo-image-in-the-nav-bar/57211/20 "2023-02-15T02:12:43Z")

</div>

> [@Lin\_Altshuler](#):
>
> Do you think Glide will ever convert an app to a page at least partially?

Yes, for sure. And they have said that they will provide better migration tools once the time comes.  
I wouldn’t be too concerned, there is no rush. Apps will be around (and will be supported) for a while yet. At least another year.
