# Embedding an iframe in London's theme homepage

**URL:** <https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688>\
**Category:** Themes\
**Created:** [September 1, 2026, 10:24pm UTC](https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688 "2026-09-01T22:24:40Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![icaria36](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/icaria36/32/41399_2.png) [@icaria36](https://forum.ghost.org/u/icaria36)\
**Post date:** [September 1, 2026, 10:24pm UTC](https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688/1 "2026-09-01T22:24:41Z")

</div>

Hi, I bet this is a simple question for the right people…

The [London theme](https://london.ghost.io)’s homepage leaves a big space for one sentence at the top. I want to add an iframe with a music player underneath the sentence since there is enough space for both.

I have the iframe working on the [About](https://electre.selecteh.org/about/) page since it’s easy to insert the HTML there, but I don’t know where to add it for the iframe to appear in that location of the [homepage](https://electre.selecteh.org). Any help is appreciated!

---

<div class="post-metadata">

**Author:** ![Adrian\_Papasergio](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/adrian_papasergio/32/41686_2.png) [@Adrian\_Papasergio](https://forum.ghost.org/u/Adrian_Papasergio)\
**Post date:** [October 2, 2026, 4:23pm UTC](https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688/2 "2026-10-02T16:23:21Z")

</div>

Hi! In London, that sentence on the homepage is your **site description** , rendered inside `<header class="page-head">` in `index.hbs`. The easiest way to put your player right under it — without editing the theme, so it survives theme updates — is Code Injection:

**Settings → Code injection → Site footer:**

```auto
<script>
  (function () {
    var head = document.querySelector('.home-template .page-head');
    if (!head) return;
    var player = document.createElement('div');
    player.className = 'home-player';
    player.innerHTML = 'PASTE YOUR IFRAME CODE HERE';
    head.appendChild(player);
  })();
</script>

```

**Site header** (a bit of spacing and keep it responsive):

```auto
<style>
  .home-player { margin-top: 24px; }
  .home-player iframe { max-width: 100%; }
</style>

```

Paste your iframe between the quotes. If it contains single quotes, swap them for double quotes. It only shows on the homepage, and only when the site description is set — London hides that header when the description is empty.

If you’d rather edit the theme: download it in Settings → Design, add the iframe in `index.hbs` right after `<h2 class="page-head-title">…</h2>`, zip it and upload it again. Just remember a future London update would overwrite that change.

---

<div class="post-metadata">

**Author:** ![icaria36](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/icaria36/32/41399_2.png) [@icaria36](https://forum.ghost.org/u/icaria36)\
**Post date:** [October 4, 2026, 3:31pm UTC](https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688/3 "2026-10-04T15:31:52Z")

</div>

@Adrian_Papasergio Yes, your code solved this. Thank you very much!

---

<div class="post-metadata">

**Author:** ![Adrian\_Papasergio](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.ghost.org/adrian_papasergio/32/41686_2.png) [@Adrian\_Papasergio](https://forum.ghost.org/u/Adrian_Papasergio)\
**Post date:** [October 4, 2026, 3:49pm UTC](https://forum.ghost.org/t/embedding-an-iframe-in-londons-theme-homepage/63688/4 "2026-10-04T15:49:52Z")

</div>

Happy to read that! Good Sunday!