Text next to image

Using Ghost
1

Hey :slight_smile:

is there a way i can have text next to an image? Both on posts and pages like the one from the picture

image
image1186×437 67.6 KB

It’s from this homepage: https://courses.ifcjs.io/

Thanks!
Laurin

2

Yes, but you have to write some code to do it. I have a snippet that does it:

<section>
<figure style="float: right; width: 40%; margin-left: 15px; margin-right: 0;">
<img src="https://forwardky.com/content/images/2021/10/DrBrianClardy-1.jpg"   alt="Dr. Clardy" />
<figcaption style="text-align: center";>Dr. Brian Clardy</figcaption>
    </figure>
<p>Some text here.</p></section>

You upload the image to your Ghost site in a regular image card, save the post, preview, get the image URL, delete the image, then use that URL in the code above as the SRC for the image.

You can swap around the various style settings to float left or right, use more or less space, and so on. Note that if your text in the final graf isn’t long enough to wrap the image, there will be a gap below the text.

Hope this helps.

2 Likes
3

This is awesome! Thank you very much :)