Home › Forums › WoodMart support forum › Typography – Looking for custom selector
Typography – Looking for custom selector
- This topic has 11 replies, 2 voices, and was last updated 2 years, 5 months ago by Elise Noromit.
-
AuthorPosts
-
June 1, 2022 at 8:11 pm #380592
julietteParticipantHello support team,
I am trying to customise some fonts thanks to the theme advanced typography, however I struggle to find the right selectors for some elements. Could you please tell me the name of the selectors I should use to customise the color of the font for:
1/ fields placeholder (eg. placeholder in fields like forms, discount code in cart page, etc.).
2/ links included in text blocks (eg. links in My Account dashboard text, links included in text block
widget, etc.). I tried the Secondary Navigation Links but it did not work.3/ product titles in shop and archive pages. I would like to remove these titles, so I tried the selector .top-information .wd-entities-title with transparent color for both normal and hover colors and 0px for size but the title still appears in yellow and 13px when I hover it. Maybe in this case a custom CSS to remove the titles would be better than custom typography?
Thank you very much for your precious help.
June 2, 2022 at 2:01 am #380654
Elise NoromitMemberHello,
Please provide page URL and screen of every element you want to change, I will provide a selector accordingly.
Best Regards
June 2, 2022 at 12:23 pm #380759
julietteParticipantHello Elise,
You’ll find the URL below with admin panel access as the website is still in maintenance mode.
Also, when I choose the custom selector option, is it possible to put several ones in the same field or should I have a section for each one? If yes how should I do (just written them one next to the other doesn’t seem to work)?
Many thanks!
Attachments:
You must be logged in to view attached files.June 2, 2022 at 12:24 pm #380764June 2, 2022 at 12:26 pm #380769June 2, 2022 at 12:26 pm #380774June 3, 2022 at 10:09 pm #381116
Elise NoromitMemberHello,
Part of the pages are white and I cannot see anything.
These are selectors for the placeholder:
https://gyazo.com/9aac7236b02aff88d4d0de83ea29c3e7
input[type='email'], input[type='date'], input[type='search'], input[type='number'], input[type='text'], input[type='tel'], input[type='url'], input[type='password'], textarea, select
All the titles are provided in the drop-down list: https://gyazo.com/4c35bc1efbaf0d24973242a621e3d9b9
If you wish to set different styles for every selector, you would need to find a developer for such a scope.
If you have any questions please feel free to contact us.
Best Regards
June 29, 2022 at 7:47 pm #387286
julietteParticipantHello Elise,
Thank you for your reply.
1/I tried to use the classes you shared with me for placeholders but I cannot make it work.
For example, for
input[type='search']
, I tried these 2 custom selectors but none of them work: input[type=’search’] , .input[type=’search’].
I also found these selector when I inspect my page “–wd-form-placeholder-color: inherit;”, so it seems that there is a class that regroups all placeholders. However, I also tried custom selectors with this but it didn’t work: –wd-form-placeholder-color, .wd-form-placeholder-color, wd-form-placeholder-color.Could you please guide me on how to use these classes?
2/ I have another question on custom selectors. I would like to use this class that I have found inspecting my archive page : ‘product-element-top wd-quick-shop’. However I don’t achieve to make it work as custom selector. I tried : .product-element-top .wd-quick-shop, .product-element-top wd-quick-shop, “product-element-top wd-quick-shop”.
Can you please tell me how to use a class that has several terms as a custom selector?Thank you
June 30, 2022 at 12:56 am #387317
Elise NoromitMemberHello,
Yes, you would better inspect the element, and take the selector with classes: https://www.hostinger.com/tutorials/website/how-to-inspect-and-change-style-using-google-chrome
If you have any questions please feel free to contact us.
Best Regards
June 30, 2022 at 1:12 am #387321
julietteParticipantHi Elise,
Yes as I told you, inspecting the page is how I found the examples of classes I sent you before.
But this doesn’t help me with the custom selector of Woodmart typography.Can you please tell me how I can make the custom selector work for these two classes: “product-element-top wd-quick-shop” and “input[type=’search’]” ?
I just need your help on these two in order to be able to do the rest on my own.Thank you
June 30, 2022 at 7:46 pm #387590
julietteParticipantHello Elise,
I found my answers. You can close this topic.
Thank you
July 1, 2022 at 1:38 pm #387786
Elise NoromitMemberThat is fine!
If you have any questions please feel free to contact us.
Best Regards
-
AuthorPosts
Tagged: typography; custom selectors
- You must be logged in to create new topics. Login / Register