Hide affiliate links in default Ghost default theme [updated]
How to remove ghost.org affiliate link from Casper theme's footer using CSS's nth-of-type property
Note: Post has been updated to support Ghost 4. See relevant section.
Ghost 3
Ghost comes with default theme called Casper which contains an affiliate link to ghost.org in the footer.
We can easily remove this using CSS's nth-of-type
property. Add following snippet to Code Injection
section of Ghost's Admin panel -
<style>
.site-footer-nav > a:nth-of-type(4) {
display:none;
}
</style>
This is how the footer would look now.
CSS nth-of-type
Overview
nth-of-type()
property is a pseudo-class which matches elements of a given type, based on their position among a group of siblings. It's supported by all browser -
https://caniuse.com/#search=nth-of-type. It is similar to nth-child
but more specific as it only looks for siblings for specific element type.
The interesting part of this property is the different input parameters it takes. It's supports input parameters like
- integer - which basically translates to specific element's position (like how we have used in above example)
odd
oreven
- which can select multiple elements in odd or even positionan+b
- we can compute the formula as followa
- a integer valuen
- a counter (starts at 0)+
or-
- add or subtractb
- an offset value
There is also a :nth-last-of-type
.
Ghost 4
To remove the affiliate link in new version of Ghost, try this
<style>
.outer.site-footer > .inner > div {
display:none;
}
</style>