Reducing Font Size in Blockquote

• 

  ncsark · Member · Oct 25, 2014 at 12:08 pm

  • Copy link
  • Add topic to favorites

  Hi There,

  I’ve tried blockquote for the first time (love it!) and I’ve read several posts and forums on how to do reduce the font and/or customize other features of blockquote. I’m still just a little unclear on a few steps.

  If I want to customize the blockquote individually per post (as opposed to in CSS), what order do I put the font size specification in the “Text” page? For example, in my most recent post (date October 24), the code is this:

  <p style=”text-align: justify;”> Then my blurb, and ending with

  I read that the default font size is 24px. If I wanted to try and smaller font (say 18), I understand the code to be: font-size: 18px;. My question is: in what order do I put that code as it relates to the above example?

  Thanks in advance for the help.

  The blog I need help with is: (visible only to logged in users)

• 

  alexjgustafson · Member · Oct 25, 2014 at 8:02 pm

  • Copy link

  Hi NcSark,

  This method is referred to inline styling. You’re inserting CSS, but you’re putting it along with the content instead of on every page of the site. So what you need to know is that every style you create in this way in attached to the html element you’re selecting.

  In your example:
  <p style="text-align: justify;"> Then my blurb, and ending with

  This text-align style is connected to the paragraph (‘p’ tag) that you’re editing. [most] HTML tags have both an opening tag and a closing tag. So really your example needs to look like this:

  <p style="text-align: justify;"> Then my blurb, and ending with </p>

  That final p tag ends the paragraph, and its inline style.

  So in your case, you need to open a blockquote tag, attach its inline style, write your text, then close the blockquote tag. Like this:

  <blockquote style="font-size:18px">Write your blockquote text in here.</blockquote>

  Try playing around with font sizes using that code and let me know how it goes. :)

  Best,

  -Alex G.

• 

  ncsark · Member · Oct 27, 2014 at 2:14 pm

  • Copy link

  Hi Alex,

  Thanks so much for the help and info.

  I tried the following format in a draft post in the “Text” tab but did not see any changes in the font size. What am I doing wrong?

  <blockquote>
  <p style="text-align:justify: font-size: 18px;">Blah, blah, blah</p>
  </blockquote>

  Is this why most people seem to customize their blockquotes directly in the CSS page? I guess the route I’m asking about would be more tedious to adjust every time I wanted to use blockquote.

  Thanks again,
  Nicola

• 

  alexjgustafson · Member · Oct 27, 2014 at 4:06 pm

  • Copy link

  Hi Nicola,

  Instead of styling a p tag within a blockquote, try styling the blockquote tag:

  Text editor screenshot
  Preview screenshot

  If you do intend to style every blockquote (past and future) with this change, it would be easier to use the Custom CSS editor once instead of inline styling each time. :) It’s up to your preference, really.

  Best,

  -Alex G.

• 

  ncsark · Member · Oct 29, 2014 at 4:49 pm

  • Copy link

  Okay thanks, Alex. I will give it a go.

  I appreciate your time and help.