How to Break Up a List in Wordpress Without Restarting Sequence
I just wanted to share this because I needed to build a numbered list in Wordpress that was quite long and I needed to break it up with images. However whenever I tried to add a gap the numbering for the next section started back from 1 again.
So I found this which shows how to do it if anyone is interested and wants a long list, and my apologies if there is training or a blog already on this.
Here is a sample list of items as they would appear in the visual editor
1 Item A
2 Item B
3 Item C
In the text editor this will look like
<ol>
<li>Item A</li>
<li>Item B</li>
<li>Item C</li>
</ol>
If I want to break up the list and insert a picture, normally I would have to start re-numbering the list. Instead I can add a space between 2 and 3, go into text editor and change the text as follows.
<ol>
<li>Item A</li>
<li>Item B</li>
</ol>
<ol start="3">
<li>Item C</li>
</ol>
The only piece that I have added is in bold the rest is automatically added for the space.
So there you have it, the only reason I've written this down is because next time I want to to do this I will have forgotten. So now I know there is a blog written on WA specifically on this topic!
Recent Comments
23
Hello,
this tip doesn´t work for me. Can someone add a picture where to add the code in the editor?
Thank you.
A picture can be added anywhere from the editor. Just place your cursor around the area you wish the picture to be; then click on media library, find your picture (or upload a picture from another file, computer, etc), add your alt tag to the picture, bottom section below picture select left, or center, or right, then click insert.
Hello,
just some misunderstanding information from my side.
I just wanted to use the tip presented here and I don´t get it.
I receive:
1.
asdf
1.
2.
instead of
1.
asdf
2.
3.
Here is a test. Hope you can read it.
Thank you.
Code is:
dfsdf
Code should always be added to the Text tab of your WordPress editor and NOT the Visual tab. Hope that helps you.
Yes of course. As seen in the picture. Visual, Text and Preview.
If I know how it works I will do a training.
I just want:
Intoduction:
1.
2.
3.
Main part
1.
text
2.
text
3.
But I only get.
1.
text
1.
text.
1.
text
And in the code there is
text
text
text
and so on.
What can I do?
Good afternoon, Tobias. I am curious why you code " because according to the original code the only place the "start" is entered is when the table is supposed to resume. I could be wrong but this is the mistake I see.
Ken
Thank you.
I tried every case and it doesn´t work for me.
I will stay with the manual version by hand.
Tip:
If the visual editor automatically creates a list, when you type in the numbers, then swith to the text editor and type in the numbers there.
Tobias
Hey Tobias,
These videos may make it easier for you to understand:
https://youtu.be/mojZSNTgGr0
https://youtu.be/cJUVxvsyUSI
Thank you Trish,
I understand it, but it doesn´t work. I read somewhere that it may be an issue of the css-sheet.
It is right in the visual and text editor, but wrong displayed in the preview.
The funny thing is, if I copy the text of the preview into office word, then it is right.
There must be a background suppression.
I will stay with the manual typing. Don´t want to waste more time than necessary and maybe another time there is a solution.
Okay Tobias, NOW I get why it won't work for you. I truly thought you were not understanding the tutorial.
If it IS a matter of the theme itself, than you could contact support (the THEME's support that is, not support here) and ask them for advice. Or ... using your theme's name you could Google search to see it someone else asked that question and was offered a resolve that would work for you.
Example: If you're using TwentyTwelve theme, you would search for "TwentyTwelve theme cannot create bullet lists" (without the quotation marks, of course) ... providing this is the issue you want explained.
Very useful, I already know I shall use it, so thank you.
But you write "The only piece that I have added is in bold the rest is automatically added for the space." I see you added:
i.e., you broke the sequence and then continued it, right? I shall try it for sure, perhaps I misunderstand it now.
Yes I added the gap and the code changed, then I added in bold the start="3".
I assure you if I can do it it must be easy!
See more comments
Thank you much!
Ed