Markdown plugin for pull quotes which can be used in a Pelican site
Python
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
mdx_pullquote
.gitignore
LICENSE
README.md
side-by-side.png
src

README.md

Pull Quote - Markdown Plugin

Pull Quote

Pull Quotes are seen in magazines to draw the attention of the reader to important excerpts of the article. This extension can be used as a Markdown plugin or in a Pelican site, to easily implement pull quotes.

The left half of the figure below shows the markdown syntax and the right half shows the corresponding web page. The generated HTML markup is quite clean and non-repetitive as CSS3 is used. But note that the excerpt is an exact copy of the body text and shown quite close to it.

side by side comparison

Usage

Usage instructions as applicable to Pelican.

Copy the mdx_pullquote directory into the plugins directory inside your pelican project.

Next open your pelicanconf.py and add 'pullquote' to the MD_EXTENSIONS list, as follows:

    MD_EXTENSIONS = ['codehilite', 'pullquote']

Finally, ensure that your site's CSS recognises and display the pull quote correctly. There are several ways of achieving this. A sample CSS code could be:

    div[data-pullquote]:before, span[data-pullquote]:before {
	    content: attr(data-pullquote);
        display: block;
	    float: right;
	    width: 200px;
	    margin: 0 0 0.5em 30px;
	    padding: 0;
	    font-size: 1.5em;
	    line-height: 1.4em;

        font-style: italic;
        text-align: left;
        color: #0000AA;
    }

Now, you are all set!

To use pulldown in your markdown posts, you will need to use markdown's hyperlink syntax with + symbol instead of the URL. For e.g.

	This text is before the quote. I would say,[this part 
    will appear as a pull quote](+). This text is after the quote.  
    

License

This content is released under the (http://opensource.org/licenses/MIT) MIT License.