Continuer automatiquement une liste ordonnée dans wordpress

Question

Je veux créer une liste ordonnée, l'interrompre (c'est-à-dire écrire un paragraphe) et reprendre la même liste ordonnée, à partir du numéro où je l'ai laissée. Quelque chose comme ceci :

La liste commence ici :

1. Point 1
2. Point 2

Cette ligne ne fait pas partie de la liste ordonnée.

3. Point 3
4. Point 4
5. Point 5

J'ai essayé de nombreuses méthodes après avoir fait des recherches. L'une d'entre elles que j'ai trouvée intéressante est la suivante :

List starts here:

    <ol class="begin">
        <li>Item 1</li>
        <li>Item 2</li>
    </ol>

    This line is not a part of the ordered list.
    <ol class="continue">
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ol>

Mais cela ne fonctionnera pas pour moi. Voici le résultat que j'obtiens lorsque j'affiche ce code dans wordpress :

Existe-t-il un moyen de continuer une liste ordonnée précédente en html ? Je veux continuer une liste ordonnée automatiquement sans utiliser la balise start="n".

Answer 1

Utilisation <ol start="3"> pour atteindre vos objectifs.

Par exemple,

Le code :

<ol class="begin">
        <li>Item 1</li>
        <li>Item 2</li>
    </ol>

    This line is not a part of the ordered list.
    <ol class="continue" start="3">
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ol>

En direct : Lien de démonstration

J'espère que cela vous aidera.

Editer :

Si vous ne voulez pas coder en dur, vous pouvez procéder comme suit.

Le code :

<ol class="begin">
        <li>Item 1</li>
        <li>Item 2
        <p>
        This line is not a part of the ordered list.
        </p>
        </li>
        <li>Item 3</li>
        <li>Item 4</li>
        <li>Item 5</li>
    </ol>

En direct : Lien de démonstration 2

Juste au cas où, si vous voulez le p pour sortir de l'indentation numérique, il faut alors déclarer un élément de type text-indent avec la valeur d'indentation correspondante.

En direct : Démonstration - 3

De plus, si vous voulez que cela reste dans le DOM et ne se brise pas pour les petits écrans, utilisez le code ci-dessous.

.indent-p {
   margin-left: -40px;
}

En direct : Démonstration - 4