Bullets

Changing defoult dots in a bulleted list to arrows – how to do it.

Hello,

If you make a bullet list in your WordPress editor and then switch to the “Text” view and add the custom class:
Like this:

<ul class="custom-arrow-list">
 	<li>Consequat a scelerisque suspendisse vel et eget eu vitae adipiscing nibh scelerisque semper cum adipiscing</li>
 	<li>Facilisis adipiscing est accumsan lorem vestibulum. Aliquet mus a aptent ullam corper metus accumsan.</li>
 	<li>Habitasse a purus nec ipsum a urna ac ullamcorper varius metus blandit posuere.</li>
</ul>

Screenshot for clarification:
https://ibb.co/NFXpYVx

Then add the following custom css code in theme settings > custom css > global custom css area:

.custom-arrow-list {
list-style-type: none;
}
.custom-arrow-list li:before {
font-family: "Font Awesome 5 Free";
content: "\2192"; 
   margin-right: 5px; 
}

Then Navigate to Theme Settings > Performance > Fonts and icons > Font Awesome library > Choose always use.

Best Regards.

Hi, it worked partly because the bullets changed like the arrows… but not like that. Please look at the screenshot 🙂 at the top the arrows appeared after pasting. At the bottom there are green ones that I wanted to arrange.

Best regards!

Attachments:

You must be logged in to view attached files.

Hello,

Navigate to products > Edit product with elementor and add the list widget in the description and add the icon and upload the icon and customize it as per your requirements.

See screenshot for clarification:
https://ibb.co/0sk9zGH

Best Regards.

Hello, but the green ones are correct 😉 I want the ones with a description of the change 🙂 The screenshot shows what I would like it to look like 🙂

Attachments:

You must be logged in to view attached files.

Hello,

You can change the unicode for different icons. Try to use this code:
content: “\u003E”

Or you can change the icon color, try to use this code:

.custom-arrow-list li:before {
   font-family: "Font Awesome 5 Free";
   content: "\u003E";
   margin-right: 5px;
   color: red;
}

Best Regards.

no. not working… look on the printscreen.

Attachments:

You must be logged in to view attached files.

Hello,

Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly.

Best Regards.

ok 🙂 information about wp admin in “extra information” 🙂

Hello,

For the short description icon, I have added the woodmart icon via the CSS. Navigate to Theme Settings > Typography > icons fonts.

For the description tab, the CSS is working fine on your site and the description tab is not showing. Check back your site and check the issue.

Best Regards.

For the short description – it’s better. But could it be like in the screenshot?

For the description tab, the CSS is working fine on your site and the description tab is not showing. Check back your site and check the issue. – yest it’s fine! maybe something to do with cash/refreshing that I kept seeing the headline earlier. Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

If you want to make short description icons like the others. You can set the font-weight of the short description icons.

Like this
font-weight: 800;

Best Regards.

[Author]

Posts