Skip to content

Instantly share code, notes, and snippets.

@diggeddy

diggeddy/Elementor - Portfolio Filter Bar Hacks

Created December 22, 2017 14:30
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save diggeddy/6fd1c6d7f79f148a41c81684383aefd5 to your computer and use it in GitHub Desktop.
Save diggeddy/6fd1c6d7f79f148a41c81684383aefd5 to your computer and use it in GitHub Desktop.
Download ZIP
Change the All filter title and re-order the filter bar
Raw
Elementor - Portfolio Filter Bar Hacks
/* Elementor Portfolio Filter Bar Hacks */
/* Hack 1 - Change or hide the 'All' filter */
/* Hide the Elements visibility */
.elementor-portfolio__filters li:nth-child(1) {
visibility: hidden;
}
/* Add a different title in place of ALL */
.elementor-portfolio__filters li:nth-child(1):before {
visibility: visible;
content: "ChangeMe";
}
/* Hack 2 - Reverse the menu item order */
.elementor-portfolio__filters {
flex-direction: row-reverse;
}
/* Hack 2.1 Switch items to different order */
/* This example will switch order 1,2,3 to 2,1,3 */
.elementor-portfolio__filters li:nth-child(1) {
order: -2;
}
.elementor-portfolio__filters li:nth-child(2) {
order: -3;
}
.elementor-portfolio__filters li:nth-child(3) {
order: -1;
}
@helenevdb
Copy link

Sorry my mistake! I get it, all good thank you!

How did you do?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment