sort options with image - Support | Kriesi.at

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts
April 12, 2016 at 12:02 pm #611817

georgesociel
Participant

helo there,

at the link below there is your demo with portfolio ajax.

Portfolio 3 Column Ajax

i would like to the sorting portfolio categories NOT to be just the words, BUT Images also.
So above the portfolio there will be 6 images (example: 100×100), and each one of them will be a sorting option. With same utility and name.

How can i do that?

I suppose that i have to “select” each sorting option, like CSS and make it 100×100 with a specific image as background.

Any help?

April 13, 2016 at 3:57 am #612345
Josue
Inactive Moderator
Hey!

You could use the following custom CSS:
```
#top .inner_sort_button {
    display: none;
}
#top .css_sort_button:before{
    content: url(https://kriesi.at/themes/wp-content/plugins/avia_cachable_style_switch/images/logo-enfold/splash-orange.png);
}

#top .html_sort_button:before{
    content: url(https://kriesi.at/themes/wp-content/plugins/avia_cachable_style_switch/images/logo-enfold/splash-orange.png);
}

#top .psd_sort_button:before{
    content: url(https://kriesi.at/themes/wp-content/plugins/avia_cachable_style_switch/images/logo-enfold/splash-orange.png);
}

#top .video_sort_button:before{
    content: url(https://kriesi.at/themes/wp-content/plugins/avia_cachable_style_switch/images/logo-enfold/splash-orange.png);
}
```
Modify and/or extend as needed.

Cheers!
Josue
April 13, 2016 at 4:29 pm #612905

georgesociel
Participant

This is excellent!

Thank you for your precious help. I want one more thing.
Is it possible to hide/remove the seperator “/” ?
And the 1 million dollar question. Is it possible to have the sorting images on the left side of the portfolio masonry and NOT above?

Regards,

April 13, 2016 at 4:36 pm #612912
Yigit
Keymaster
Hey!

Please add following code to Quick CSS as well
```
.sort_by_cat .text-sep {
    opacity: 0;
}
```
It would be possible but such customization would be out of the scope of our support. Please hire a freelance developer or feel free to request such feature here – https://kriesi.at/support/enfold-feature-requests/

Regards,
Yigit
March 22, 2018 at 6:33 pm #931542
raphaelperis
Participant
Hey,

I’m trying to add some images on my sort option title, I add this ccs code on my (style.css) but when I change the url it’s still the same picture of ENFOLD logo, could you help me please?
```
}
#top .inner_sort_button {
    display: none;

}
#top .identite-visuelle_sort_button:before{
    content: url(https://rpcreativefactory.fr/wp-content/uploads/2018/03/Sort-option-branding.png);

}
#top .illustration_sort_button:before{
    content: url(https://rpcreativefactory.fr/wp-content/uploads/2018/03/Sort-option-ilustration.png);
}

#top .impression_sort_button:before{
    content: url(https://rpcreativefactory.fr/wp-content/uploads/2018/03/Sort-option-print.png);
}

#top .modelisation-3d_sort_button:before{
    content: url(https://rpcreativefactory.fr/wp-content/uploads/2018/03/Sort-option-web-design.png);
}

#top .web-design_sort_button:before{
    content: url(https://rpcreativefactory.fr/wp-content/uploads/2018/03/Sort-option-3D.png);
	
}
```
it’s on the PORTFOLIO section : http://rpcreativefactory.fr

Thank you!
- This reply was modified 6 years, 8 months ago by raphaelperis.
March 22, 2018 at 6:42 pm #931554

raphaelperis
Participant

It’s working now!

March 22, 2018 at 9:29 pm #931659

Basilis
Inactive Moderator

Hi,

Glad we could help!
Please take a moment to review our theme and show your support https://themeforest.net/downloads
To know more about enfold features please check – http://kriesi.at/documentation/enfold/
Thank you for using Enfold :)

Best regards,
Basilis
Author

Posts

Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘sort options with image’ is closed to new replies.