I was asked a question recently on the forums which i think you may like about how to add a arrow after a home page section like this:
There’s at least 2 ways you can add the arrow or down triangle as some call it:
- Pure CSS
- CSS & image
1. Pure CSS Down Triangle
Simply add this CSS code to the end of your child theme style sheet and modify the color to match your theme.
Note: Both snippets include a value for the bottom property which you may need to modify depending on which theme and class you use to add the down triangle to. You’ll also need to change class from.div to the div class you want to add your triangle after in your theme.
2. Triangle Image & CSS
And here’s the image you can open using a graphic design editor and change the background color to match your themes styling.
Simply upload the image to your child themes images folder and make sure the path, file name and extension match whats in the CSS code.
I added the css but how do i call it?
Brad more direction please for a newbie like me 🙂
greeting. this tuts was so perfect. it was pretty challenging to even FIND the term ‘down triangle’ for a newbie like me.
for option one, why these:
left: 45%;
margin-left: -21px;
i would have guessed ‘left: 50%’ but not because I know anything, just 50 sounds centered.
many thanks!
Hi Logan
You can use 50% but you also need to take into account the width of the triangle at its widest.
Great tutorial Brad!
Exactly what I was looking for.
Thanks so much for helping us.
No worries Pavle