Let me show you how to add vertical line blockquote for Blogger, just like the one as seen in WordPress sites.
It is very easy and you can do it right away with your Blogger/ Blogspot sites.
This is another helpful content from the DiGiztal Blogspot Blogger Tips series.
You don't have to search for any code from the HTML template.
All you need to do is just add a set of CSS code.
This is an example of what I mean by a vertical line blockquote:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi arcu lacus, maximus rutrum sagittis quis, sollicitudin ut eros. Nulla facilisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
You can customize the font-type, font-size, the vertical line thickness and its color.
So, are you interested in customizing your Blogger blockquote layout?
Then, let's do it.
Add vertical line blockquote in Blogger
This is what you do:
1. Log in to Blogger account.
2. Click "Theme".
3. Next click the "Customize" button.
4. Click "Advanced".
5. Pull the slider down, until you see "Add CSS".
6. Click "Add CSS".
7. Now paste this set of CSS code in the box provided.
blockquote {font: 14px normal helvetica, sans-serif;margin-top: 10px;margin-bottom: 10px; margin-left: 50px; padding-left: 15px; border-left: 4px solid #ff5606;}
8. Click "Apply to Blog" button at the top right hand corner of the page.
That's all.
As I have mentioned above, you can customize the font and the vertical line.
To change the font size, change the 14px to other size of your preference.
To change the font-type, replace 'normal helvetica, sans-serif'.
To change the vertical line thickness, change 'border-left:4px' to other size of your choice.
To change the vertical line color, replace 'solid #ff5606' to other html color code.
I hope this simple on how to add vertical line blockquote for Blogger is helpful to you.