adding bullets to list of titles

Hello,

Your rules are ok, I am wondering if Font Awesome stylesheet is being loaded before Network Latest Posts stylesheet which is included in footer.

I’ve tested your CSS rules and they work as expected, you may want to check your rules order.

Here is a screenshot of your rules applied to my testing site: https://imgur.com/HvPteFM

Let me know if you need further assistance.

Best regards,
José SAYAGO.

Thank you for the reply.

Finding out when Font Awesome is loaded is a little over my head. I know I have this in my funtions.php file of my child theme:

//* Load Font Awesome
add_action( 'wp_enqueue_scripts', 'add_fonts_cdn' );
function add_fonts_cdn() {
	wp_enqueue_style( 'prefix-font-awesome', '//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css', array(), '4.0.3' );
}

The fonts work in other parts of the site.

Here is a page I am attempting to get the bullets to show in Network Latest Posts plugin (Recent Blog Posts block):
https://www.lifeleap.org/

I added !important; to the css of FA bullets, with no change in results.

Any suggestions on where to go to learn more about the order in which stylesheets are loaded?

Thanks for any guidance.

Hello andrew55,

I have checked your site and found that your CSS rules are not being included. Maybe this is a caching issue, your site is using W3 Total Cache which minifies all CSS styles into a single big file.

Please try this:
– Clear W3 Total Cache
– Clear your browser cache

This in theory should fix the issue. If you need more help, please don’t hesitate to ask.

Kind regards,
José SAYAGO.

José

Here is a test site I created that is not cached and not minified.

https://www.lifeleap.org/test-site/

In the first list, which is a standard list I have set up to display Font Awesome fonts as bullets, the Font Awesome fonts are being loaded from css, and inserted as bullets in the list.

In the second list (the Network Latest Posts list), some of the css mentioned above seems to get loaded (padding, etc), but not the Font Awesome fonts as bullets.

So the Font Awesome bullets work for a standard list on the page, just not for a Network Latest Posts list. My guess is the syntax is incorrect in the css I posted earlier in this topic.

If anyone has a suggestion, that would be great. I would love to have this as a feature and others might like it also.

Also, I’d be happy to share how to load Font Awesome into WordPress if anyone is curious. It’s faster, looks better, and it’s easy to manage than using regular bullets or image bullets.

Hello,

I think this issue is related to the default plugin stylesheet being loaded. I have modified the default stylesheet to include your CSS rules, please download this file: nlp-fontawesome.css.

Then in your shortcode or widget set the “CSS Style” (widget) css_style (shortcode) to nlp-fontawesome, without the file extension (.css).

// Shortcode example
[nlposts css_style=nlp-fontawesome ...other rules here...]

This should do the trick, just in case you are wondering how your rules were included into the default rules, below you will find them:

.nlposts-ulist-container .nav-tabs li:before {
    font-family: FontAwesome;
    content: '\f058';
    color: #6190C3;
    font-size: 30px;
    padding-right: 10px;
    margin-left: -15px;
    position: absolute;
    left: -13px;
    margin-top: 1px;
}
.nlposts-ulist-container .nav-tabs > li {
    float: left;
    list-style-type: none;
	margin-top: 0px;
	margin-bottom: 0;
	position: relative;
	padding-left: 10px;
	padding-bottom: 2px;
}

Please, let me know if this solves your issue.

Screenshot

Thanks for the great support. I was able to get the css working.

I discovered that using @import instead of wp_enqueue_style was causing issues in how the css was loading:

See “Using wp_enqueue_style instead of @import” on this page:
https://codex.www.ads-software.com/Child_Themes

I have the css now in my main stylesheet and the bullets are loading.

You were correct all along. Thanks again for the great support.

I’m glad you solved your issue. If you need anything else, please do not hesitate to ask.

Kind regards,
José SAYAGO.