# Abstract

Modify Homepage Layout of Vuepress so that the Link can be set in the footer.

The steps are as follows:

  1. If you haven't ejected the default theme yet, eject it.
  2. Add footerLink component to the file .vuepress/theme/components/components/Home.vue.
  3. Add footerLink to the README.md.

# If you haven't ejected the default theme yet, eject it.

Eject if the file .vuepress/theme/ doesn't exist. Click here (opens new window) for details.

Use footerLink from frontmatter. Change the file Home.vue as below





 




    <div
      class="footer"
      v-if="data.footer"
    >
      {{ data.footer }}
    </div>
  </main>
</template>




 




    <div
      v-if="data.footer"
      class="footer"
    >
      <a :href='data.footerLink'>{{ data.footer }}</a>
    </div>
  </main>
</template>



 


---
home: true
footer: ©Atelier Ueda
footerLink: https://atelierueda.uedasoft.com/
---

Last Updated: 11/29/2022, 11:18:56 AM