src="https://update.vivaldi.com/stats/piwik.php?idsite=1&rec=1&bots=1" style="border:0;" alt=""

フォーラムスレッドの機能説明を作ってみた。(要らないかもしれないけど):persevere:


  • Vivaldi Translator

    フォーラムスレッドの機能

    無いので作ってみようかと。。。

    0_1507717384320_マークダウン記法一覧.JPG


    0_1507360737701_vik01331.jpg をクリックするとスレッド作成画面になります。

    「スレッド作成画面」

    0_1507360547204_フォーラム0.png

    1. ドラッグするとスレッド作成ウィンドウ?の高さが変更でき、一番上まで引き上げるとアイコンの形状が変化します。
      クリックすると元の位置まで戻り、ドラッグして任意の位置にすることも可能。
      0_1507363967300_フォーラム機能2.JPG

    1. スレッドの題名を記入する部分です。
      できるだけスレッドの内容を表したタイトルをつけたほうが良いです。

    1. マークダウン記法の書式を簡単に入力するためのツールバー群
      1. 0_1507375590636_ボールドアイコン1.png ボールドアイコン
        文字を太くして強調表示します。
        半角の****で太文字にしたい文字を挟み込みします。
      2. 0_1507375611595_イタリックアイコン1.png イタリック(斜体) 【あまり使い道はなさそうですが・・・】
        半角の**イタリック(斜体) にしたい文字を挟み込みします。
        半角の******イタリック(斜体)太字 にしたい文字を挟み込みします。
      3. 0_1507375277857_リスト表示アイコン1.png 箇条書きリストと入れ子(英: Nesting)
        半角スペースは見えないので「_ 」で表現します。
        • 半角で行頭に-または、*に続けて半角のスペースを書くと「●と○」または「■」が付与されたリストになります。
        • 半角で行頭に1.または、1)に続けて半角のスペースをと書くと番号付きリストになります。
          番号付きリストは数字が自動的に増えていくので表記は1._または、1)_のままでも構いません。-
        • 両方を併用することや入れ子(インデント)にして使うこともできます。
          入れ子とは? 封筒の中に封筒が入っており、その封筒の中にまた封筒が入っているような状態を指す。

          入れ子(インデント)にして使うときは行頭に2つ(または3つ)の倍数の半角のスペースで字下げします。
          \
        • コードブロック
          を入れ子にするには、8つ(または6つ)のスペースでインデントするか、
          バッククォート` を3つ```文頭と文末```に使用します。
          バッククォート` は半角でSHIFTキーを押しながら@キーを押すと入力できます。
          _ _ _1._
          コードブロックの入れ子(インデント)の段階、深さを増やす際は、
          行頭に4つ(または3つ)の組の半角スペースをインデントの深さの分増やします。
          インデントからの脱出には空行(改行だけの行)を挟みます。
        • 段落
          入れ子(インデント)を脱出せずに、途中で段落(空改行)を空けるときは行頭にバックスラッシュ\を記入後に改行を入れます。



          ↑上記のような空白の行を段落を空けるといいます。
          上記の行は実際には以下のように記述しています。
          ※バックスラッシュ\は半角で”¥”キーを押すと入力できます。
       - **段落**
    入れ子(インデント)を脱出せずに、途中で段落(空改行)を空けるときは行頭にバックスラッシュ`\`を記入後に改行を入れます。
    \
    \
    \
    ↑上記のような空白の行を段落を空けるといいます。
    上記の行は実際には以下のように記述しています。
    ※バックスラッシュ`\`は半角で”¥”キーを押すと入力できます。
    

    説明ページには4つでインデントできると記載してあるが実際の動作では、
    行頭から半角スペースを2、4、6、8(数字付は3、6、9、12)として親リストとの字下げ差が2つまたは3つ以上であれば動作するようです。

    例:番号付きリスト表示(赤い文字は実際の入力例_は半角の空白を示す)
    1からではなく開始したい番号から始めることもできます。例は20番から開始

    1. 20._インデント1段階(行頭に半角スペースなし)
    2. 20._インデント1段階(行頭に半角スペースなし)
    3. 20._インデント1段階(行頭に半角スペースなし)

    入れ子の深さ、段階を示す例

    1. 1._インデント1段階(行頭に半角スペースなし)
    2. 1._インデント1段階(行頭に半角スペースなし)
    3. 1._インデント1段階(行頭に半角スペースなし)
      1. ___2._インデント2段階(行頭に半角スペース3つ)
      2. ___1._インデント2段階(行頭に半角スペース3つ)
      3. ___1._インデント2段階(行頭に半角スペース3つ)
        1. ______3._インデント3段階(行頭に半角スペース6つ)
        2. ______2._インデント3段階(行頭に半角スペース6つ)
        3. ______1._インデント3段階(行頭に半角スペース6つ)
          1. _________4._インデント4段階(行頭に半角スペース9つ)
          2. _________1._インデント4段階(行頭に半角スペース9つ)
          3. _________1._インデント4段階(行頭に半角スペース9つ)
            1. ____________5._インデント5段階(行頭に半角スペース12つ)
            2. ____________5._インデント5段階(行頭に半角スペース12つ)
            3. ____________5._インデント5段階(行頭に半角スペース12つ)
              1. _______________6._インデント6段階(行頭に半角スペース15つ)
              2. _______________1._インデント6段階(行頭に半角スペース15つ)
              3. _______________2._インデント6段階(行頭に半角スペース15つ)
                1. __________________1._インデント7段階(行頭に半角スペース18つ)
                2. __________________1._インデント7段階(行頭に半角スペース18つ)
                3. __________________1._インデント7段階(行頭に半角スペース18つ)
                  1. _____________________8._インデント8段階(行頭に半角スペース21つ)
                  2. _____________________8._インデント8段階(行頭に半角スペース21つ)
                    ※これ以上深いインデントの存在を検証する気がないのでここまでで。

    例:番号なしリスト表示(赤い文字は実際の入力例_は半角の空白を示す)

    • -_インデント1段階(行頭に半角スペースなし)
    • -_インデント1段階(行頭に半角スペースなし)
    • -_インデント1段階(行頭に半角スペースなし)
      • __-_インデント2段階(行頭に半角スペース2つ)
      • __-_インデント2段階(行頭に半角スペース2つ)
      • __-_インデント2段階(行頭に半角スペース2つ)
        • ____-_インデント3段階(行頭に半角スペース4つ)

        • ____-_インデント3段階(行頭に半角スペース4つ)

        • ____-_インデント3段階(行頭に半角スペース4つ)

          • ______-_インデント4段階(行頭に半角スペース6つ)
          • ______-_インデント4段階(行頭に半角スペース6つ)
          • ______-_インデント4段階(行頭に半角スペース6つ)
            • ________-_インデント5段階(行頭に半角スペース8つ)
              • __________-_インデント6段階(行頭に半角スペース10つ)
                • ____________-_インデント7段階(行頭に半角スペース12つ)
                  • ______________-_インデント8段階(行頭に半角スペース14つ)
                  • ______________-_インデント8段階(行頭に半角スペース14つ)
                  • ______________-_インデント8段階(行頭に半角スペース14つ)
                    ※これ以上深いインデントの存在を検証する気がないのでここまでで。
          1. 0_1507375563992_取り消し線アイコン1.png 取り消し線
            strikethrough text 半角の波線2つ ~~~~取り消し線 を表示したい文字を挟み込みします。

          2. 0_1507375257687_リンクアイコン1.png リンク
            [リンク文字列](リンク先 url "タイトル")または、半角スペースを空けてからリンク先 urlを直接書くとリンクになります。
            ※いずれかの括弧の間にスペースを入れないでください。
            "タイトル"はオプションで省略可能です。記述するとマウスオーバーでタイトル部分のテキストを表示します。

            例1 タイトルなし:[テストリンク](http://てすとだってばよ.go.jp/ )テストリンク

            例2 タイトルあり:[リンクタイトルあり](http://てすとだってばよ.go.jp/ "リンクテストなのでDNSエラーになり、どこにもつながりません。")リンクタイトルあり

            例3: http://てすとだってばよ.go.jp/http://てすとだってばよ.go.jp/
            ※変なところとリンクしたら嫌なのでまず存在しなさそうな行政機関用のドメイン(.go.jp/)を利用しています。
            ※何処にもつながらないのが正常です。

            また、次のような相対パスを使用することもできます。【 相対パスとは?
            ../example.html

          3. 0_1507373584213_画像を表示1.png 画像を表示します。
            PCから画像ファイルを直接編集ウインドウにドラッグ&ドロップする方法もあります。
            ![alt text](image url "タイトル")
            alt textは画像が何らかの原因で表示できない場合の、
             代替テキストを書いておくところで省略しても構いません。
            "タイトル"はオプションで省略可能です。記述するとマウスオーバーでタイトル部分のテキストを表示します。

            image urlは画像の保存してある場所(画像のURL)を書きます。画像のURLとは、http://で始まり.画像の拡張子 で終わるURLです。
            .画像の拡張子の代表的なものに .BMP .jpg .png .gif などがあります。詳しくは検索してみてください。
            https://gyazo.com/d40f3a52a2b6b5aa14ba708ca4bea1f8.png
            これは画像の拡張子が.pngで終わる画像のURLです。
            記載例1: ![画像を表示するアイコン](https://gyazo.com/d40f3a52a2b6b5aa14ba708ca4bea1f8.png)
            表示例1: 画像を表示するアイコン
            記載例2:![](https://gyazo.com/d40f3a52a2b6b5aa14ba708ca4bea1f8.png)
            表示例2:
            記載例3タイトルあり:![](https://gyazo.com/d40f3a52a2b6b5aa14ba708ca4bea1f8.png "これは画像を表示するアイコンです。")
            表示例3:

          4. 0_1507375109321_全画面モードアイコン.png 全画面編集モード
            クリックすると全画面表示になります。
            再度クリックすると元の大きさのウィンドウサイズに戻ります。

          5. 0_1507375220057_絵文字アイコン.png 絵文字アイコン。
            クリックすると絵文字の一覧ウィンドウが開くので一覧から選んでクリックするとその場所に絵文字が表示されます。

          6. 0_1507375773356_画像をアップロードアイコン.png
            画像アップロードアイコン。
            クリックするとPCに保存してある画像を選択して画像をフォーラムのサーバ上にアップロードするとともに、画像を表示するツールバーを使ったように画像を即座に表示してくれます。


    1. 0_1507377808521_構成アイコン.png 構成 ?ボタン
      クリックすると以下の文章が記載されたウィンドウが開きます。
      |Markdown This forum is powered by Markdown. For full documentation, click here|
      0_1507636216952_マークダウン説明ウィンドウ.JPG
      フォーラムではマークダウン記法を使っているようで、使い方の説明ページを見ることができます。
      説明ページ (http://commonmark.org/help/)

    1. スレッドの本文入力欄
      ここに書いたものが⑳のプレビュー画面に表示されます。
      マークダウン記法で書いたものはHTML文に変換されて表示されます。

    2. タグ入力欄
      必ずつけなくてはならないということではなく、タグ入力欄は空欄でもOK
      タグ一覧から検索しやすいようにスレッドに相応しいタグをつけることができます。(タグをつけることの上限は不明、4つまでは確認済み)Twitterのハッシュタグみたいな感じ?#ハッシュタグって
      慣例的なのかハッシュ「#」をタグに含めたりはしないようです。

      入力欄の説明の文字が「ここにタグを入力します。一つのタグが3か」で途切れて見えませんが、説明文の全文はこう書かれています。
      ここにタグを入力します。一つのタグが3から15までの文字にして下さい。
      つまり任意の文字列で最低3文字以上、最大15文字以内のタグを複数、付与可能。

      0_1507378934648_ここにタグを入力しますinspector.JPG
      複数のタグを設定するときは半角のカンマ「,」でタグを区切ってください。
      左右矢印キー(カーソルキー)でタグの移動ができるようです。

      タグの入力方法が特殊:
      1)タグを追加する際タグのすぐ後ろ側に新たなタグを入力するために先に区切りのカンマを入力しようとしても入力できません。
      2)最初にタグを入力してから、タグの文頭に半角のカンマを入力するとタグとして認識される。
      0_1507380056570_タグ入力中.JPG

    3. カテゴリ変更ウィンドウ
      スレッドを投稿するカテゴリを変更できるようです(未確認)

    4. 破棄する
      書いているスレッドの投稿を中断し破棄します。

    5. 保存する
      スレッドをサーバに保存(投稿)するボタン。
      0_1507380604094_vik01348.png ボタンの方がわかり易い気はする。


    1. 0_1507380758991_vik01349.png プレビュー非表示ボタン
      プレビューウィンドウを閉じて、編集ウィンドウだけを表示するモードを開く。
      編集ウィンドウだけを表示しているときは、
      ボタン名が「プレビュー表示」に変わりクリックすると通常の表示に戻る。

    1. プレビューウィンドウ
      ⑭の編集ウィンドウで編集した結果を表示します。
    2. 最小化ボタンかな?
      クリックすると編集ウィンドウが消えてフォーラムをあちこち見て回れます。
      画面右下には このボタンがあるのでクリックすると編集ウィンドウが再度表示されます。
      書いてる途中に「新規スレッド」ボタンを押したらどうなるのか?知りたい欲求に駆られますが自重します。
      これ書きあげるのに数時間かかってるので...:astonished:
      操作ミスやクラッシュしたときの保険でメモ帳にコピペしてはいますけど。

    マークダウン記法 補足(蛇足?)説明

    引用文

    引用文(blockquote)の開始には半角の>を使います

    引用文、引用文
    引用文は入れ子にすることもできます。
    引用文を入れ子にする時は重ねたい階層分>>>>を連ねて書きます。
    深い階層はまとめられ▼や▲ボタンが付くのでクリックすると展開、折りたたみができます。

    • Fruit
      果物
    • Apple
      りんご
    • Orange
      みかん
    • Banana
      ばなな
    • Dairy
      日記
    • Milk
      牛乳

    Headings(見出し)

    行頭に半角の#に続けて半角空白を書くと見出しになります。
    半角の#の数が増えるほど、見出しの文字の大きさが小さくなります。
    ※見出しは1~6まであります。

    マークダウン記法の見出しは
    HTMLの<h1>見出し</h1>~<h6>見出し</h6>に相当します。

    http://www.htmq.com/html5/h.shtml
    ★HTML5タグリファレンス より引用

    数値が小さいほど高いランクの見出しとなります。 
    <h1>が最も高位の> 大見出しで、<h6>が最も低位の小見出しです。 同じ数値のものが複数ある場合には同じランクとなります。
    
    ■使用例1
    HTMLソース
    <h1>見出し1</h1>
    <h2>見出し2</h2>
    <h3>見出し3</h3>
    <h4>見出し4</h4>
    <h5>見出し5</h5>
    <h6>見出し6</h6>
    

    #見出し 1
    ##見出し 2
    ###見出し 3
    ####見出し 4
    #####見出し 5
    ######見出し 6

    見出し 1

    見出し 2

    見出し 3

    見出し 4

    見出し 5
    見出し 6

    ####### 見出し 7
    :point_up_2_tone3: できません。(そういう仕様です・・・)

    文字に色を付けたり フォントサイズを変更したり、

    目次をつけたり、
    といったことはできないみたいだ。

    何か気づいたことがあったらお気軽に追記お願いします。

    質問-雑談掲示板なので何でもあり。。。
    スレッドの記事を再編集(追記)できるとよいのになぁ。
    実は再編集できることを私が知らないだけかもしれないけれど。

    文字数カウント

    とにかく長いです。あまり説明も上手じゃありませんがご容赦を。
    ヒマ人が数時間(半日近く)かけて書いた駄文です。
    0_1507395725933_文字数カウント.png

    そしてここまで閲覧して頂いたあなたに感謝:stuck_out_tongue_winking_eye:
    参考になるサイト

    Qiita マークダウン記法 一覧表・チートシート


  • Moderator

    フォーラムのマニュアルはvivaldiチーム及びモデレーターで準備する方向で動いていますが、進捗状態があまり良くないのが実情です、一般ユーザー様からこういう情報を提供いただけると非常に助かります。

    普通のスレッドのように流れてしまうのは勿体無いのでチームと相談し日本語フォーラムのトップカテゴリーか質問雑談のトップに固定したいと思います。

    スレッドの記事を再編集(追記)できるとよいのになぁ。
    実は再編集できることを私が知らないだけかもしれないけれど。

    編集は返信引用横の︙をクリックして出来ませんでしょうか?
    0_1507496741645_6be4b3b4-f7ae-4f14-8236-5123628e43d3.png


  • Vivaldi Translator

    @zyxwj 様ご教示賜りありがとうございます。
    再編集する機能の提供がされていたのですね。
    今日でVivaldiインストールとコミュニティへの参加5日目で全く気付くに至っておりませんでした。
    誤字脱字の修正ができればと思っていたのでありがたいです。

    文言で変なところが散見されるため見直して修正してみたいと思います。

    公式のフォーラムのマニュアルができる事とその機能(マークダウン記法)のアップグレードができる事を願っています。
    特に欲しいと思える機能としてwiki構文でいうところの#contentsに相当する
    見出しへのリンクを提供する目次機能(ページ内リンク)が欲しいです。
    既に存在するのかもしれませんが見つけることはできませんでした。



  • Vivaldiフォーラム内に
    Vivaldi全般の公式Wikiみたいなページがあると便利かもしれませんね
    日本語ユーザーは活動が活発なので割とすんなり埋まりそうですし。
    埋まれば多言語向けにはそこから翻訳すれば良いのでコミュニティ全体に還元も出来そうです。
    本家ja.wikipedia.orgは削除人が幅を利かせ過ぎて全然項目の細分化出来ませんし。


  • Vivaldi Translator

    @vivaldi53214
    こんにちは。
    Wikiで使ったことはないのですが便利そうだなと思えるものに数年前に見つけて注目していたDokuWikiがあります。
    google+のDokuWikiサイトの基本情報をクリックし翻訳すると以下のようなページになってました。
    0_1507814232361_DokuWikiG+.jpg

    基本情報

    キャッチフレーズ
    シンプルな方が良い
    Shaowuwen
    DokuWikiは、 データベースを必要としない使いやすく、多目的なオープンソースの wiki ソフトウェアです。それは、きれいで読みやすい構文のためにユーザーに愛されています。メンテナンス、バックアップ、統合が容易であるため、管理者にとって非常に便利です。組み込みの アクセスコントロール認証コネクタ により、DokuWikiはエンタープライズ環境で特に便利になり 、活気に満ちたコミュニティによって提供される多数の プラグインが、従来のwikiを超えた幅広いユースケースを可能にします。

    原文

    基本情報
    キャッチフレーズ
    It's better when it's simple
    紹介文
    DokuWiki is a simple to use and highly versatile Open Source wiki software that doesn't require a database. It is loved by users for its clean and readable syntax. The ease of maintenance, backup and integration makes it an administrator's favorite. Built in access controls and authentication connectors make DokuWiki especially useful in the enterprise context and the large number of plugins contributed by its vibrant community allow for a broad range of use cases beyond a traditional wiki.

    DokuWiki公式サイト http://www.dokuwiki.org
    日本語版      https://www.dokuwiki.org/start?id=ja:dokuwiki

    vivaldi.netのサーバーでインストールして使えるようにしてくれないかな。
    使ったことがない理由はインストールする方法を知らないからですけど、メニュー構造などの見た目がすっきりしていて使いやすそうに思える。



  • MediaWikiがいいと思います。
    成功したwikiライクなドキュメントとしてはArchWikiが有名ですけど
    そこでも使われていますし。
    操作感が本家Wikipediaに近いので取っ付きやすいのもいいですよ。


  • Moderator

    Wikiを作って必要な情報を皆さんと拡充していくの、私も賛成ですね…(私からは今のところ具体的なプランはないですが)



Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.