# Can I specify random logos?

**URL:** https://meta.discourse.org/t/can-i-specify-random-logos/39339
**Category:** Support
**Created:** [February 10, 2016, 2:39pm UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339 "2016-02-10T14:39:07Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![AstonJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/astonj/32/215041_2.png) [@AstonJ](https://meta.discourse.org/u/AstonJ)
#### Post date: [February 10, 2016, 2:39pm UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/1 "2016-02-10T14:39:07Z")

</div>

Is it possible to (via a plug-in if necessary) randomly choose a logo (and small logo) from a set of 3 every time someone starts a new session (or until their browser refreshes the assets for the logo)?

The Ruby code is trivial - but how can we incorporate that into Discourse? 😕

---

<div class="post-metadata">

### Author: ![Alankrit\_Choudh](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alankrit_choudh/32/119698_2.png) [@Alankrit\_Choudh](https://meta.discourse.org/u/Alankrit_Choudh)
#### Post date: [February 10, 2016, 5:06pm UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/2 "2016-02-10T17:06:11Z")

</div>

You could do it with JS i suppose, here is code i hope it works

```plaintext
<script>
if (document.getElementById) { window.onload = swap };
function swap() {
var numimages=4;
rndimg = new Array("IMAGE URL 1", "IMAGE URL 2", "IMAGE URL 3", "IMAGE URL 4");
x=(Math.floor(Math.random()*numimages));
randomimage=(rndimg[x]);
document.getElementById("banner").style.logo-big = "url("+ randomimage +")";
}
</script>

```

PS this only works on **hard refresh**. also the css to big logo would be

```plaintext
.logo-big { 
background-image: url('DEFAULT LOGO IMAGE URL HERE');
}

```

The JS would work because i am using that to rotate my banner image randomly on every hard refresh not sure the exact code for logo CSS.

---

<div class="post-metadata">

### Author: ![AstonJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/astonj/32/215041_2.png) [@AstonJ](https://meta.discourse.org/u/AstonJ)
#### Post date: [February 10, 2016, 5:51pm UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/3 "2016-02-10T17:51:49Z")

</div>

Thanks - I’ll give that a go 🙂

---

<div class="post-metadata">

### Author: ![Michael\_Smart](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/michael_smart/32/68189_2.png) [@Michael\_Smart](https://meta.discourse.org/u/Michael_Smart)
#### Post date: [February 24, 2017, 10:56am UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/4 "2017-02-24T10:56:06Z")

</div>

Hi,

This is exactly what I need! Is the second part required? Also where does the first part get put exactly?

Best,  
Michael

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [May 6, 2019, 12:19am UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/5 "2019-05-06T00:19:44Z")

</div>



---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [May 6, 2019, 7:39am UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/6 "2019-05-06T07:39:04Z")

</div>

This is doable in a theme component, the method by @Alankrit_Choudh can work but I would recommend adding a custom ember initializer instead that overrides the URL in discourse instead of relying on window.onload here.

---

<div class="post-metadata">

### Author: ![Gunnar](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gunnar/32/119647_2.png) [@Gunnar](https://meta.discourse.org/u/Gunnar)
#### Post date: [June 10, 2021, 4:52am UTC](https://meta.discourse.org/t/can-i-specify-random-logos/39339/7 "2021-06-10T04:52:39Z")

</div>

> [@sam](#):
>
> a custom ember initializer instead that overrides the URL in discourse

Sam,

I’ve run up against the same problem. `window.onload` works if called before `</head>`, but not if called later. And because of that, `document.getElementById` fails (the ID isn’t defined yet).

Could you point me to a primer/example/howto for how to create a custom ember initializer for someone who has no experience with ember?

For completeness, what I’m trying to do is display a random banner image from an array of URLs:

```plaintext
var jlmyPix = new Array(
     '/img/pic0.jpeg',
     [...]
     '/img/picN.jpeg'
);

function jlchoosePic() {
     var jlrandomPicNum = Math.floor(Math.random() * jlmyPix.length);
     document.getElementById("jlmyPicture").src = jlmyPix[jlrandomPicNum];
};

window.onload = jlchoosePic;

```