MRanson

Thanks!

Hi Guido,

I clicked through the edit button (pencil) and in the Display Settings the image was already left aligned. I did not adjust any of the settings.

To recap, because I was late replying to this thread: there are three methods of setting alignment using the visual editor and each one results in a left aligned image that has the text very tightly cramped next to it. The aim is to have a comfortable margin between the text and image.

The image in question is this one:
https://michaelvictorbowman.com/wp-content/uploads/2019/02/left-align-no-text-space.png

Cheers

Ok, now I’m confused!

I see what you’re saying about the CSS class. However, the WordPress editor is showing the image as left aligned.

I’ve just experimented. I right aligned the image. The image moved, the text wrapped on the left, but the CSS class did not change.

I put it back to left align. The CSS class did not change. I selected left align for a second time, and this moved the text below the image, but the CSS class did not change.

Despite the class, the evidence of my eyes is that a left aligned image has wrapped text right up against it, which does not look good.

I remain confused!

Hi guys, thanks for your replies. I’m afraid I didn’t explain myself clearly! Neither of your rules solves the problem.

The problem isn’t with the caption text or the featured image. It’s with other images that are inserted within the body of the post and then are aligned right or left, and thus have a section of text wrapped around them.

If you go to the link and scroll down you’ll see that the third image is left aligned. The post text beside it is touching the edge of the image. This happens to any image inserted into the body of the post text and aligned either left or right (obviously, this is not a problem for centre aligned images).

So, there needs to be a margin between the wrapped text (not caption text) and the edge of an image inserted into the body of the post (not the featured image).

Hope that’s clearer!

Hi Guido,

That worked well, thanks. I’ve used it to modify the other headers and post excerpts as well.

In mobile view there’s still a lot of white space above the site title, h1. The selector for this space is just ‘html’ and it has an important! tag. It’s the presence of that important! tag that makes me hesitate to start messing about with margins in order to make this white space go away.

What does this ‘html’ area do, if anything? Why has it got an important! tag? Can I hide it?

Cheers

Hi Guido,

The 20-25px white space is the gap I was referring to.

When I inspect it, I can see that .header-image has margins of 0 0 20px. Reducing the 20px to 0 closes most of the gap, but an obvious white space of around 5px still remains between the header image and the menu bar, whereas on the desktop view there is no gap.

Can you suggest the best way to “push” the header image down to close this gap? My CSS-fu is not yet strong 😉

Cheers

Hi Guido,

Would it be possible to display social media icons in the primary menu bar, as though they were regular menu items? They currently only appear in a Jetpack widget. I was able to do this in a previous theme (Weaver). It was quite good because the social icons were immediately obvious on desktop views, and they were grouped under the Hamburger in the mobile view (the user didn’t have to scroll down to find the stacked widgets).

This would also be a good feature to include in your new theme as standard.

Cheers

Hi, with reference to the original question, I’d like to remove the text ‘No Comments’ from the metadata using a rule that stops this displaying if there are no comments. If there are comments, I’d still like it to display (i.e. if there is a comment, it will say ‘1 Comment’ as normal). Basically, I don’t want to advertise the fact that there are no comments!

I’ve been experimenting with variations on this basic rule:

if ( comments_open() ) {
if ( $num_comments == 0 ) {
$comments = __(‘No Comments’);
}

…but I can’t get it to work. I keep breaking it. My php Fu is not strong 🙁