I’m looking to be able to upload a custom bullet point image (via custom field) to be applied to the list/ul only on that specific post, however I can’t figure out how to apply the css directive within the template php file.
Is there a way to insert that line of styling with the get_field directly into the php file? All the help forums I’ve seen suggest calling stylesheets, but then you’re not pulling the ACF field img url, so I’m lost.
Thanks!
Sara
You would have to use inline styles. You simply need to create a style block.
<style>
/* add styles using acf fields, for example: */
.some-class {
background-image: <?php the_field('my_backgroung_field');
}
</style>
Please note, it is just a quick example
There are different ways to create custom bullet points, either with the list-style-image
CSS property or with a background image or with generated content (CSS pseudo-elements :before
/:after
, and then a background on those).
The best practice would be an internal stylesheet in the document header (similar to what John Huebner suggested), i. e. in header.php, and then add a class to the list (or an ancestor) in question to apply this style to that element.
Another way would be inline-styles on the list items themselves, like:
<li style="background-image: url("<?php the_field('bullet_image'); ?>">item text</li>
But the first method would be preferable as it is more flexible in the end.