Sorting and filter display

Hello,
Is there a way to display the Sorting Options / Filter Options like in the screenshot? http://prnt.sc/vgp70n

Attachments:

You must be logged in to view attached files.

Hello,

This sorting should be on the shop/categories page by default, it seems you could delete it.
Please provide your site admin access to the private area. I will check.

Best Regards

Hi,
Thank you for your reply. I dont think you understand corretly what I mean.
I want to display on shop/categories pages the default sorting button/selector, just like in the screenshot I attached in the first email. I dont refer to sorting options (like by popularity, default, new etc).

Ok. I figured it out. I disabled Shop filters from Theme Settings, and the default button for choosing sorting view has been restored.
But, on mobile is replaced with an image. How can I replace that image/button with a text like “Sort by”?
Please check screenshot.

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Mobile:

.shop-loop-head .woocommerce-ordering {
		width: auto;
		height: auto;
	}
	.shop-loop-head .woocommerce-ordering select {
		position: static;
		font-size: 14px;
		border: 1px solid rgba(129, 129, 129, 0.25);
		padding-right: 30px;
		padding-left: 10px;
		background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAHCAYAAAD9NeaIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA+hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NDkxMSwgMjAxMy8xMC8yOS0xMTo0NzoxNiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKE1hY2ludG9zaCkiIHhtcDpDcmVhdGVEYXRlPSIyMDE1LTA0LTE3VDE3OjEyOjQyKzAyOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxNS0wNC0yMFQxNzoxNjoyNCswMjowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxNS0wNC0yMFQxNzoxNjoyNCswMjowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTU4MjBDRURERjVCMTFFNEEzN0FCODBEM0I5MTExMjkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTU4MjBDRUVERjVCMTFFNEEzN0FCODBEM0I5MTExMjkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2RUVFRDJCNkREQzMxMUU0QTM3QUI4MEQzQjkxMTEyOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFNTgyMENFQ0RGNUIxMUU0QTM3QUI4MEQzQjkxMTEyOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuShL/sAAABeSURBVHjaYszOzjZnYGDYCcT8DMSBv0AcP2XKlKVEqmdgAuKTQOwOxB+JtQCIibYAZgkDkRaRZQGyJYQsItsCdEtwWUSRBdgsQbeIYgtAgAWHOMwiJSBezkAhAAgwAJSTG/DI0S9VAAAAAElFTkSuQmCC);
	}
	.shop-loop-head .woocommerce-ordering:after {
		content: none;
	}

Best Regards

I tried to insert the custom css, but after I pasted the code, all screen goes white.
See screenshot after I paste the code in mobile css.

Attachments:

You must be logged in to view attached files.

Hello,

Please replace the code for this one:

	.shop-loop-head .woocommerce-ordering {
		width: auto;
		height: auto;
	}
	.shop-loop-head .woocommerce-ordering select {
		position: static;
		font-size: 14px;
		border: 1px solid rgba(129, 129, 129, 0.25);
		padding-right: 30px;
		padding-left: 10px;
		background-image: false;
	}
	.shop-loop-head .woocommerce-ordering:after {
		content: none;
	}

Best Regards

[Author]

Posts