I don’t use it often, but decided to use one of the slider smart lists, #3, today. Found two issues with it:
- Paragraphs – This Smart List doesn’t obey paragraph formatting on the front-end. I can enter proper paragraph spacing on the backend for a 3 paragraph slide, but the first one ALWAYS comes out with a single line break instead of a full carriage return (2 line breaks, or default behavior for
<p></p>tags). Could not figure it out. Checked source code in the editor and all was fine.I inspected the output in Chrome and found that my first paragraph was placed before an empty paragraph tag (
<p></p>). The source of the post did not match this. I could not find a way to get that text inside the paragraph tags. See source code from output:
- Images – Images went to the right as expected, but half of them (all set at Medium size, no link, no modal, no additional classes) padded themselves away from the right side, like this one:
I was unable to correct either problem without custom CSS, which makes it a bug. This is with v6.1. I have not upgraded to 6.3 yet, but this is not mentioned in the changelogs as being addressed.
Thanks.
Hi,
1. The empty paragraph is added by wordpress. I’ve tried to replicate your issue on my side but the text ends up in a paragraph on my side. – http://screencast.com/t/jisp8yrA
Please provide more details on the smart list setup, do you use a plugin which may interfere with the post format?
2. There’s a 300px width set for the images, on thinner ones it may leave some blank space. What’s the size of the image used on that section?
Thank you!
1. The only plugin I have on my setup that affects formatting is TinyMCE Advanced, which I just disabled for testing. The results remained the same with and without that plugin activated. See output: http://i.imgur.com/JnN3Nd5.png
As I was testing this I found that the behavior isn’t consistent.
- The first block of text in a smart list item is not in <p> tags
- An empty <p> tag appears after the first block of text
- Subsequent blocks of text after the 2nd one are formatted properly in a <p> tag
- Attempting to manually add additional spacing to separate the first two blocks of text causes the output to act normally (See below screenshots)
Here’s my visual editor entry with normal spacing:
Here’s the front-end smart list output of normal spacing:
If I try to double that spacing, either by pressing enter (carriage return) or shift+enter (line-break), then everything acts normal, which still isn’t the desired result. Here is a sample of the visual editor input demonstrating this:
And here is the output:
Makes no sense to me unless the theme (smart list) is trying to play with the <p> tags and getting it wrong. Haven’t found any way to explain it though.
2. The image in my screenshot is 188×300 at medium. I tried setting it to full size, which exceeds 300px in both directions and that did not help. It happens with other images too. Landscape and portrait images are doing it though that portrait image is showing the most spacing to the right, one of which is 275×183 at full size. Not finding a common denominator there.
It would seem that the image must be of an exact proportion ratio to avoid this problem, but nothing is documented of the sort. That’s a bug in my mind. I say that because it’s obviously inconsistent with respect to orientation and pixel dimensions. Any ideas?
Hi,
1. I have made some tests but unfortunately I could not replicate this on my side. Please send an email at contact@tagdiv.com and provide wp-admin so we take a closer look at this, also paste a link to this conversation.
2. Please try this css solution – http://screencast.com/t/Xa6vd7iAv
.td_smart_list_3 .td-slide-smart-list-figure {
width: auto;
}
Thanks!
Email sent, and will try the CSS later today. Thanks.
Thanks again, Alin.
Just for those reading along here, the problem was user error. I was setting the images inline (left, right alignment) which was causing the issue. Setting the images to no alignment is the trick with smart lists. It just won’t look right in the editor.
