This post may contain affiliate links for more info visit my disclosure page.
I wrote a post 3 months ago about how to add a space between bullet points and because of the recent WordPress 4.7.4 update on April 20, 2017, my method shown in my old post no longer works.
So here, I’m just going to update everyone that you can use this one code for both adding spaces between bullet points and numbered lists!
WORDPRESS CODING FOR ADDING SPACES BETWEEN BULLET POINTS & NUMBERED LISTS
The one magic code is this:
style=”padding-bottom: 18px;”
This is added to the beginning <li> tag of each bullet point or numbered list in the “Text” coding screen of your WP editor like so:
<li style=”padding-bottom: 18px;”>
You can also add other styling to it like justify which I also add to my bullet points and numbered lists:
<li style=”padding-bottom: 18px; text-align: justify;”>
You won’t need to add this coding to the last bullet point or numbered list as it doesn’t need padding but you can just have it justified like this:
<li style=”text-align: justify;”>
In addition the 18px in the code can be changed to whatever number you like your spacing to be at. So if you want larger spacing between your bullet points, you can increase that number above 18px.
Likewise, if you want the spacing between each bullet point or numbered list to be smaller, then decrease that number to below 18px.
EXAMPLE
Let’s take a look at this example of my bullet points and numbered lists:
- bullet one
- bullet two
- bullet three
- item one
- item two
- item three
The coding in the “Text” tab will look like this:
With this kind of coding, you won’t need to worry about future updates and this code should work going forward.
It’s too bad the old way won’t work anymore because it was really convenient for me to just press return, return, delete. 🙂
But at least we have a code that will work no matter what updates in the future!
Hope this helps you much better than my old instructions. You can let me know in the comments below if things aren’t working or if you need more help!
BLOGGING AND NOT MAKING MONEY?
If you’ve been blogging and you haven’t been able to make money yet from your blog, do you have the right training when you started?
It could be a huge reason why you’re not making money with your blog!
I’ve been trained to blog at Wealthy Affiliate and they show you how to write awesome content that converts and also learn how to use and find gold mine keywords that brings in lots of organic search traffic.
I’ve been a member there since Sep 2016 and it’s been an incredible experience, unlike when I tried blogging on my own a few years back and failed miserably!
Don’t let that happen to you and learn how to blog the right way and make money with your blog using affiliate marketing.
You will have everything you need on the Wealthy Affiliate platform to finally succeed in your blogging life!
Read all about their training and what’s available on their platform here:
I can’t wait to see you on the inside! Get started for Free today!
If you have any questions regarding this post or Wealthy Affiliate, please let me know in the comments below and I’ll get back you very quickly! 🙂
Let’s make money online!
Wow! How timely. I was just struggling with this a couple of days ago, and today I find the answer on your blog. Many thanks. 🙂
I’m very happy to hear this Oretta! That’s awesome that my updated post on this topic is of great use to you. 🙂 Hope this will help you for a long time to come!
All the best to you,
Grace
Really irritating that they keep updating things that don’t need to be updated… who has time to mess with code every time they make a list! Thanks for the tip!
Tell me about it Joe! How it was should have remaining working too so not sure why the way I quickly do it doesn’t work anymore with that update. Annoying indeed!
Glad you were able to use my tips here. 🙂
Grace
Set it up exactly like your example and just cannot make it work… I really dislike not having spaces between the numbers. Will google more potential solutions…
UPDATE: I found a video by you on Wealthy Affiliate, dated the day BEFORE this post – with a different instruction… THAT instruction works 🙂 Strange you put up a different instruction the next day that doesn’t work… Thanks, though! I FINALLY got the space in there – after more than an hour of struggling since my work was initially based on the instruction found here, because it was most recent…
I had updated the video at Wealthy Affiliate as well, if you saw my notes underneath the video.
The instructions here are the ones that work and I use them in almost every post which is to add this parameter to the bullet tag => style=”padding-bottom: 18px; text-align: justify;”
So my final tag looks like this:
This works for me every time for bullets and numbered lists.
I’m glad whatever you used it worked!
Thanks for searching out my videos and posts!
Grace
It doesn’t work when you have further indented bullets. Only on bullets that are at the same level. I have a 2nd and 3rd level indent bullet and it does not work on those.
Hi Liz, it does work when you have same indent level. It just doesn’t work for immediate 2nd and 3rd level indented bullets. So if you have several 2nd intent bullets or several third intent bullets, the code will add the spacing for those. It doesn’t work for immediate level indentation it looks like.
Thanks for pointing that out. It’s all a trial and error for me. 🙂
Grace
Hi Grace,
I’m confused by your answer. It doesn’t work, right? Or you’re saying ti does? I have a bulleted list, then I made one bullet 2nd level by using the “increase indent” button right. Then I did that again for the 3rd level. These ones do not have correct spacing, do you know why it doesn’t work? Here’s the code:
Before applying, obtain student copies of each of your college transcripts to assist you in entering coursework in the Transcript Entry section of the application.
To avoid missing important communications from XXX, turn off your e-mail’s spam/junk filters for the duration of the application cycle.
If you can’t do this, add XXX and XXX domain to your allowed e-mail address list.
Also, please check your spam or junk mail folders periodically throughout the cycle, and check the Notifications section of your application frequently.
So it should show as:
– Before applying…
– To avoid…
– If you can’t…
– Also, please…
The spacing is tight (no padding) between level 1 (before) and level 2 (to avoid) and level 3 (if you can’t). Then it looks correct AFTER level 3 (if you can’t) and after the next 2nd level (also, please). Any ideas? Thank you!
What I was trying to say was yes it works for the same indentations one after another. It does NOT work for immediate indentation from 1st level to 2nd level to 3rd level… this doesn’t seem to work.
SO… if you have level 1, level 2 and level 3 one after another, it won’t work. But if you have more level 2’s after the level 3, the code does work.
I don’t know why this is, I’m not an expert at WordPress, I’ve only learned all this through trial and error. I suggest you play around with it, but this is the code that would work if you have several levels of indentation the same one after another. It just doesn’t work when there is different indentation one after another.
Hope this helps! 🙂
This solution doesn’t work.
Hi Michelle,
You must not be pasting the code correctly because I still use this to this day and works fine for me. It must look exactly as I have it in my post above.
Best of luck to you,
Grace
It doesn’t work for me, either. And yes, I copied the code perfectly. My changes essentially don’t “save” no matter what I do.
Oddly, I found this exact same code on another website. When I copy and pasted it from there, it worked fine. Hmm…
That is strange, I wonder what’s wrong with mine? Mine must be adding some extra characters. Some people have told me it doesn’t work for them but this is what I use all the time.
I’m glad you found one that worked, sorry about my code, I’ll have to double check why it’s not working for others.
Thanks for coming by again to let us know!
Grace