shop order drop down menu

i would like to center it on mobile, is that possible?

Hello @bapestars!

i’m referring to the shop order/orderby drop down menu.
drop down menu img
i want to change the text to this text: “???????? ????”

On your site’s Product filter menu, I already see “Sort by latest, Sort by Popularity” and other options.
You probably got this sorted, Right?
If not then please tell us what are the options you wish to show on that menu?

——————————————

i would like to center it on mobile, is that possible?

You can add the following CSS to your site’s Appearance → Customize → Additional CSS area to center align that filter menu.

@media only screen and (max-width: 667px){
 p.woocommerce-result-count,
 form.woocommerce-ordering{
 float: none !important;
 }
}

Cheers!

@shaonback2 hello friend, thank you for your reply ?
i applied the code to center the dropdown menu, it worked to make it centered on mobile!

also, it’s not that i want to change the options on the sort by list, i just wanted to change the look of it. maybe the color scheme, but mainly just the lettering to go with my theme. such as this: ???????? ????: ???????????? / ???????? ????: ????????????

thank you so much for your reply. i hope you are having a lovely day/night. ?

Hi @bapestars

i applied the code to center the dropdown menu, it worked to make it centered on mobile!

Glad to know that it worked for you.

not that i want to change the options on the sort by list, i just wanted to change the look of it. maybe the color scheme, but mainly just the lettering to go with my theme. such as this: ???????? ????: ???????????? / ???????? ????: ????????????

I understand that you want to change the font. I need to be able to see the page to check whether it can be done with CSS. At the moment the site is in Coming Soon mode. Is it possible to make the page available?

Link to image: https://snipboard.io/CxzySW.jpg

@margaretwporg thank you for your reply. ?

you just have to click off of the pop-up message or press the white button or ESC key to close the message. after closed, my shop products page is the home page.
Sorry for the confusion! If you need me to disable the pop-up I can do it.
thanks in advance ?

Hi there,

Thanks for getting back to us.

You can change the font style of the dropdown by using the following CSS code. You need to replace the font family with the one you would like to apply (I can’t find the font you shared on your website in this thread) :

select.orderby {
    font-family: 'Font Name Here';
}

You can add the above CSS in Apperance > Customize > Additional CSS.

I hope it helps!

Best,

@daniyalahmedk thank you for your reply ?
i didn’t want to call it a font though because i copy and paste that lettering from a text generator. if it is a font, i dont know what it would be called.

the website i use is ?????????? ???????? ??????????????????

???????? ?????? ???????? ??????????????…. but i guess they are not a font they are unicode?

@margaretwporg i disabled the “coming soon” pop up just in case. ?

Hi @bapestars,

i didn’t want to call it a font though because i copy and paste that lettering from a text generator. if it is a font, i dont know what it would be called.

These items are classified as Fonts. The best thing you can do is browse Google Fonts and pick the closest (or matching) one to the one you want, and use the CSS code to change the font to that type.

Hope this helps!

@nixiack8 thank you for your reply ?
i found a font i liked from the link you provided. It’s the one called “Italianno”
….but i’m confused as to how i go about adding a font….

Hey @bapestars,

i found a font i liked from the link you provided. It’s the one called “Italianno”<br>
….but i’m confused as to how i go about adding a font….

In order to set custom fonts from Google Fonts, you can click the “Select this style” next to the font weight on the page. See screenshot -> https://d.pr/i/Ct4rn4

Then you can follow the instructions in the sidebar that shows up to add the <link> to the head of your website, and the CSS to your theme or customizer. See screenshot -> https://d.pr/i/aebwJq

If you’re not sure how to do this, you can reach out to the theme developer for the theme you are using. And if you’re using Storefront, then go ahead and post on the Storefront forums and you’re sure to get the help you need.

Hope this helps!

• This reply was modified 2 years, 4 months ago by KL a11n.

@avantegarde thank you for your help! ? i’m really grateful for you all.
sorry to ask but how could i make the text bold or change the color?

Hi @bapestars,

You’re welcome 🙂

For bold text use the CSS font-weight property:

select.orderby {
    font-family: 'Font Name Here';
    font-weight: bold;
}

Hope this helps!

@rainfallnixfig yay! thank you so much!!!! ?
i hope you have a good day. ?