[Resolved] Right Sidebar showing at bottom of page

[Kenneth Spence]

I have a page which shows the sidebar at the bottom. Here is how the page starts using Shortcodes plugin.

<h3>[su_accordion]</h3>
<h4><span style=”color: #339966;”><span style=”color: #008000;”>[su_spoiler title=”2017″ open=”yes” style=”fancy”]
</span></span>
Jan 08 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span> – <span class=”resolution-style”>Resolution 2017-1</span> Time And Place For Regular Meetings

Dates in between like the Jan 08 above then the following code
</h4>
<h4></h4>
<h4>[/su_spoiler]</h4>
<h4><span style=”color: #339966;”><span style=”color: #008000;”>[su_spoiler title=”2016″ style=”fancy”]

This is all repeated several times for each year.

You can see the results on the website under Minutes-Agendas

[Tom]

I’m seeing the sidebars at each side on that page.

When this does happen, it means you have broken HTML on the page.

For each <span>, make sure a </span> exists. For each <div>, make sure a </div> exists and so on…

[Kenneth Spence]

I will check this out. I did discover that if I disable the Shortcode Plugin it works and that is why you saw it working because I forgot to Activate it again. Must be in the ShortCode Code that is broken. I turned Shortcode back on so you will see the issue if I don’t find the code error before you look.

Thanks

[Kenneth Spence]

Broken HTML doesn’t seem to be the issue. I have gone through code and all seem right. Must be some conflict with ShortCodes Plugin.

This code causes the right sidebar to the bottom and the left not to show at all. Any ideas?

Thanks

<h3>[su_accordion]</h3>
<h4>[su_spoiler title=”2017″ open=”yes” style=”fancy”]

Jan 08 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span> – <span class=”resolution-style”>Resolution 2017-1</span> Time And Place For Regular Meetings
Feb 11 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span> – <span class=”resolution-style”>Resolution 2017-2</span> Repayment Agreement CWRPDA
Mar 08 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
Apr 11 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span> – <span class=”resolution-style”>Resolution 2017-3</span> Time And Place For Regular Meetings – <span class=”resolution-style”>Resolution 2017-4</span> Easements
May 10 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
May 15 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
May 24 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
May 31 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
Jun 14 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
Jun 21 – <span class=”minutes-style”>Minutes</span> – <span class=”agenda-style”>Agenda</span>
Jul 12 – <span class=”agenda-style”>Agenda</span>
Aug 12 – <span class=”agenda-style”>Agenda</span>
Sept 13 – <span class=”agenda-style”>Agenda</span>
[/su_spoiler]
</h4>
[/su_accordion]

[Tom]

It’s really hard to tell by looking at that code.

From a coding perspective, the only way a sidebar would drop would be due to broken HTML.

You can try running your website URL or code through this validator: https://validator.w3.org/

[Kenneth Spence]

Just with this code only in the text area it doesn’t work and when I check the url on validator.w3 it throughs 17 errors that are on line numbers 259 or higher. Don’t know how to see those line numbers. If you want to see these use this url. http://lpwwa.org/?page_id=1698

<h3>[su_accordion]</h3>
<h4>[su_spoiler title=”2017″ open=”yes” style=”fancy”]
TEST
</h4>
[/su_spoiler]
[/su_accordion]

If I don’t use the url and just enter this code it passes when using Validate HTML fragment setting.

I am thinking it must be code in the ShortCode plugin or some incompatibility with your plugin.

Thanks

[Tom]

If the closing </h4> is inside the shortcode, the opening <h4> needs to be inside it as well.

The shortcode outputs HTML, so if the <h4> is above the shortcode, the HTML will break.

[Kenneth Spence]

Thanks,

I also contacted Shortcodes author and this was his response just like yours.

Thanks for the help as this was the problem.

you can not mix opening and closing tags of shortcode with html tags. That’s why your code isn’t working. Try to use html tags inside of the shortcode. For example:
[su_accordion]
[su_spoiler title=”2017″ open=”yes” style=”fancy”]
<h3>TEST</h3>
[/su_spoiler]
[/su_accordion]

[Tom]

Glad you got it working 🙂

[Author]

Posts