Skip Navigation

[Résolu] How to change size of List Sorting

This support ticket is created Il y a 7 années. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Aucun de nos assistants n'est disponible aujourd'hui sur le forum Jeu d'outils. Veuillez créer un ticket, et nous nous le traiterons dès notre prochaine connexion. Merci de votre compréhension.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

Ce sujet contient 3 réponses, a 2 voix.

Dernière mise à jour par Minesh Il y a 7 années.

Assisté par: Minesh.

Auteur
Publications
#593109
sorting-list.png

Hi, I use sorting in my Custom Search with style "list". How can I change the width of it? It is too wide for my purposes.

#593248

Minesh
Supporter

Les langues: Anglais (English )

Fuseau horaire: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

Well - you can adjust the field width by adding custom jQuery code to your view's filter section's JS box or by adding custom CSS to your view's filter section's CSS box.

For example:

jQuery(document).ready(function($){

$('.sorting-controls  span.js-wpv-sort-list-orderby-dropdown, span.js-wpv-sort-list-item, span.js-wpv-sort-list-item ').attr('style', 'width: 12.3em !important');


});

More info:
=> https://stackoverflow.com/questions/2655925/how-to-apply-important-using-css

#593350
sorting-list-2.png

Hi Minesh, thank you, it works. But it caused the problem with width of wpv-sort-order. I tried to modified the code, but wasn´t able to make it functional. Just find out that the width of wpv-sort-order shoud be 9em.

#593352

Minesh
Supporter

Les langues: Anglais (English )

Fuseau horaire: Asia/Kolkata (GMT+05:30)

Well - you need to find the right selector and method to avoid the conflict. You should make sure that you need to build your custom JS/CSS that do not cause any issue with other selectors.

However, you must have knowledge of CSS or JS to do such customization.