# Fixed and custom position of site logo

**URL:** <https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844>\
**Category:** RapidWeaver Classic\
**Created:** [May 11, 2020, 11:05pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844 "2020-05-11T23:05:15Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![wayne](https://avatars.discourse-cdn.com/v4/letter/w/0ea827/32.png) [@wayne](https://forums.realmacsoftware.com/u/wayne)\
**Post date:** [May 11, 2020, 11:05pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/1 "2020-05-11T23:05:15Z")

</div>

Some years back I built a small site using the Magnesium theme in RW (4, I think). One thing I did back then was to pin the site logo to the upper right corner where it floats over the scrolling content below it. [See here](https://bettertogethercoaching.com).

I accomplished that by adding CSS code to every relevant page:  
#pageHeader img {  
position: fixed;  
right: 50px;  
top: 130px;  
z-index: 30;  
width: 200px;  
height: 200px;  
}

I also added a custom banner image. I edited the Magnesium theme to make the customization and saved it as my custom Mag theme. I can’t recall how I did the editing! Or wether it might help with my logo positioning.

Now I’m working on a new site and I’m hoping to use the Eclipse theme from ThemeFlood. Adding the CSS code above to any page has no effect. The site icon shows but it’s where the theme puts it by default.

How do I pin an image (the site logo) to the upper right corner of the browser window?

---

<div class="post-metadata">

**Author:** ![willwood](https://avatars.discourse-cdn.com/v4/letter/w/bc8723/32.png) [@willwood](https://forums.realmacsoftware.com/u/willwood)\
**Post date:** [May 12, 2020, 8:16am UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/2 "2020-05-12T08:16:13Z")

</div>

You can use the `#siteLogo` selector instead.

But be careful. Since you made your last website, popularity of tablet and smartphone devices has exploded exponentially.

You’re going to want to test this very carefully to make sure your logo image is not hiding a large proportion of the page on these devices. Especially elements like your nav bar.

For this reason, options to make logo images ‘fixed’ are seldom provided in themes nowadays.

You’ll either have to shrink the logo image much smaller than it currently is now or place your CSS code inside media breakpoints, so it only takes effect on the larger screen sizes.

---

<div class="post-metadata">

**Author:** ![wayne](https://avatars.discourse-cdn.com/v4/letter/w/0ea827/32.png) [@wayne](https://forums.realmacsoftware.com/u/wayne)\
**Post date:** [May 12, 2020, 1:50pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/3 "2020-05-12T13:50:57Z")

</div>

Thanks for help, straight from the horse’s mouth!

> [@](#):
>
> You can use the `#siteLogo` selector instead.

That works, sort of. I can position the image but it falls behind everything except the banner, even with a high z.

> [@](#):
>
> You’re going to want to test this very carefully…

Noted, and you’re probably right that I’ll end up ditching the idea. I was trying to leverage previous work to give myself options, but maybe it won’t work out.

---

<div class="post-metadata">

**Author:** ![willwood](https://avatars.discourse-cdn.com/v4/letter/w/bc8723/32.png) [@willwood](https://forums.realmacsoftware.com/u/willwood)\
**Post date:** [May 12, 2020, 2:00pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/4 "2020-05-12T14:00:16Z")

</div>

> [@wayne](#):
>
> That works, sort of. I can position the image but it falls behind everything except the banner, even with a high z.

Other elements may require defined positioning and z-index too. Please send us a link to what you have so far.

---

<div class="post-metadata">

**Author:** ![wayne](https://avatars.discourse-cdn.com/v4/letter/w/0ea827/32.png) [@wayne](https://forums.realmacsoftware.com/u/wayne)\
**Post date:** [May 12, 2020, 2:30pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/5 "2020-05-12T14:30:34Z")

</div>

My site is [here](https://www.aircompare.us/RIDS/). It’s definitely not complete content-wise but the framework is there.

The home page is where I’m tinkering with the logo.

The other pages use your default positioning, which I’m leaning towards now that I’ve placed a logo image of the right size there. And I’ve looked at the site with my phone and confirm the problems you warned of.

---

<div class="post-metadata">

**Author:** ![willwood](https://avatars.discourse-cdn.com/v4/letter/w/bc8723/32.png) [@willwood](https://forums.realmacsoftware.com/u/willwood)\
**Post date:** [May 12, 2020, 6:54pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/6 "2020-05-12T18:54:53Z")

</div>

I could get your logo image to display over the top of the menu. However it makes clicking the menu links very difficult.

My honest feedback is that you would probably be better to discontinue having a ‘fixed’ logo image on the screen. Place it amongst the title / slogan and allow it to scroll with the rest of the page. This will resolve all the problems.

As a side note, you should also go into your settings and turn CSS Consolidation back on. That’s the reason your icons in the menu are missing. And it will help the page load even faster.

---

<div class="post-metadata">

**Author:** ![wayne](https://avatars.discourse-cdn.com/v4/letter/w/0ea827/32.png) [@wayne](https://forums.realmacsoftware.com/u/wayne)\
**Post date:** [May 12, 2020, 8:09pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/7 "2020-05-12T20:09:11Z")

</div>

> [@](#):
>
> My honest feedback is that you would probably be better to discontinue having a ‘fixed’ logo image on the screen.

Agreed. It worked for a non-responsive site but makes no sense for a responsive one.

> [@](#):
>
> That’s the reason your icons in the menu are missing.

I’ve gone ahead and checked the box. (I don’t recall changing it, but maybe.) But I’m puzzled by your icon comment. The appearance has not changed that I can see.

---

<div class="post-metadata">

**Author:** ![willwood](https://avatars.discourse-cdn.com/v4/letter/w/bc8723/32.png) [@willwood](https://forums.realmacsoftware.com/u/willwood)\
**Post date:** [May 12, 2020, 9:46pm UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/8 "2020-05-12T21:46:12Z")

</div>

> [@wayne](#):
>
> The appearance has not changed that I can see.

Working now. Try clearing your browser cache to see the icons in mobile mode.

---

<div class="post-metadata">

**Author:** ![wayne](https://avatars.discourse-cdn.com/v4/letter/w/0ea827/32.png) [@wayne](https://forums.realmacsoftware.com/u/wayne)\
**Post date:** [May 13, 2020, 12:13am UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/9 "2020-05-13T00:13:02Z")

</div>

Ah! I see it now. Nice.  
Thanks!

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/system/32/25301_2.png) [@system](https://forums.realmacsoftware.com/u/system)\
**Post date:** [June 12, 2020, 10:13am UTC](https://forums.realmacsoftware.com/t/fixed-and-custom-position-of-site-logo/32844/10 "2020-06-12T10:13:08Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.