Phlox Quote

Phlox Quote Widget, lets you show your favorite quotes, not only on the posts' content but also on any widget area you want. This widget has different blockquote styles.

Follow below steps to add Phlox Quote to a widget area or in a page content:

  1. Go to your WordPress admin panel
  2. Click Appearance on the Dashboard
  3. Then click Widgets
  4. Find [Phlox] Quote among the available widgets and add it to your desired Widget Area

You can use this element, to show your website testimonials.

Access Blockquote Options in Elementor Page Builder

  1. Go to your WordPress Admin Panel
  2. Click the Pages on the Dashboard
  3. Click the Add New
  4. Navigate to the top left hand of the WordPress text-box and find Edit with Elementorbutton.
  5. Check out Elements
  6. Scroll down to PHLOX - General section
  7. Choose Blockquote

After adding a quote to your content, you are able to customize it by available options:

  • Content


On this section, you are able to write the text you want to add within a quotation.

  • Style


You can change Text alignment, Text Color, or any Typography option you want.

Quote Symbol

You can show or hide Quote Symbol by enabling or disabling this option. The Color is editable and you can also change Typography options like font or font weight. The space between the symbol and your text can be increased or decreased by changing Text indent. The last option in this section, is Margin, which can have different values in mobile and tablet.


There are five Border Types: Solid, Double, Dotted, Dashed, and Groove. However, it is optional to add border for your quote. Besides, you can change the width and color of this border. Your block can have Background color, too.

Check out this article to know more about Advanced tab and start working with Elementor.

Access Quote Options in SiteOrigin Page Builder

  1. Go to your WordPress Admin Panel
  2. Click Pages on the Dashboard
  3. Click Add New
  4. Navigate to the top right hand of the WordPress editor and find Page Builder, beside text tab
  5. Click Add Widget
  6. Click Phlox and choose [Phlox] Quote
  7. Click Edit on the right side of the widget on Page Builder

After adding a quote to your content, you are able to customize it by available options:


It is better to add a title for your quote. Such as Quote of the Day

Quote Text

Here in this field, write a text you want to display as a quote on your website's widget area.

Blockquote Style

There are eight styles to select for your quote.

Quote Normal

Blockquote Normal

Blockquote Bordered


Intro Hero

Intro with Splitter

Pullquote Normal

Pullquote Colorized

Text Align

Text alignment can be Left, Right, or Center.

Insert Quote Symbol

To show a start and end quotation marks, switch this on.

Extra Class Name

This option allows you to have your customized. To customize the widget style, you should write the style on your CSS file. After that, you can add the class name of that style in this field.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us