【保存版】初心者〜中級者向け〈マークダウン〉for Steemit（Japanese Ver.）

in jp-newbie •  7 years ago  (edited)



こんにちは！

Steemit の投稿ではマークダウン（Markdown）形式がサポートされています。
HTML の知識がなくても、シンプルな記述で文字を編集できる使い勝手のよい記述法です。
メモ感覚で使用できるのでスマホからの投稿の際は重宝します。

以下に、使用頻度の高そうな記述をご紹介させていただいておりますので、記事作成の際の参考にしていただければと思います。

→ マークダウンについて（Wikipedia）

markdown_steemit.png


テキスト用

文字スタイル

スタイルMarkdown 記述Steemit の表示
太文字∗∗太文字∗∗太文字
斜体（イタリック）∗斜体（イタリック）∗斜体（イタリック）
太文字の斜体∗∗∗太文字の斜体∗∗∗太文字の斜体
打ち消し線∼∼打ち消し線∼∼打ち消し線


引用符

文頭に >（ライトアングル）を記述

〈Markdown 記述〉

>引用符を付加する。
>
>引用符を付加する。
>>引用符を付加する。
>>引用符を付加する。

〈Steemit の表示〉

引用符を付加する。

引用符を付加する。

引用符を付加する。
引用符を付加する。


リンク

リンク（URLそのもの）

URLを記述すると自動的にリンクテキストになります。

スタイルMarkdown 記述Steemit の表示
リンク（URLそのもの）http:⁄⁄steemit.comhttp://steemit.com
リンク（文言にリンク）[リンクしたい文字](リンクURL)リンクしたい文字


見出しのサイズ

#（ハッシュ）の数 = 見出しのサイズ

　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　 　 　　 　　 　
Steemit の表示Markdown 記述

header1

# header1

header2

## header2

header3

### header3

header4

#### header4
header5
##### header5
header6
###### header6


ページ内リンク（アンカー）

上記の「見出し記法」を記述するとページ内リンク（アンカー）が自動的に作成されます。
そのアンカーへリンクを貼ることでページ内リンクが作成できます。
これは記事の目次などによく利用されます。

〈Markdown 記述〉

* [目次１](###太文字)
* [目次２](###斜体（イタリック）)

〈Steemit の表示〉


改行ルール

① 空白の行で挟まれた行、または複数行の文章は、１段落になります。


〈Steemit の表示〉

サンプルテキスト、サンプルテキスト、サンプルテキスト。

サンプルテキスト、サンプルテキスト、サンプルテキスト
サンプルテキスト、サンプルテキスト、サンプルテキスト。
サンプルテキスト、サンプルテキスト、サンプルテキスト。


② 段落内での改行 = 改行したい行の末尾に半角スペース × ２


〈Steemit の表示〉

サンプルテキスト、サンプルテキスト。（半角スペース × ２）
サンプルテキスト。（半角スペース × ２）
サンプルテキスト、サンプルテキスト。（半角スペース × ２）


リスト表示

① 番号なしリスト

-（ハイフン）、+（プラス）、*（アスタリスク）のいずれでも箇条書きリストを記述できます。

〈Markdown 記述〉

+ 箇条リストA
    + 入れ子 リストA-1
        + 入れ子 リストA-1-1
        + 入れ子 リストA-1-2
    + 入れ子 リストA-2
+ 箇条リストB
+ 箇条リストC

〈Steemit の表示〉

  • 箇条リストA
    • 入れ子 リストA-1
      • 入れ子 リストA-1-1
      • 入れ子 リストA-1-2
    • 入れ子 リストA-2
  • 箇条リストB
  • 箇条リストC


② 番号付きリスト

1.(space)、で番号付きリストの記述が可能です。

〈Markdown 記述〉

1. 番号付きリスト1
    1. 入れ子番号付きリスト1-1
    1. 入れ子番号付きリスト1-2
1. 番号付きリスト2
1. 番号付きリスト3

〈Steemit の表示〉

  1. 番号付きリスト1
    1. 入れ子番号付きリスト1-1
    2. 入れ子番号付きリスト1-2
  2. 番号付きリスト2
  3. 番号付きリスト3



- -

レイアウト用

テーブル（表組み）

マークダウンはテーブル表示にも対応しています。
一見、複雑に見えますが慣れてしまえば HTML でテーブルを組むよりもずっと簡易です。

〈Markdown 記述〉

|題字１|題字２|題字３|
|:--|--:|:--:|
|align left|align right|align center|
|左|右|中央|

〈Steemit の表示〉
題字１題字２題字３
align leftalign rightalign center
左右中央


横線

*（アスタリスク）、_（アンダースコア）、-（ハイフン）を３つ以上連続して記述。スペースが入っても有効。


〈Markdown 記述〉

---

〈Steemit の表示〉

↑ サンプルの横線



マークダウンの表示はブラウザやプラットフォームにより差異があり、
すべての環境で同じように表示される保証がないところは HTML と同じです。



- -

マークダウンの記述ができるエディタ

マークダウン記述法は特別なツールがなくても記述することができることが魅力ですが、プレビューや動作確認をしながら
記述することができるアプリケーションも開発されています。

ブログの下書きには何かしらのメモ用アプリを使用されている方もおられるかと思います。
マークダウンの導入をされる際に専用アプリをつかってみるのもよいかもしれません。



デスクトップアプリケーション

■ Atom
Icon特　徴環　境
Atom.pngGitHub が開発した無料アプリです。
左右にソースとプレビューを同時に表示しながら記述できます。		Win／mac〈無料〉


→ Atom 公式 Website

■ Visual Studio Code
Icon特　徴環　境
VScode.pngMicrosoft社のテキストエディタです。
プレビューウィンドを開きながらマークダウン記述をすることができます。		Win／mac〈無料〉


→ Visual Studio 公式 Website

■ typora

Icon特　徴環　境
typora.jpg直感的な操作系。高機能にしてシンプル。
アプリの設計が秀逸でファンの多いエディタです。記述したその場でスタイリングされる仕組みなのでプレビュー表示の概念がありません。		Win／mac／Linux〈無料〉


→ typora 公式 Website


携帯端末用アプリケーション

■ # Type
Icon特　徴環　境
type.pngfromkk さんが個人で制作された Markdown エディタです。
Extension に対応し、記述の入力補助ツールも付いています。		Win／mac／Linux〈無料〉


→ Visual Studio 公式 Website

■ iA Writer
Icon特　徴環　境
download.jpgシンプルながら充実した補助機能を実装したエディタです。
それなりの価格がしますが Markdown入門に。		iOS〈¥600〉／mac〈¥3,600〉

→ iA Writer ダウンロード

■ Uiysses
Icon特　徴環　境
images.pngMarkdown の拡張版である Markdown XL に対応。
Word形式/PDF形式や WordPress など各種別フォーマットへの書き出し機能や UI 編集機能まで実装した充実のエディタです。		iOS〈無料 + App内課金〉


→ Uiysses ダウンロード

■ Boostnote
Icon特　徴環　境
download.pngプログラマー用に開発された高機能エディタ。
ユーザの評価はとても高いですがファイル共有は Dropbox のみ。		iOS／mac／Android／Windows〈無料〉


→ Boostnote ダウンロード

■ JotterPad
Icon特　徴環　境
download-1.png基本的な機能を実装したシンプルなエディタ。PDF 変換やフレーズ検索を実装。Android〈無料〉


→ JotterPad ダウンロード


以上、マークダウンのまとめでした。
steemit の標準エディタのツールバーにもマークダウン用のツールが
いくつかありますのですでに活用されておられる方も多いかと思います。

今回紹介させていただいた記述法の中に１つでも今後の投稿の役に
立ちそうなものが見つけていただけたなら幸いです。


HTML タグ集もありますので、参考にしてくださいね！

【保存版】初心者〜中級者向け〈 HTML タグ 〉for Steemit（Japanese Ver.）



では〜！


jp-newbie japanese markdown howto code
7 years ago by

Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

  • Disagreement on rewards
  • Fraud or plagiarism
  • Hate speech or trolling
  • Miscategorized content or spam

Submit
$8.88
  • Past Payouts $8.88
  • - Author $6.76
  • - Curators $2.12
27 votes
7
Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  
  • Trending
    • [-]
      ·  7 years ago 

    ありがとう！使わせていただきます✨🍀

    Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

    • Disagreement on rewards
    • Fraud or plagiarism
    • Hate speech or trolling
    • Miscategorized content or spam

    Submit
    $0.00
      [-]
        ·  7 years ago (edited)

      リブログありがとうございます。

      ヒントは@yoshikoさんのビギナー用ガイドだったりします（笑）

      その節はこちらこそお世話になりました。

      記法の情報が分散している印象があったのでそれらのまとめになるような投稿をさせていただきましたー。

      近々英語版も作ってみようと思います。

      Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

      • Disagreement on rewards
      • Fraud or plagiarism
      • Hate speech or trolling
      • Miscategorized content or spam

      Submit
      $0.00
        [-]
          ·  7 years ago 

        これはすごいめちゃわかりやすいですね！

        色とかは変えられないですよね（´；ω；`）

        Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

        • Disagreement on rewards
        • Fraud or plagiarism
        • Hate speech or trolling
        • Miscategorized content or spam

        Submit
        $0.00
          [-]
            ·  7 years ago (edited)

          ありがとうございます😊

          返信が遅れてしまいましてごめんなさい。

          色はもしかするとコードのプレ表示のときに変えられるかもしれないのですが、通常の文章の文字は今のところできないようです。

          Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

          • Disagreement on rewards
          • Fraud or plagiarism
          • Hate speech or trolling
          • Miscategorized content or spam

          Submit
          $0.00
            [-]
              ·  7 years ago 

            はじめまして！
            使わせて頂きますm(_ _)m

            Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

            • Disagreement on rewards
            • Fraud or plagiarism
            • Hate speech or trolling
            • Miscategorized content or spam

            Submit
            $0.00
              [-]
                ·  7 years ago 

              ぜひぜひ！

              地味なのですが、正しい見出しの付け方は SEO 的にも有効なのでそのあたりもまたご紹介させていただきますね。

              Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

              • Disagreement on rewards
              • Fraud or plagiarism
              • Hate speech or trolling
              • Miscategorized content or spam

              Submit
              $0.00
                [-]
                  ·  7 years ago 

                ありがとうございます！宜しくお願いしますm(_ _)m

                Downvoting a post can decrease pending rewards and make it less visible. Common reasons:

                • Disagreement on rewards
                • Fraud or plagiarism
                • Hate speech or trolling
                • Miscategorized content or spam

                Submit
                $0.00