When you really want a sentence or two in your text to stand out, you have several styling options to do so. You can use bold, italic, or underline as obvious options to style text. You can go a step further and color or highlight the text. You can also do something more drastic – an option called blockquoting.
Recently we released a free addon called Qi Addons for Elementor which includes 60 addons created by our team. These plugins include the only blockquote widget – a plugin that allows you to easily add and style blockquotes.
If you want to see the plugin in action – here is a handy video explaining how to use it to create a simple yet effective blockquote.
For those of you who prefer to read, we will use this article to show you the same thing – how to create a simple blockquote and become familiar with some of the options this plugin has. You will read:
Everyone knows what quoting is – when you take something someone else has said and write it down acknowledging what you are doing. Many people come across quotes and quotes in the classroom. Those who do not know can easily become familiar by consuming the media.
When talking about block quotes, you shouldn’t take the word “quote” in the strictest possible sense. Even if you often quote someone else in a blockquote, it’s also a great way to shine a light on something important you’ve written – quote your own text.
As a general rule, block quotes are stylized differently from the rest of the text. Often times, the text in a block quote will be in a different font, usually italic. A larger font size is common in blockquotes, as is the use of exaggerated quotes or other visual elements – blockquotes use almost every trick in the book to make their content stand out.
That’s why we say blockquote is a design option to highlight text. People using HTML
and
They were able to add a blockquote with their tags. Some may have used this as a convenient way to add some indentation to the text, because that’s how blockquotes are usually displayed.
Today, however, blockquotes can be rich and colorful or simple and serious. How blockquotes look is up to you and the method you use to add them to WordPress.
If you’re interested in adding blockquotes to WordPress with a little more style than you can get from an HTML tag, you’ll need to do a few things first. if you don’t have Workman already installed and activated, this is something you need to do. The free version will work just fine.
Your next step is our Qi Plugins for Elementor plugin, just like you install any plugin in WordPress. Upon activation, you can create a new post or page or open an existing one and you will be ready to add a blockquote in WordPress.
You can find the widget by searching for the term “blockquote” in the left-hand panel. What you see in the results will be the red widget. To add a blockquote to WordPress, simply drag it to a free section. This is how we added ourselves, but followed this step with a simple edit – we edited the section by selecting the boxed content width and setting it to 735.
This gave us the canvas to use to edit and style the blockquote. You can choose the layout and style you like, or even go to the advanced options of the section.
There are three important things you can do in the content options. You can choose the layout referring to the location of these quotes, edit the text, and choose the symbol type.
We chose to stick with the superscript, keeping the quotation marks above the text. We translated lorem ipsum into our own text and used an icon that we uploaded to our media library.
Since there wasn’t much to do on the content tab, we moved on to styling our blockquote. No need to rush to experiment with layouts, text and icon types – take your time to find a good match.
By switching to the Style tab, you will first be greeted with options to change the alignment of the text, the background type, and the border type. Alignment is a simple option, but the background type and border type hide a lot of interesting options you can make. Whether you want to create a color gradient background or double border for your block quote, this is where you can do it.
We changed the alignment to center for our blockquote.
The Text Style card is where you’ll find all the color and typography options for the text. You can also select the text label. We chose not to change the color or the default label, but changed the font to DM Serif Text and style to Italic.
On the Icon Style card, you can choose the color of the icon as well as its alignment and size. We just decided to change the size of the icon and increase it to 47px.
Finally, the Spacing Style card is where you can adjust the space around the text, the text margin, and the placeholder padding to increase the icon margin. Satisfied with how our blockquote turned out, we decided to leave these options as they are.
Let’s wrap it up!
Whether you use it to quote someone else’s words or draw more attention to yourself, blockquoting is a tool you can use to get the job done. And if that’s the tool you plan to use for your website, our widget will be there with all the options you’ll need to customize your blockquote.
Support our work ❤️
If you enjoyed this article, consider leaving a tip to help us keep publishing great content.
