Events list shortcode html output problem

Hi Support,

I am adding this shortcode to the text editor:

<ul>[events_list limit="4"]
	<li>#_EVENTIMAGE</li>
[/events_list]
</ul>

after when I “Save” the page and the shortcode become

`<ul>
<ul>[events_list limit=”4″]
<li>#_EVENTIMAGE</li>
</ul>
</ul>
[/events_list]`

Note the extraneous <ul> tags being added. Kindly need you to advise. Thank you.

Best Regards,
Janet

Hi Janet,

Have you tried putting it on a single line? Like this:

<ul>[events_list limit="4"]<li>#_EVENTIMAGE</li>[/events_list]</ul>

Hi,

Yes, I tried to put it on a single line. But same issue encountered
??

Then it’s likely to be a theme issue. Does the same thing happen if you test with the default WordPress theme?

In my experience the WordPress visual editor consistently rewrites shortcodes this way. If you put the shortcode and markup into the text editor and save it, the data will be saved correctly. However, when the visual editor redisplays the markup it will be reformatted incorrectly.

For example, this markup (all on one line):

<div class="events-list-block"><h3>Upcoming Events</h3><ul>[events_list limit="10" location="1"]<li>#_EVENTLINK - #_EVENTDATES at #_EVENTTIMES</li>[/events_list]</ul></div>

Will be reformatted by the visual editor as this:

<div class="events-list-block">
<h3>Upcoming Events</h3>
<ul>
<ul>[events_list limit="10" location="1"]
    <li>#_EVENTLINK - #_EVENTDATES at #_EVENTTIMES</li>
</ul>
</ul>
[/events_list]

</div>

I have resorted to using templates for almost everything because of this problem.

To complicate things, the rendered HTML of these shortcodes is another thing entirely. Even if you have saved the correct markup to the database, the HTML you get on the page is likely to be completely different. Taking the same example,

<div class="events-list-block"><h3>Upcoming Events</h3><ul>[events_list limit="10" location="1"]<li>#_EVENTLINK - #_EVENTDATES at #_EVENTTIMES</li>[/events_list]</ul></div>

The rendered HTML of the resulting page:

<div class="events-list-block">
<h3>Upcoming Events</h3>
<ul>
<li> ( Event 1 details ) </li>
<p>
</p><li> ( Event 2 details ) </li>
<p>
</p></ul>
</div>

Note the extra <p></p> tags which have appeared out of nowhere.

That’s a good point. Have you tried using the Text editor, rather than the Visual editor?

You can use the text editor and it will save the shortcode correctly, but as soon as you switch back to the visual editor (something WordPress often does for you) the content will be reformatted. If you then save the page again without realizing what has happened the shortcode will be broken.

oleonard, sorry but maybe you can start your own thread to avoid confusion with the original poster?

thanks

I’m not trying to hijack the thread for my own issues, I’m just trying to provide more details about an issue which I have struggled with as well.