{"id":4491,"date":"2019-12-30T11:20:56","date_gmt":"2019-12-30T19:20:56","guid":{"rendered":"https:\/\/dividude.com\/?p=4491"},"modified":"2020-12-03T16:15:54","modified_gmt":"2020-12-04T00:15:54","slug":"add-custom-pull-quotes-to-divi-aka-blockquotes","status":"publish","type":"post","link":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/","title":{"rendered":"Add Custom Pull-Quotes to Divi (aka Blockquotes)"},"content":{"rendered":"

[et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”4.0.9″ custom_padding=”25px||0px|||” z_index_tablet=”500″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”][et_pb_row padding_mobile=”off” column_padding_mobile=”on” admin_label=”row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”6px|0px|18px|0px”][et_pb_column type=”4_4″ _builder_version=”3.0.47″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_post_title _builder_version=”4.0.9″][\/et_pb_post_title][et_pb_post_title title=”off” admin_label=”Categories” _builder_version=”4.0.9″ meta_text_align=”center” meta_text_color=”#f0ff23″ meta_font_size=”13px” background_color=”#442b00″ width=”30%” module_alignment=”center” custom_margin=”||17px|||” border_radii=”off|4px||4px|” border_width_all=”1px” border_color_all=”#32952d” box_shadow_style=”preset3″ global_module=”3877″ saved_tabs=”all”][\/et_pb_post_title][et_pb_text admin_label=”Author Divi Dude” _builder_version=”4.0.9″ text_font=”||on||||||” text_font_size=”14px” text_orientation=”center” custom_padding=”||0px|||” global_module=”3944″ saved_tabs=”all”]<\/p>\n

By Divi Dude<\/p>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ background_position_1=”top_left” background_position_2=”top_left” background_repeat_1=”no-repeat” background_repeat_2=”no-repeat” _builder_version=”4.0.9″ z_index_tablet=”500″ border_width_bottom=”3px” border_color_bottom=”#ffffff” border_width_bottom_tablet=”3px” border_width_bottom_phone=”3px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”][et_pb_row column_structure=”3_4,1_4″ _builder_version=”4.0.9″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” module_alignment=”center” custom_margin=”|auto||57px||”][et_pb_column type=”3_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Intro” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]I<\/span>recently built a website in Extra for a client who writes a 3-times a week column (or as he calls it \u2013 thrice weekly). [\/et_pb_text][et_pb_text admin_label=”Text: As news articles are…” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]As news articles are wont to do, it needed to have a pull quote for each column (column here meaning article, not the opposite of row). So of course, I designed a number of different looks for him to choose from. I actually patted myself on the back for some of them, because they were way cool (cool being a subjective term, we are talking about pull quotes here on a Divi website). And as clients are wont to do (I\u2019m using that phrase a lot), he picked the most basic of the choices.[\/et_pb_text][et_pb_text admin_label=”Text: Well, not all of you …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Well, not all of you want the basic pull quote, so I decided to put my thinking cap back on and come up with some pull quote ideas for you all (or as my Southern friends are wont to say \u2013 y\u2019all).[\/et_pb_text][et_pb_text admin_label=”Text: You may know pull-quotes …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

You may know pull-quotes as the newspaper term \u201cCut-Quote,\u201d or as they\u2019re called in WordPress\u2019s Guttenberg \u201cBlockquote\u201d or the client term \u201cReally Big Quote Thingy.\u201d They\u2019re all the same thing.<\/p>\n

[\/et_pb_text][et_pb_text admin_label=”Text: There are several ways we …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

There are several ways we can go about designing pull-quotes. We can use the Blockquote button in the MCE that comes with WordPress\u2019s Guttenberg text box; or we can use Divi\u2019s Visual Builder to design the pull-quotes using modules such as Text or Blurb; or we can use the Quote Shortcode that comes with Divi. I don\u2019t find that one too useful, so I\u2019m going to skip that one.<\/p>\n

[\/et_pb_text][et_pb_text admin_label=”Text: There are several ways we …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

If you scroll near the bottom of the page (at the very bottom of this write-up, there is a YouTube video in case you’d rather watch that.<\/p>\n

[\/et_pb_text][et_pb_text admin_label=”Text: Using Blockquote Button in WordPress …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Using Blockquote Button in WordPress<\/h2>\n

Let\u2019s get started with WordPress\u2019s Blockquote button. Here\u2019s a picture of what it looks like straight out of the box:<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_1.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: When we inspect the unaltered …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]When we inspect the unaltered CSS, we get this:[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggMCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDVweCBzb2xpZDsKfQo=” style=”far” _builder_version=”4.0.9″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggMCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDVweCBzb2xpZDsKfQo=[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: Let\u2019s customize it and …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Let\u2019s customize it and see what other fun things we can do with the pull-quote.[\/et_pb_text][et_pb_text admin_label=”Text: We’ll start with the basics …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

We’ll start with the basics and give the border a color of red and make it a bit thicker. Also, we\u2019ll want to adjust the margins to move it further and add a bit of padding so it\u2019s not so close to the left border. This is what we end up with:<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_2.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: And here\u2019s the code we used: …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]And here\u2019s the code we used:[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwp9″ style=”far” _builder_version=”4.0.9″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwp9[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: In the code above we changed …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]In the code above we changed the left and right margins to 50px. We also adding a bit more padding and changed the border-left from 5px to 8px and finally added a red color to the border.[\/et_pb_text][et_pb_text admin_label=”Text: I like my pull-quotes to be …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]I like my pull-quotes to be larger than my regular text. But when we try and add a font-size to the above CSS, nothing happens. We\u2019ll need to target the paragraph defaults within the Blockquote CSS. To do this we have to add a new class to our custom CSS.[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSBwIHsJCn0=” style=”far” _builder_version=”4.0.9″ box_shadow_style=”preset3″]YmxvY2txdW90ZSBwIHsJCn0=[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: Now it\u2019s time to style it. …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Now it\u2019s time to style it. I\u2019m going to make the text larger, give it a different color, adjust the line-height and italicize it. I end up with:[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwp9CmJsb2NrcXVvdGUgcCB7CQogICAgZm9udC1zaXplOiA0NXB4ICFpbXBvcnRhbnQ7CiAgICBsaW5lLWhlaWdodDogMS41OwogICAgY29sb3I6ICM5OTkgIWltcG9ydGFudDsKICAgIGZvbnQtc3R5bGU6IGl0YWxpYyAhaW1wb3J0YW50Owp9″ style=”far” _builder_version=”4.0.9″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZy1sZWZ0OiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwp9CmJsb2NrcXVvdGUgcCB7CQogICAgZm9udC1zaXplOiA0NXB4ICFpbXBvcnRhbnQ7CiAgICBsaW5lLWhlaWdodDogMS41OwogICAgY29sb3I6ICM5OTkgIWltcG9ydGFudDsKICAgIGZvbnQtc3R5bGU6IGl0YWxpYyAhaW1wb3J0YW50Owp9[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: Notice I used \u201c!important\u201d …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Notice I used \u201c!important\u201d after most of these changes. I do this so Divi knows this setting is more important than the default settings, or else, it may just revert to the default. You can try it without it, but in my doing this tutorial I found I had to use it.[\/et_pb_text][et_pb_text admin_label=”Text: Here\u2019s what we\u2019ve done so far …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Here\u2019s what we\u2019ve done so far.[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_3.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: In our case above we …” _builder_version=”4.0.9″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

In our case above we have one border. What if we wanted to add two borders? Then we\u2019d simply copy and paste the border code and change it to border-right, so we have both a left and right.<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_4.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHg7CiAgICBib3JkZXItbGVmdDogOHB4IHNvbGlkICNmZjAwMDA7CiAgICBib3JkZXItcmlnaHQ6IDhweCBzb2xpZCAjZmYwMDAwO30KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzk5OSAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7Cgl0ZXh0LWFsaWduOiBjZW50ZXI7Cn0=” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHg7CiAgICBib3JkZXItbGVmdDogOHB4IHNvbGlkICNmZjAwMDA7CiAgICBib3JkZXItcmlnaHQ6IDhweCBzb2xpZCAjZmYwMDAwO30KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzk5OSAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7Cgl0ZXh0LWFsaWduOiBjZW50ZXI7Cn0=[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

If you prefer to have the pull-quote borders on the top and bottom, then simply change the border-right and border-left to border-top and border-bottom. Make sure to include border-left: none;<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_5.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHg7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IG5vbmU7CiAgICBib3JkZXItdG9wOiA4cHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1ib3R0b206IDhweCBzb2xpZCAjZmYwMDAwO30KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzk5OSAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7Cn0=” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHg7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyLWxlZnQ6IG5vbmU7CiAgICBib3JkZXItdG9wOiA4cHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1ib3R0b206IDhweCBzb2xpZCAjZmYwMDAwO30KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzk5OSAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7Cn0=[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Title: Pull Quote with Curved Left and Right Borders” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Pull Quote with Curved Left and Right Borders<\/h2>\n

Let\u2019s get back to the right and left borders.<\/p>\n

One of the things I really like to do is to take my straight line and make it curve. To do this, we simply add a border-radius, like this:<\/p>\n

[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CgltYXJnaW46IDIwcHg7CglwYWRkaW5nOiAyMHB4OwoJYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwoJYm9yZGVyLXJpZ2h0OiA4cHggc29saWQgI2ZmMDAwMDsKCWJvcmRlci1yYWRpdXM6IDI1cHg7Cn0KYmxvY2txdW90ZSBwIHsJCglmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKCWxpbmUtaGVpZ2h0OiAxLjU7Cgljb2xvcjogIzk5OSAhaW1wb3J0YW50OwogIAlmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKCXRleHQtYWxpZ246IGNlbnRlcjsKfQ==” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CgltYXJnaW46IDIwcHg7CglwYWRkaW5nOiAyMHB4OwoJYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwoJYm9yZGVyLXJpZ2h0OiA4cHggc29saWQgI2ZmMDAwMDsKCWJvcmRlci1yYWRpdXM6IDI1cHg7Cn0KYmxvY2txdW90ZSBwIHsJCglmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKCWxpbmUtaGVpZ2h0OiAxLjU7Cgljb2xvcjogIzk5OSAhaW1wb3J0YW50OwogIAlmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKCXRleHQtYWxpZ246IGNlbnRlcjsKfQ==[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: And here\u2019s what we end up with.” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]And here\u2019s what we end up with.[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_6.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: Again, you can play around …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Again, you can play around with only using one border or top \/ bottom borders.<\/p>\n

Create a Funky Shaped Border for Pull-Quote<\/h2>\n

You want to start getting some pretty unique shapes, try changing the border radius from pixels to a percentage. Here\u2019s what happens when we change the border-radius from 25px to 10%.<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_7.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CgltYXJnaW46IDIwcHggNTBweCAzMHB4OwoJcGFkZGluZzogMTVweCA2MHB4OwoJYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwoJYm9yZGVyLXJhZGl1czogMTAlOwp9CmJsb2NrcXVvdGUgcCB7CQoJZm9udC1zaXplOiA0NXB4ICFpbXBvcnRhbnQ7CglsaW5lLWhlaWdodDogMS41OwoJY29sb3I6ICM5OTkgIWltcG9ydGFudDsKCWZvbnQtc3R5bGU6IGl0YWxpYyAhaW1wb3J0YW50Owp9Cg==” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CgltYXJnaW46IDIwcHggNTBweCAzMHB4OwoJcGFkZGluZzogMTVweCA2MHB4OwoJYm9yZGVyLWxlZnQ6IDhweCBzb2xpZCAjZmYwMDAwOwoJYm9yZGVyLXJhZGl1czogMTAlOwp9CmJsb2NrcXVvdGUgcCB7CQoJZm9udC1zaXplOiA0NXB4ICFpbXBvcnRhbnQ7CglsaW5lLWhlaWdodDogMS41OwoJY29sb3I6ICM5OTkgIWltcG9ydGFudDsKCWZvbnQtc3R5bGU6IGl0YWxpYyAhaW1wb3J0YW50Owp9Cg==[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Put a Pull-Quote in a Box<\/h2>\n

One of the things I really like to do is set my pull-quote apart from the rest of the text by encasing it in a box and adding a solid drop-shadow behind it. So here, we\u2019re going to add borders all the way around the quote. Notice how we removed the left or right designation, and just use the word \u201cborder?\u201d When there is only one size option, then borders are drawn all the way around. To add the drop shadow, we add a box-shadow element to our CSS. (see this tutorial for how to create box shadows<\/a>). Play around with these numbers to get the look you like (the first 3 numbers have to do with the X and Y radius, and the feathering. The numbers in the parenthesis are the rgba values (the \u201ca\u201d being the opacity)).<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_8.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]Here\u2019s what the CSS looks like for the above sample.[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZzogMTVweCA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJveC1zaGFkb3c6IDE1cHggMTVweCAwcHggcmdiYSgxMjUsMTI1LDEyNSwxKTsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogNDVweCAhaW1wb3J0YW50OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjOTk5ICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9″ style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZzogMTVweCA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJveC1zaGFkb3c6IDE1cHggMTVweCAwcHggcmdiYSgxMjUsMTI1LDEyNSwxKTsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogNDVweCAhaW1wb3J0YW50OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjOTk5ICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Adding a Colored Background to Pull-Quote<\/h2>\n

All these examples used the color of the background from your post. What if you wanted to change the color? Well, that\u2019s simple, just add a background element.<\/p>\n

Here\u2019s an example of a basic pull-quote with a reddish-grey background.<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_9.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

\u00a0A couple of things to note in the code below. We added a border:none because the original code that comes with Divi has a border in it (and we need to remove it). We also changed the color of the font, just to show it can be any color you want.<\/p>\n

[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZzogMTVweCA2MHB4OwogICAgYmFja2dyb3VuZDogI2YwY2VjOTsKICAgIGJvcmRlcjogbm9uZTsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogNDVweCAhaW1wb3J0YW50OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjOTE0NDM2ICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9″ style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBtYXJnaW46IDIwcHggNTBweCAzMHB4OwogICAgcGFkZGluZzogMTVweCA2MHB4OwogICAgYmFja2dyb3VuZDogI2YwY2VjOTsKICAgIGJvcmRlcjogbm9uZTsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogNDVweCAhaW1wb3J0YW50OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjOTE0NDM2ICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]You can add background color to any of the above pull-quotes as well.[\/et_pb_text][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Creating an Oval Pull-Quote<\/h2>\n

Remember how above we added curvatures to the border lines on left and right?\u00a0 What if we wanted our quote to appear in an oval shaped border?\u00a0 Simply add a border all the way around your pull-quote and then change the border radius to 25% or 50% (or play with these values to get something you like).<\/p>\n

[\/et_pb_text][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/blockQuote_10.jpg” show_in_lightbox=”on” align=”center” admin_label=”Image – Before” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”2px” box_shadow_style=”preset3″ box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px”]
\n[\/et_pb_image][et_pb_text admin_label=”Text: If you prefer to have the pull-quote …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

And here’s the code used:<\/p>\n

[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfQ==” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfQ==[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: Don’t Forget the Media Query …” _builder_version=”4.0.11″ z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Don’t Forget the Media Query<\/h2>\n

One thing I forget a lot is to discuss the changes for mobile and tablet. To do this, you have to add a Media Query. And since seemingly every phone and every tablet has its own size, thus making getting the Media Query just right is difficult. You can do as many as you feel is necessary, but for the purpose of this tutorial I will be including media queries for some of the screen break points Divi uses.<\/p>\n

I will use the Oval shaped pull-quote we just did.\u00a0 We will use the same Blockquote Blockquote P classes we just used, but this time insert them inside a Media Query.\u00a0 We will make one for a screen sized between 768px and 980px (i.e. Tablet), one for screens 480px and 768px (i.e. Cell in turned Landscape), and then one for screens 479px and smaller (i,e, Cell turned Portrait).<\/p>\n

We use @media screen and tell minimum and maximun width of the screens we want the CSS to apply to .\u00a0 Then I simply copy the CSS code and insert it between {} and then changes to the variables that I need to.\u00a0 Usually, this will be font-size, padding and margins. \u00a0<\/p>\n

In my example below I added a\u00a0 margin to the Blockquote p class as it needed it.\u00a0 But play around with your own settings to get what you like.<\/p>\n

[\/et_pb_text][et_pb_dmb_code_snippet code=”YmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfQpAbWVkaWEgc2NyZWVuIGFuZCAoIG1pbi13aWR0aDogNzY5cHggKSBhbmQgKCBtYXgtd2lkdGg6IDk4MHB4ICkgewpibG9ja3F1b3RlIHsKICAgIHBhZGRpbmc6IDEwcHg7CiAgICBib3JkZXI6IDJweCBzb2xpZCAjZmYwMDAwOwogICAgYm9yZGVyLXJhZGl1czogNTAlOwogICAgYmFja2dyb3VuZDogI2NjYzsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogMzBweCAhaW1wb3J0YW50OwogICAgbWFyZ2luOiAxNXB4OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjMDAwICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9fQpAbWVkaWEgc2NyZWVuIGFuZCAoIG1pbi13aWR0aDogNDgwcHggKSBhbmQgKG1heC13aWR0aDogNzY4cHgpIHsKYmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyOiAycHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDI1cHggIWltcG9ydGFudDsKICAgIG1hcmdpbjogMTVweDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfX0KQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNDc5cHgpIHsKYmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyOiAycHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDI1cHggIWltcG9ydGFudDsKICAgIG1hcmdpbjogMTBweDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfX0=” style=”far” _builder_version=”4.0.11″ box_shadow_style=”preset3″]YmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiA2MHB4OwogICAgYm9yZGVyOiAzcHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDQ1cHggIWltcG9ydGFudDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfQpAbWVkaWEgc2NyZWVuIGFuZCAoIG1pbi13aWR0aDogNzY5cHggKSBhbmQgKCBtYXgtd2lkdGg6IDk4MHB4ICkgewpibG9ja3F1b3RlIHsKICAgIHBhZGRpbmc6IDEwcHg7CiAgICBib3JkZXI6IDJweCBzb2xpZCAjZmYwMDAwOwogICAgYm9yZGVyLXJhZGl1czogNTAlOwogICAgYmFja2dyb3VuZDogI2NjYzsKfQpibG9ja3F1b3RlIHAgewkKICAgIGZvbnQtc2l6ZTogMzBweCAhaW1wb3J0YW50OwogICAgbWFyZ2luOiAxNXB4OwogICAgbGluZS1oZWlnaHQ6IDEuNTsKICAgIGNvbG9yOiAjMDAwICFpbXBvcnRhbnQ7CiAgICBmb250LXN0eWxlOiBpdGFsaWMgIWltcG9ydGFudDsKICAgIHRleHQtYWxpZ246IGNlbnRlciAhaW1wb3J0YW50Owp9fQpAbWVkaWEgc2NyZWVuIGFuZCAoIG1pbi13aWR0aDogNDgwcHggKSBhbmQgKG1heC13aWR0aDogNzY4cHgpIHsKYmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyOiAycHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDI1cHggIWltcG9ydGFudDsKICAgIG1hcmdpbjogMTVweDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfX0KQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogNDc5cHgpIHsKYmxvY2txdW90ZSB7CiAgICBwYWRkaW5nOiAyMHB4OwogICAgYm9yZGVyOiAycHggc29saWQgI2ZmMDAwMDsKICAgIGJvcmRlci1yYWRpdXM6IDUwJTsKICAgIGJhY2tncm91bmQ6ICNjY2M7Cn0KYmxvY2txdW90ZSBwIHsJCiAgICBmb250LXNpemU6IDI1cHggIWltcG9ydGFudDsKICAgIG1hcmdpbjogMTBweDsKICAgIGxpbmUtaGVpZ2h0OiAxLjU7CiAgICBjb2xvcjogIzAwMCAhaW1wb3J0YW50OwogICAgZm9udC1zdHlsZTogaXRhbGljICFpbXBvcnRhbnQ7CiAgICB0ZXh0LWFsaWduOiBjZW50ZXIgIWltcG9ydGFudDsKfX0=[\/et_pb_dmb_code_snippet][et_pb_text admin_label=”Text: Wrapping Up This Tutorial …” _builder_version=”4.0.11″ custom_padding=”2px|||||” z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Wrapping Up This Tutorial<\/h2>\n

So that’s a lot of different ways you can stylize the pull-quote using the blockquote CSS that comes with WordPress.<\/p>\n

If you’re like me, you often times use Divi’s modules instead of Guttenberg.\u00a0 If that’s the case, and you see a style you like, use the Blurb module (my favorite to use) and then just stylize that module to act like a blockquote. I show an example of this in the YouTube video using the Text Module.<\/p>\n

[\/et_pb_text][et_pb_text admin_label=”Text: Wrapping Up This Tutorial …” _builder_version=”4.0.11″ custom_padding=”2px|||||” z_index_tablet=”500″ text_text_shadow_horizontal_length_tablet=”0px” text_text_shadow_vertical_length_tablet=”0px” text_text_shadow_blur_strength_tablet=”1px” link_text_shadow_horizontal_length_tablet=”0px” link_text_shadow_vertical_length_tablet=”0px” link_text_shadow_blur_strength_tablet=”1px” ul_text_shadow_horizontal_length_tablet=”0px” ul_text_shadow_vertical_length_tablet=”0px” ul_text_shadow_blur_strength_tablet=”1px” ol_text_shadow_horizontal_length_tablet=”0px” ol_text_shadow_vertical_length_tablet=”0px” ol_text_shadow_blur_strength_tablet=”1px” quote_text_shadow_horizontal_length_tablet=”0px” quote_text_shadow_vertical_length_tablet=”0px” quote_text_shadow_blur_strength_tablet=”1px” header_text_shadow_horizontal_length_tablet=”0px” header_text_shadow_vertical_length_tablet=”0px” header_text_shadow_blur_strength_tablet=”1px” header_2_text_shadow_horizontal_length_tablet=”0px” header_2_text_shadow_vertical_length_tablet=”0px” header_2_text_shadow_blur_strength_tablet=”1px” header_3_text_shadow_horizontal_length_tablet=”0px” header_3_text_shadow_vertical_length_tablet=”0px” header_3_text_shadow_blur_strength_tablet=”1px” header_4_text_shadow_horizontal_length_tablet=”0px” header_4_text_shadow_vertical_length_tablet=”0px” header_4_text_shadow_blur_strength_tablet=”1px” header_5_text_shadow_horizontal_length_tablet=”0px” header_5_text_shadow_vertical_length_tablet=”0px” header_5_text_shadow_blur_strength_tablet=”1px” header_6_text_shadow_horizontal_length_tablet=”0px” header_6_text_shadow_vertical_length_tablet=”0px” header_6_text_shadow_blur_strength_tablet=”1px” box_shadow_horizontal_tablet=”0px” box_shadow_vertical_tablet=”0px” box_shadow_blur_tablet=”40px” box_shadow_spread_tablet=”0px” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

See the Pull Quote Tutorial on YouTube<\/h2>\n

I created a video on YouTube going over everything I have written here.\u00a0 so if you prefer to watch the video instead of reading the text, then here it is.<\/p>\n

[\/et_pb_text][et_pb_video src=”https:\/\/youtu.be\/b2oC1_Ql2bg” _builder_version=”4.0.11″ border_width_all=”1px” box_shadow_style=”preset3″][\/et_pb_video][\/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_code admin_label=”Title: Please Pin Me ” module_class=”pinTitleSidebar” _builder_version=”4.0.11″ text_orientation=”center” custom_margin=”||8px|||” z_index_tablet=”500″ saved_tabs=”all”]<\/p>\n

Please Pin Me 🙂<\/h3>\n

<\/a>[\/et_pb_code][et_pb_image src=”https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/Pinterest_Titles_Add_Custom_Pull_Quotes_To_Divi.jpg” alt=”Code Snippet Highlighter that Works with Divi” url=”https:\/\/www.pinterest.com\/pin\/create\/button\/?url=https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/&media=https:\/\/dividude.com\/wp-content\/uploads\/2020\/01\/Pinterest_Titles_Add_Custom_Pull_Quotes_To_Divi.jpg” align=”center” disabled_on=”off|off|off” _builder_version=”4.0.11″ z_index_tablet=”500″ border_width_all=”1px” box_shadow_style=”preset3″]
\n[\/et_pb_image][et_pb_sidebar area=”sidebar-1″ _builder_version=”4.0.11″ header_font_size=”18px” body_line_height=”1.4em” remove_border=”off”]<\/p>\n

 <\/p>\n

[\/et_pb_sidebar][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|desktop” disabled_on=”on|on|on” admin_label=”section” _builder_version=”4.4.0″ background_color=”#32952d” custom_padding=”0px|0px|0px|0px” custom_padding_tablet=”0px||0px|” custom_padding_phone=”” transparent_background=”off” padding_mobile=”off” global_module=”4086″][et_pb_row padding_mobile=”off” column_padding_mobile=”on” admin_label=”row” _builder_version=”4.0.9″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_margin_tablet=”0px||0px|” custom_margin_phone=”0px||0px|” custom_padding=”0px|0px|0px|0px” custom_padding_tablet=”0px||0px|” custom_padding_phone=”0px||0px|”][et_pb_column type=”4_4″ _builder_version=”3.0.47″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Affiliate disclaimer – Brown” module_class=”brownLink” _builder_version=”4.0.9″ text_font_size=”12″ text_orientation=”center” background_layout=”dark” module_alignment=”center” text_font_size_tablet=”13px” text_font_size_phone=”10px” text_line_height_tablet=”1.6em” text_line_height_phone=”1.5em” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]<\/p>\n

Affiliate marketer:<\/a>\u00a0Which means when you click a link and purchase an item, I may receive a commission.<\/p>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ custom_padding_last_edited=”on|desktop” disabled_on=”off|off|off” admin_label=”More From Divi Dude – Blogs” _builder_version=”4.4.8″ use_background_color_gradient=”on” background_color_gradient_start=”#f9ffce” background_color_gradient_end=”#f0ff23″ background_color_gradient_type=”radial” custom_margin=”0px||||false|false” custom_padding=”0px|0px|18px|0px|false|false” custom_padding_tablet=”50px|0|50px|0″ custom_padding_phone=”” top_divider_height=”44px” top_divider_flip=”vertical” border_color_top=”#32952d” box_shadow_style=”preset7″ box_shadow_horizontal=”0px” box_shadow_vertical=”-2px” box_shadow_blur=”6px” box_shadow_position=”outer” global_module=”4017″ saved_tabs=”all”][et_pb_row use_custom_gutter=”on” gutter_width=”1″ column_padding_mobile=”on” admin_label=”row” _builder_version=”4.0.9″ background_color=”#442b00″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” width=”100%” max_width=”2560px” module_alignment=”center” custom_margin=”0px||||false|false” custom_padding=”0px|0px|0px|0px|false|false” custom_padding_tablet=”32px|0px|0px|0px”][et_pb_column type=”4_4″ _builder_version=”3.0.47″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Headline: Featured Divi Dude Tutorials” _builder_version=”4.0.9″ header_font_size=”54px” header_2_text_color=”#ffffff” header_2_font_size=”40px” text_orientation=”center” background_layout=”dark” module_alignment=”center” custom_margin=”||0px||false|false” custom_padding=”5px||0px||false|false” header_font_size_tablet=”46px” header_font_size_phone=”40px” header_text_shadow_style=”preset5″ header_text_shadow_color=”#fe8727″ header_2_text_shadow_style=”preset5″ header_2_text_shadow_horizontal_length=”0.02em” header_2_text_shadow_vertical_length=”0.03em” header_2_text_shadow_color=”#000000″ inline_fonts=”Droid Sans”]<\/p>\n

More From Divi Dude<\/strong><\/h2>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”1_3,1_3,1_3″ module_class=”blogGridHeight ” _builder_version=”4.7.2″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_margin=”||20px|” custom_padding=”27px|0px|0px|0px”][et_pb_column type=”1_3″ _builder_version=”3.0.47″ background_position=”top_left” custom_padding=”|||” custom_padding__hover=”|||”][et_pb_blog fullwidth=”off” posts_number=”1″ include_categories=”current” use_manual_excerpt=”off” show_author=”off” show_date=”off” show_categories=”off” show_excerpt=”off” show_pagination=”off” _builder_version=”4.0.9″ header_font=”|on|||” header_text_align=”center” header_text_color=”#32952d” header_font_size=”20px” header_line_height=”1.1em” body_font_size=”16px” body_line_height=”1.8em” custom_margin=”22px|||||” custom_css_featured_image=”border: 1px solid #000;” custom_css_read_more=”padding-top:15px;||text-align: center;” border_radii=”on|10px|10px|10px|10px” border_width_all=”2px” border_color_all=”#32952d” border_style_all=”solid” border_width_all_fullwidth=”1px” border_color_all_fullwidth=”#000000″ border_style_all_fullwidth=”solid” border_radii_image=”off|10px|10px||” border_width_all_image=”2px” border_color_all_image=”#32952d” box_shadow_style=”preset3″ box_shadow_color=”rgba(0,0,0,0.1)” use_border_color=”on” border_color=”#000000″ use_dropshadow=”on”][\/et_pb_blog][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ background_position=”top_left” custom_padding=”|||” custom_padding__hover=”|||”][et_pb_blog fullwidth=”off” posts_number=”1″ include_categories=”29″ use_manual_excerpt=”off” show_author=”off” show_date=”off” show_categories=”off” show_excerpt=”off” show_pagination=”off” offset_number=”1″ _builder_version=”4.5.1″ header_font=”|on|||” header_text_align=”center” header_text_color=”#32952d” header_font_size=”20px” header_line_height=”1.1em” body_font_size=”16px” body_line_height=”1.8em” custom_margin=”22px|||||” custom_css_featured_image=”border: 1px solid #000;” custom_css_read_more=”padding-top:15px;||text-align: center;” border_radii=”on|10px|10px|10px|10px” border_width_all=”2px” border_color_all=”#32952d” border_style_all=”solid” border_width_all_fullwidth=”1px” border_color_all_fullwidth=”#000000″ border_style_all_fullwidth=”solid” border_radii_image=”off|10px|10px||” border_width_all_image=”2px” border_color_all_image=”#32952d” box_shadow_style=”preset3″ box_shadow_color=”rgba(0,0,0,0.1)” use_border_color=”on” border_color=”#000000″ use_dropshadow=”on”][\/et_pb_blog][\/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ background_position=”top_left” custom_padding=”|||” custom_padding__hover=”|||”][et_pb_blog fullwidth=”off” posts_number=”1″ include_categories=”14,78,80,18″ use_manual_excerpt=”off” show_author=”off” show_date=”off” show_categories=”off” show_excerpt=”off” show_pagination=”off” offset_number=”3″ _builder_version=”4.0.9″ header_font=”|on|||” header_text_align=”center” header_text_color=”#32952d” header_font_size=”20px” header_line_height=”1.1em” body_font_size=”16px” body_line_height=”1.8em” custom_margin=”22px|||||” custom_margin_tablet=”” custom_margin_phone=”” custom_margin_last_edited=”on|phone” custom_css_featured_image=”border: 1px solid #000;” custom_css_read_more=”padding-top:15px;||text-align: center;” border_radii=”on|10px|10px|10px|10px” border_width_all=”2px” border_color_all=”#32952d” border_style_all=”solid” border_width_all_fullwidth=”1px” border_color_all_fullwidth=”#000000″ border_style_all_fullwidth=”solid” border_radii_image=”off|10px|10px||” border_width_all_image=”2px” border_color_all_image=”#32952d” box_shadow_style=”preset3″ box_shadow_color=”rgba(0,0,0,0.1)” use_border_color=”on” border_color=”#000000″ use_dropshadow=”on”][\/et_pb_blog][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n<\/span>","protected":false},"excerpt":{"rendered":"

Well, not all of you want the basic pull quote, so I decided to put my thinking cap back on and come up with some pull quote ideas for you all (or as my Southern friends are wont to say \u2013 y\u2019all).<\/p>\n

You may know pull-quotes as the newspaper term \u201cCut-Quote,\u201d or as they\u2019re called in WordPress\u2019s Guttenberg \u201cBlockquote\u201d or the client term \u201cReally Big Quote Thingy.\u201d They\u2019re all the same thing.<\/p>\n","protected":false},"author":2,"featured_media":4625,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[80,79],"tags":[],"yoast_head":"\nAdd Custom Pull-Quotes to Divi (aka Blockquotes)<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Add Custom Pull-Quotes to Divi (aka Blockquotes)\" \/>\n<meta property=\"og:description\" content=\"In this tutorial, I show several different ways to stylize the Blockquote class in Divi (well, you could use it with most themes in WordPress).\" \/>\n<meta property=\"og:url\" content=\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/\" \/>\n<meta property=\"og:site_name\" content=\"Divi Dude\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/dividude\/\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/dividude\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-12-30T19:20:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-04T00:15:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Facebook_Pull_Quote_Divi_Tutorial.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"627\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Divi Dude\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@TheDiviDude\" \/>\n<meta name=\"twitter:site\" content=\"@TheDiviDude\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Divi Dude\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"62 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/\",\"url\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/\",\"name\":\"Add Custom Pull-Quotes to Divi (aka Blockquotes)\",\"isPartOf\":{\"@id\":\"https:\/\/dividude.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg\",\"datePublished\":\"2019-12-30T19:20:56+00:00\",\"dateModified\":\"2020-12-04T00:15:54+00:00\",\"author\":{\"@id\":\"https:\/\/dividude.com\/#\/schema\/person\/a88d88cb917922246caac8b61ddb3352\"},\"breadcrumb\":{\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage\",\"url\":\"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg\",\"contentUrl\":\"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg\",\"width\":1920,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/dividude.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Add Custom Pull-Quotes to Divi (aka Blockquotes)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/dividude.com\/#website\",\"url\":\"https:\/\/dividude.com\/\",\"name\":\"Divi Dude\",\"description\":\"Average Dude Working In Divi 3 from Elegant Themes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/dividude.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/dividude.com\/#\/schema\/person\/a88d88cb917922246caac8b61ddb3352\",\"name\":\"Divi Dude\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/dividude.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/698259309534eea830e8e62e9f8b8796?s=96&d=wavatar&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/698259309534eea830e8e62e9f8b8796?s=96&d=wavatar&r=g\",\"caption\":\"Divi Dude\"},\"sameAs\":[\"https:\/\/dividude.com\",\"https:\/\/www.facebook.com\/dividude\/\",\"https:\/\/twitter.com\/TheDiviDude\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Add Custom Pull-Quotes to Divi (aka Blockquotes)","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/","og_locale":"en_US","og_type":"article","og_title":"Add Custom Pull-Quotes to Divi (aka Blockquotes)","og_description":"In this tutorial, I show several different ways to stylize the Blockquote class in Divi (well, you could use it with most themes in WordPress).","og_url":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/","og_site_name":"Divi Dude","article_publisher":"https:\/\/www.facebook.com\/dividude\/","article_author":"https:\/\/www.facebook.com\/dividude\/","article_published_time":"2019-12-30T19:20:56+00:00","article_modified_time":"2020-12-04T00:15:54+00:00","og_image":[{"width":1200,"height":627,"url":"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Facebook_Pull_Quote_Divi_Tutorial.jpg","type":"image\/jpeg"}],"author":"Divi Dude","twitter_card":"summary_large_image","twitter_creator":"@TheDiviDude","twitter_site":"@TheDiviDude","twitter_misc":{"Written by":"Divi Dude","Est. reading time":"62 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/","url":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/","name":"Add Custom Pull-Quotes to Divi (aka Blockquotes)","isPartOf":{"@id":"https:\/\/dividude.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage"},"image":{"@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage"},"thumbnailUrl":"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg","datePublished":"2019-12-30T19:20:56+00:00","dateModified":"2020-12-04T00:15:54+00:00","author":{"@id":"https:\/\/dividude.com\/#\/schema\/person\/a88d88cb917922246caac8b61ddb3352"},"breadcrumb":{"@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#primaryimage","url":"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg","contentUrl":"https:\/\/dividude.com\/wp-content\/uploads\/2019\/12\/Add_Custom_Pull_Quotes_To_Divi.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/dividude.com\/add-custom-pull-quotes-to-divi-aka-blockquotes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dividude.com\/"},{"@type":"ListItem","position":2,"name":"Add Custom Pull-Quotes to Divi (aka Blockquotes)"}]},{"@type":"WebSite","@id":"https:\/\/dividude.com\/#website","url":"https:\/\/dividude.com\/","name":"Divi Dude","description":"Average Dude Working In Divi 3 from Elegant Themes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/dividude.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/dividude.com\/#\/schema\/person\/a88d88cb917922246caac8b61ddb3352","name":"Divi Dude","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/dividude.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/698259309534eea830e8e62e9f8b8796?s=96&d=wavatar&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/698259309534eea830e8e62e9f8b8796?s=96&d=wavatar&r=g","caption":"Divi Dude"},"sameAs":["https:\/\/dividude.com","https:\/\/www.facebook.com\/dividude\/","https:\/\/twitter.com\/TheDiviDude"]}]}},"_links":{"self":[{"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/posts\/4491"}],"collection":[{"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/comments?post=4491"}],"version-history":[{"count":0,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/posts\/4491\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/media\/4625"}],"wp:attachment":[{"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/media?parent=4491"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/categories?post=4491"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dividude.com\/wp-json\/wp\/v2\/tags?post=4491"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}