Jump to content

Is it possible to edit image size within markdown block?

Recommended Posts

Is there a way to edit the size of an image that is embedded within a markdown block?

Currently I'm trying to created a bulleted "to-do" checklist of many items to show which items have been completed and which are still outstanding.

That said, I've successfully added the images to the markdown block by using the reference style code found on the current cheat sheet: https://support.squarespace.com/hc/en-us/articles/206543587-Markdown-cheat-sheet

Reference-style:


![alt text][id]
[id]: /url/to/img.jpg "Title"

However, the images are now significantly way too big for the text. Is there a way to scale down the image size within the markdown block code?

Thanks in advance.

Edited by EDL
Link to comment
  • 9 months later...
  • Replies 10
  • Views 5.2k
  • Created
  • Last Reply

Top Posters In This Topic

Hi,

I added the code below into the markdown box with my image and it resized for me!

<img src="/s/blank.jpg"; img style="height: 20px; width: 20px;">

Change the blank.jpg to your "filename.filetype".

Hope that helps!

Link to comment
  • 1 year later...
10 hours ago, Leah007 said:

@tuanphan Is there a way to use this if there is more than one image within a single markdown block? My site url is https://www.sundaymusecreative.com/workinggg and I'm trying to make the two images in the "brand identity" markdown block different sizes

Thank you!!

Can you take screenshot all syntax in the Markdown?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 2 years later...

Hello @tuanphan – long time fan, first time commenter!

I've been playing around with this for hours and have finally managed to get my images in line with the text as well as scale them to the size I want. Unfortunately the images align with the baseline of the text and I'd like them to align to the centre (see image attached for my figma design that I'm trying to replicate). 

URL: https://plane-opossum-nlpb.squarespace.com/

Password: lotsofsnacks

Can you help?

Screenshot 2023-12-11 at 15.46.17.png

Link to comment

To make text size down, use a style syntax like this (just an example)

<h2 style="font-size:10px;">text text text</h2>

With mobile, add this code to Website Tools (under Not Linked) > Custom CSS

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1702295595800_79033 h2 {
    flex-direction: column;
}
}

image.png.8ed4cea0204eb75b7d0b3d34a41bb44f.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.