Import Italic version of your font

Hi everyone! So, I have this custom font that comes in Regular and Italic. I want to be able to write stylized paragraphs on the website that look like the attached photo — seamlessly switching between both Regular and Italic. 

Yes, Squarespace will italicize it for me, but the way the website does it isn't nearly as good-looking as the italic font that I purchased.

Is there a way to code my website so that when I'm in the style bar, I can click the 'I' button and it places the corresponding Italic text in there automatically?

Thanks for any advice or tips in advance!!

Yes, this is possible, when setting up your custom font you can add both the regular and italics, reference them both, and assign the italic font to that style, eg:

@font-face {
  font-family:'YOUR_FONT';
  src:'your-source-url-here-font';
}
@font-face {
  font-family:'YOUR_FONT_ITALIC';
  src:'your-source-url-here-italic-font';
}

p {
  font-family:'YOUR_FONT';
}

p i {
  font-family:'YOUR_FONT_ITALIC';
}

If you share some specifics I can give you actual code rather than example.