mirror of
https://github.com/moparisthebest/android.moparisthebest.org
synced 2024-12-24 08:28:50 -05:00
changed figure tag to image tag, added more docs
This commit is contained in:
parent
39b31a0553
commit
d90b0dc5de
@ -6,6 +6,9 @@ sidebar: false
|
|||||||
footer: false
|
footer: false
|
||||||
---
|
---
|
||||||
|
|
||||||
|
There are [other plugins](/docs/plugins) for octopress, but here's an overview of the ones you'll be likely to use while blogging.
|
||||||
|
This is mainly a description and demo, so be sure to follow the links beneath each section for examples and documentation.
|
||||||
|
|
||||||
## Block quote
|
## Block quote
|
||||||
|
|
||||||
{% blockquote @AustinTaylor https://twitter.com/austintaylor/status/73136957617750016 %}
|
{% blockquote @AustinTaylor https://twitter.com/austintaylor/status/73136957617750016 %}
|
||||||
@ -15,7 +18,7 @@ Give a man a fish, he'll have food for a day. Teach a man to fish, and he'll alw
|
|||||||
[Examples & documentation »](/docs/plugins/blockquote/)
|
[Examples & documentation »](/docs/plugins/blockquote/)
|
||||||
|
|
||||||
## Pull quote
|
## Pull quote
|
||||||
Octopress offers a CSS3 only technique for pull quotes, based on the technique by [Maykel Loomans](http://miekd.com/articles/pull-quotes-with-html5-and-css/).
|
Octopress offers a CSS only technique for pull quotes, based on the technique by [Maykel Loomans](http://miekd.com/articles/pull-quotes-with-html5-and-css/).
|
||||||
|
|
||||||
{% pullquote %}
|
{% pullquote %}
|
||||||
When writing longform posts, I find it helpful to include pull quotes to help readers easily identify the topics covered in each section. Some prefer to break things up with lots of headings, and while this seems to be a trend it doesn't work so well for long form prose.
|
When writing longform posts, I find it helpful to include pull quotes to help readers easily identify the topics covered in each section. Some prefer to break things up with lots of headings, and while this seems to be a trend it doesn't work so well for long form prose.
|
||||||
|
@ -13,12 +13,14 @@ the documentation and if you have trouble, [I'll be happy to help](http://convor
|
|||||||
|
|
||||||
## Getting Started
|
## Getting Started
|
||||||
If you're using bundler and rvm, this should be a breeze.
|
If you're using bundler and rvm, this should be a breeze.
|
||||||
|
|
||||||
- [Initial setup](/docs/setup) - Get source and install dependencies
|
- [Initial setup](/docs/setup) - Get source and install dependencies
|
||||||
- [Basic Configuration](/docs/configuring) - Enable third party services and personalize your blog
|
- [Basic Configuration](/docs/configuring) - Enable third party services and personalize your blog
|
||||||
- [Deploying Octopress](/docs/deploying) - Simple deploy instructions for Rsync and Github pages
|
- [Deploying Octopress](/docs/deploying) - Simple deploy instructions for Rsync and Github pages
|
||||||
|
|
||||||
## Using Octopress
|
## Using Octopress
|
||||||
Your blog should be awesome. This should help.
|
Your blog should be awesome. This should help.
|
||||||
|
|
||||||
- [Blogging Basics](/docs/blogging) - How to create blog posts and pages
|
- [Blogging Basics](/docs/blogging) - How to create blog posts and pages
|
||||||
- [Sharing Code Snippets](/docs/blogging/code) - Share code snippets with ease
|
- [Sharing Code Snippets](/docs/blogging/code) - Share code snippets with ease
|
||||||
- [Syntax Highlighting Test](/docs/blogging/code/test) - Language highlighting tests
|
- [Syntax Highlighting Test](/docs/blogging/code/test) - Language highlighting tests
|
||||||
|
@ -1,8 +0,0 @@
|
|||||||
---
|
|
||||||
layout: page
|
|
||||||
title: "Figure Tag"
|
|
||||||
date: 2011-07-22 09:15
|
|
||||||
comments: true
|
|
||||||
sharing: true
|
|
||||||
footer: true
|
|
||||||
---
|
|
30
source/docs/plugins/image-tag/index.markdown
Normal file
30
source/docs/plugins/image-tag/index.markdown
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
---
|
||||||
|
layout: page
|
||||||
|
title: "Image Tag"
|
||||||
|
date: 2011-07-22 09:15
|
||||||
|
sidebar: false
|
||||||
|
footer: false
|
||||||
|
---
|
||||||
|
|
||||||
|
If you like Markdown's simple syntax for images, you'll love the simplicity of the Octopress image tag.
|
||||||
|
|
||||||
|
#### Syntax
|
||||||
|
|
||||||
|
{{ "{% img [class names] /path/to/image" [title text] }} %}
|
||||||
|
|
||||||
|
## Examples
|
||||||
|
|
||||||
|
{{ "{% img http://placekitten.com/890/280 Place Kitten #1" }} %}
|
||||||
|
{{ "{% img left http://placekitten.com/320/250 Place Kitten #2" }} %}
|
||||||
|
{{ "{% img left http://placekitten.com/150/250 Place Kitten #3" }} %}
|
||||||
|
|
||||||
|
{% img http://placekitten.com/890/280 Place Kitten #1 %}
|
||||||
|
Bacon ipsum dolor sit amet exercitation ball tip consectetur tempor. Biltong exercitation aliqua, ribeye consequat veniam consectetur.
|
||||||
|
|
||||||
|
{% img left http://placekitten.com/320/250 Place Kitten #2 %}
|
||||||
|
{% img right http://placekitten.com/150/250 Place Kitten #3 %}
|
||||||
|
Aliquip nulla do tempor, ball tip dolore anim esse strip steak nisi nostrud. Tri-tip mollit deserunt ut duis, commodo brisket short loin est hamburger sunt consequat rump meatloaf. Exercitation enim aliqua tempor dolore. Non eu venison, officia boudin tri-tip enim beef ribs flank cupidatat in aute. Tail voluptate fugiat aute flank, venison sint.
|
||||||
|
|
||||||
|
Brisket quis velit bresaola. Pork loin pork chop beef duis. Short loin fugiat officia short ribs magna. Ullamco eu proident jerky, fugiat chuck nostrud ham rump meatloaf eiusmod adipisicing. Qui et reprehenderit, magna biltong consequat short ribs pancetta. Tail tenderloin sausage, hamburger corned beef drumstick ad. Eu labore enim velit.
|
||||||
|
|
||||||
|
Filler text courtesy of [Bacon Ipsum](http://baconipsum.com).
|
@ -12,10 +12,10 @@ Octopress ships with the following plugins. Many have been written specially for
|
|||||||
- [Code Block](/docs/plugins/codeblock) - For easy inline code sharing
|
- [Code Block](/docs/plugins/codeblock) - For easy inline code sharing
|
||||||
- [Include Code](/docs/plugins/include-code) - Embed code from your filesystem
|
- [Include Code](/docs/plugins/include-code) - Embed code from your filesystem
|
||||||
- [Gist Tag](/docs/plugins/gist-tag) - Automatically downloads and embeds Github gists
|
- [Gist Tag](/docs/plugins/gist-tag) - Automatically downloads and embeds Github gists
|
||||||
- [Render Partial](/docs/plugins/render-partial) - Insert any file into another post or page.
|
- [Render Partial](/docs/plugins/render-partial) - Insert any file into another post or page
|
||||||
- [Figure Tag](/docs/plugins/figure-tag) - Easily post images with semantic <figure> & <figcaption> elements
|
- [Image Tag](/docs/plugins/image-tag) - Easily post images with class names and titles
|
||||||
- [Blockquote](/docs/plugins/blockquote) - Generate beautiful, semantic block quotes
|
- [Blockquote](/docs/plugins/blockquote) - Generate beautiful, semantic block quotes
|
||||||
- [Pullquote](/docs/plugins/pullquote) - Generate CSS only pull quotes — no duplicate data, no javascript.
|
- [Pullquote](/docs/plugins/pullquote) - Generate CSS only pull quotes — no duplicate data, no javascript
|
||||||
- [Custom filters](/docs/plugins/octopress-filters) - Liquid filters built just for Octopress
|
- [Custom filters](/docs/plugins/octopress-filters) - Liquid filters built just for Octopress
|
||||||
- [Category Generator](/docs/plugins/category-generator) - Generates archive pages for each blog category
|
- [Category Generator](/docs/plugins/category-generator) - Generates archive pages for each blog category
|
||||||
- Sitemap Generator - Generates an SEO friendly sitemap.xml
|
- Sitemap Generator - Generates an SEO friendly sitemap.xml
|
||||||
|
@ -6,3 +6,21 @@ comments: true
|
|||||||
sharing: true
|
sharing: true
|
||||||
footer: true
|
footer: true
|
||||||
---
|
---
|
||||||
|
|
||||||
|
Octopress offers a CSS only technique for pull quotes, based on the technique by [Maykel Loomans](http://miekd.com/articles/pull-quotes-with-html5-and-css/).
|
||||||
|
|
||||||
|
#### Syntax
|
||||||
|
|
||||||
|
{{ "{% pullqote" }} %}
|
||||||
|
Surround your paragraph with the pull quote tags. Then when you come to
|
||||||
|
the text you want to pull, {" surround it like this "} and that's all there is to it.
|
||||||
|
{{ "{% endpullqote" }} %}
|
||||||
|
|
||||||
|
Here's a more realistic example of how you might use a pull quote.
|
||||||
|
{% pullquote %}
|
||||||
|
When writing longform posts, I find it helpful to include pull quotes to help readers easily identify the topics covered in each section. Some prefer to break things up with lots of headings, and while this seems to be a trend it doesn't work so well for long form prose.
|
||||||
|
It is important to note that {" pull quotes are merely visual in presentation and should not appear twice in the text. "} That is why it a CSS only technique for styling pull quotes is preferable. Octopress includes a handy pull quote plugin to make this easy for you.
|
||||||
|
{% endpullquote %}
|
||||||
|
|
||||||
|
Inspect the source and you'll see the pulled content appears in the data-pullquote attribute of the paragraph. The pull quote effect is created
|
||||||
|
entirely with CSS, and is supported by all modern browsers as well as IE8 and up.
|
||||||
|
7
source/docs/updating/index.markdown
Normal file
7
source/docs/updating/index.markdown
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
layout: page
|
||||||
|
title: "Updating"
|
||||||
|
date: 2011-07-22 19:46
|
||||||
|
sidebar: false
|
||||||
|
footer: false
|
||||||
|
---
|
Loading…
Reference in New Issue
Block a user