Using image grid for top posts – big blank in sidebar
-
Hi, I’ve just tried changing the Top Posts widget to display an image grid rather than text links. It looks great, but there is a huge gap between the grid and the rest of the sidebar, and as the blog loads on an infinity scroll, it keeps loading if you try to scroll down to see the rest of the sidebar. I can’t see why the rest of the sidebar doesn’t follow on immediately from the image grid.
The blog I need help with is: (visible only to logged in users)
-
It appears as though this is being caused by some HTML within some of your posts. When I remove the HTML, the sidebar appears normally as shown here:
Are you copying and pasting the content from elsewhere? Can you try removing the miscellaneous HTML tags on the About Words post? You should see the following:
<p class="newword"><b class="headword">PUA</b> <span class="pos">abbreviation</span> <span class="def">pick-up artist; a person, usually a man, who coaches people, usually men, in the art of chatting up women</span></p> <p class="example"><i class="eg">Strauss achieved this by joining a sub-culture of pick-up artists (PUAs), namely men who think of themselves as experts in attracting women. I was rapt. If he could do it, why not me? A couple of months later, disgusted by the manipulative tactics outlined, I threw the book in the bin. If only it had stayed there.</i></p> <span class="source">[http://www.vice.com 25 July 2014]</span>Can you try replacing that with the following?
PUA pick-up artist; a person, usually a man, who coaches people, usually men, in the art of chatting up women Strauss achieved this by joining a sub-culture of pick-up artists (PUAs), namely men who think of themselves as experts in attracting women. I was rapt. If he could do it, why not me? A couple of months later, disgusted by the manipulative tactics outlined, I threw the book in the bin. If only it had stayed there. [http://www.vice.com 25 July 2014]You can use the tools in the Visual Editor to style the wording with bold, italic, etc.
-
Hi, thanks for looking into this. I don’t think that will work because that data is converted automatically before being loaded in, we don’t want to start adding styles manually. Also I think the styling we apply is more than can be added in the editor.
Is there something specific about the HTML that is causing the empty block?
-
I don’t think that will work because that data is converted automatically before being loaded in
Can you let me know how you’re creating the posts? As a test case, I’d like to have you create a post using only the WordPress.com editor without copying and pasting extra styles from elsewhere.
Also I think the styling we apply is more than can be added in the editor.
It looks like you’re applying some styling via CSS classes that you’ve added under Appearance -> Customize -> CSS. As a test to make sure this is the culprit, please post one post to your site without adding the additional styling by copying and pasting from elsewhere. That way, we can narrow down what might be causing this!
-
Hi, I’ve removed all custom HTML from the ‘New words – 23 February’ post, which is the only one with custom HTML in the image grid, but I’m still getting the sidebar pushed down to the bottom.
Normally, this data comes in as XML, is converted automataically to HTML and copied and pasted into posts, and the Polldaddy polls added manually.
-
Thanks for giving that a try! For some reason, the Top Posts and Pages widget is set to have a seemingly undefined height which pushes the other widgets around. We should be able to fix this with the following CSS:
.widgets-grid-layout { height: 350px; }Can you put that under Appearance -> Customize -> CSS?
-
Yes, that’s got it, thank you! I guess it’s safe to set the New Words post back to the custom HTML now?
-
-
- The topic ‘Using image grid for top posts – big blank in sidebar’ is closed to new replies.
WordPress.com Forums 