Help Center Tutorial: Add a home icon to your breadcrumb navigation
Publicado 05 may 2017
This tutorial will show you how to add a friendly home icon to your Help Center breadcrumb navigation using only CSS.
Before:
After:
Directions:
All you need to do is add a small snippet of text to your CSS.
- Open Admin Guide > Settings > Customize Design.
- Click the Edit Theme link.
- Open the CSS tab
- We can add our snippet between any element on the CSS page. CSS doesn't care where you place your elements. But for hygiene sake, let's place the snippet near the existing breadcrumb elements. Find the line between the .breadcrumbs li element and the .breadcrumbs li + li::before element. See the example below.
- Paste the following text between in this space.
.breadcrumbs li:first-child a:before {
display: inline-block;
font-family: "entypo";
content: '\2302';
padding-right: 5px;
}
I tested this on the Copenhagen and Swiftest Elk themes. Let me know if you have any issues.
0
13
13 comentarios
Iniciar sesión para dejar un comentario.