# Adding a footer with links to pages

**URL:** <https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819>\
**Category:** Customization\
**Created:** [November 17, 2021, 2:44pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819 "2021-11-17T14:44:52Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![jas](https://discuss.write.as/user_avatar/discuss.write.as/jas/32/3452_2.png) [@jas](https://discuss.write.as/u/jas)\
**Post date:** [November 17, 2021, 2:44pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/1 "2021-11-17T14:44:52Z")

</div>

Hello,

So I’m tweaking my Write.As blog to make it more friendly for new & existing readers.

As such, I’d like to create a bar in the footer (kinda like the bar at the top with pinned posts), which looks like ‘about | start here | popular posts’ or something like that.

I’ve seen @matt sharing [how to insert a ‘back to top’ button](https://discuss.write.as/t/back-to-top-button/85/8), but would someone mind sharing the simplest way for me to add these footer links? (whether that’s CSS/Javascript or code in the ‘Post Signature’)

I’m thinking to have this footer text on my [blog](https://indiewriter.net) either slightly about the ‘published with write.as’ text, or even replacing that text entirely if that’s possible (and if Matt isn’t too offended at that prospect!)…

Thank you! This non-techie is grateful for this community 🙂

---

<div class="post-metadata">

**Author:** ![dino](https://discuss.write.as/user_avatar/discuss.write.as/dino/32/645_2.png) [@dino](https://discuss.write.as/u/dino)\
**Post date:** [November 18, 2021, 3:38pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/2 "2021-11-18T15:38:27Z")

</div>

You can do it by using JavaScript to replace the footer contents. You can see a sample [here](https://journal.dinobansigan.com/).

```css
/* Custom Footer*/
var customFooterHTML = 'Put your custom html in here';
var x = document.querySelector('footer').getElementsByTagName('nav')[0];
x.innerHTML = customFooterHTML;

```

---

<div class="post-metadata">

**Author:** ![jas](https://discuss.write.as/user_avatar/discuss.write.as/jas/32/3452_2.png) [@jas](https://discuss.write.as/u/jas)\
**Post date:** [November 18, 2021, 3:59pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/3 "2021-11-18T15:59:40Z")

</div>

Thank you, Dino, I’ll give this a go.

Coincidentally, I was looking at the write.as [themes](https://write.as/themes/) page earlier… I really like the look of your journal theme.

---

<div class="post-metadata">

**Author:** ![dino](https://discuss.write.as/user_avatar/discuss.write.as/dino/32/645_2.png) [@dino](https://discuss.write.as/u/dino)\
**Post date:** [November 18, 2021, 7:14pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/4 "2021-11-18T19:14:58Z")

</div>

Thank you.

The themes website has an older version of the theme on my website. If you wanted to take a peek at the current one, all you really have to do is go to the homepage on my website, then right click and select “View Page Source”. The custom CSS I use will show up at the end of the `<head>` element in the html.

---

<div class="post-metadata">

**Author:** ![jas](https://discuss.write.as/user_avatar/discuss.write.as/jas/32/3452_2.png) [@jas](https://discuss.write.as/u/jas)\
**Post date:** [November 19, 2021, 11:27am UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/5 "2021-11-19T11:27:17Z")

</div>

Ah, I hadn’t noticed. Thanks Dino, this is handy to know.

---

<div class="post-metadata">

**Author:** ![dino](https://discuss.write.as/user_avatar/discuss.write.as/dino/32/645_2.png) [@dino](https://discuss.write.as/u/dino)\
**Post date:** [November 19, 2021, 2:24pm UTC](https://discuss.write.as/t/adding-a-footer-with-links-to-pages/3819/6 "2021-11-19T14:24:52Z")

</div>

You are welcome.