最近、私は GitHub に参加しました。そこでいくつかのプロジェクトをホストしています。
READMEファイルにいくつかの画像を含める必要があります。私はそれを行う方法を知りません。
このことについて検索しましたが、私が得たのは、「ウェブ上で画像をホストし、README.mdファイルに画像のパスを指定する」というリンクだけでした。
サードパーティのウェブホスティングサービスに画像をホスティングせずにこれを行う方法はありますか?
このマークダウンを試してみてください:
![alt text](http://url/to/img.png)
リポジトリに保存されている画像であれば、raw版への直接リンクが可能だと思います。
![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)
**gh-pagesの使用を示唆する記事へのリンクがあることに気づきました。また、相対リンクは、私が上に投稿した絶対URLよりも良いアイデアである可能性があります。
この方法については、YouTubeの動画で詳しく説明されています:
単純な HTMLタグ:で画像を追加することもできます。
<p align="center">
<img src="your_relative_path_here" width="350" title="hover text">
<img src="your_relative_path_here_number_2_large_name" width="350" alt="accessibility text">
</p>
投稿されたソリューションの多くは不完全であるか、私の好みではありません。
-imgurのような外部CDNは、チェーンに別のツールを追加します。 ええ。 -問題トラッカーでダミーの問題を作成することはハックです。 乱雑になり、ユーザーを混乱させます。 このソリューションをフォークに移動したり、GitHubから移動したりするのは大変です。 -gh-pagesブランチを使用すると、URLがもろくなります。 ghページを維持するプロジェクトに取り組んでいる別の人は、これらの画像へのパスに外部が依存していることを知らない場合があります。 gh-pagesブランチは、GitHubでCDNイメージをホストするために必要ではない特定の動作を持っています。 -バージョン管理で資産を追跡することは良いことです。 プロジェクトが成長し、変化するにつれて、複数のユーザーによる変化を管理および追跡するためのより持続可能な方法です。 -画像がソフトウェアの特定のリビジョンに適用される場合、不変の画像をリンクすることが望ましい場合があります。 このようにして、後でソフトウェアへの変更を反映するように画像が更新されると、そのリビジョンのreadmeを読んでいる人は誰でも正しい画像を見つけるでしょう。
この要点に触発された私の推奨ソリューションは、 assetsブランチと特定のリビジョンへのパーマリンクを使用することです。
git checkout --orphan assets
git reset --hard
cp /path/to/cat.png .
git add .
git commit -m 'Added cat picture'
git push -u origin assets
git rev-parse HEAD # Print the SHA, which is needed below.
画像のこのリビジョンに「パーマリンク」を作成し、Markdown:でラップします。
。![Cat](https://raw.githubusercontent.com/{user}/{repo}/{sha}/cat.png)
。
例えば.
。![Cat](https://raw.githubusercontent.com/paulmelnikow/zsh-startup-timer/3923c60fc66d4223ccf063d169ccf2ff167b1270/cat.png)
。
資産ブランチの最新の画像を常に表示するには、sha:の代わりに「資産」を使用します。
。![Cat](https://raw.githubusercontent.com/{user}/{repo}/assets/cat.png)
。
リポジトリに相対srcを使用して、README.mdに < img>
タグを追加するだけです。 相対srcを使用していない場合は、サーバーがCORSをサポートしていることを確認してください。
GitHubがinline-htmlをサポートしているため、機能します。
<img src="/docs/logo.png" alt="My cool logo"/>
# My cool project and above is the logo of it
ここを観察します。
READMEファイルにいくつかの画像を含める必要があります。 方法がわかりません。 それを行う。
GitHubリポジトリのreadme用にシンプルな画像ギャラリーを作成およびカスタマイズできる小さなウィザードを作成しました。ReadmeGalleryCreatorForGitHubを参照してください。
ウィザードは、GitHubがimgタグを README.md
で発生させるという事実を利用しています。 また、ウィザードは、問題領域に画像をドラッグアンドドロップしてGitHubに画像をアップロードする一般的なトリックを利用します(このスレッドの回答の1つですでに述べたように)。
。。
テーブルを使用して目立つようにすると、別の魅力が得られます。
テーブル構文は次のとおりです。
各カラムセルを記号「|」で区切ります。
2行目のテーブルヘッダー(最初の行)は ---
です。
| col 1& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp; & nbsp; & nbsp; & nbsp ;
| ------------- | -------------- |< / br>
|画像1 |画像2 |< / br> 。
出力。
。。
次に、2つの画像を使用している場合は、画像1と画像2に < img src = "url / relativePath">
を置きます< / br>。
注:複数の画像を使用する場合は、列を含めるだけで、widthおよびheight属性を使用して読みやすくすることができます。< / br>。
例。
| col 1& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp; & nbsp;& nbsp; & nbsp; & nbsp;
| ------------- | -------------- |< / br>
< img src = "https://media.wired.com/photos/5926db217034dc5f91becd6b/master/w_582、c_limit/so-logo-s.jpg" width = " 250 ">
< / br>。
間隔は関係ありません。
出力画像。
。。
助け:adam-p。
代替github CDNリンクを使用して、README.mdから(または外部に)プロジェクト内の画像にリンクできます。
URLは次のようになります。
https://cdn.rawgit.com/<USER>/<REPO>/<BRANCH>/<path>/<TO>/<FILE>
私のプロジェクトにはSVG画像があり、Pythonプロジェクトのドキュメントで参照すると、レンダリングされません。
以下は、ファイルへのプロジェクトリンクです(画像としてレンダリングされません)。
https://github.com/jongracecox/anybadge/blob/master/examples/awesomeness.svg。
埋め込み画像の例: 。
以下は、ファイルへのRAWリンクです(まだ画像としてレンダリングされません)。
https://raw.githubusercontent.com/jongracecox/anybadge/master/examples/awesomeness.svg。
埋め込み画像の例: 。
CDNリンクを使用して、(画像としてレンダリング)を使用してファイルにリンクできます。
https://cdn.rawgit.com/jongracecox/anybadge/master/examples/awesomeness.svg。
埋め込み画像の例: 。
これは、プロジェクトからの画像を「README.md」ファイルと、PyPiプロジェクトreStructredText doucmentation(hereの両方で使用できる方法です?name = anybadge& version = 1.2.0rc4&:action = display))。
ドキュメント用にいくつかの画像をアップロードする必要がある場合は、git-lfsを使用することをお勧めします。 git-lfsをインストールしたと仮定すると、次の手順に従います。
1。 各画像タイプのgit lfsを初期化します。
git lfs * .png。
git lfs * .svg。
git lfs * .gif。
git lfs * .jpg。
git lfs * .jpeg。
2。 画像の場所として使用されるフォルダを作成します。 doc
。 GNU / LinuxおよびUnixベースのシステムでは、これは次の方法で実行できます。
cd project_folder。
mkdir doc。
git docを追加します。
3。 画像をコピーしてドキュメントフォルダーに貼り付けます。 その後、 git add
コマンドで追加します。
4。 コミットしてプッシュします。
5。 画像は次のURLで公開されています。
https://media.githubusercontent.com/media/^github_username ^/ ^ repo ^ / ^ branch ^ / ^ image_location in repo ^。
どこ:
^ github_username ^
はgithubのユーザー名です(プロファイルページにあります)。^ repo_name ^
はリポジトリ名です。^ branch ^
は、画像がアップロードされるリポジトリブランチです。^ repo ^
のimage_locationは、画像が格納されているフォルダーを含む場所です。また、最初に画像をアップロードして、プロジェクトのgithubページの場所にアクセスし、画像が見つかるまでナビゲートしてから、[ダウンロード]ボタンを押して、ブラウザのアドレスバーからURLをコピーして貼り付けることができます。
参照としてプロジェクトからthisを見てください。
次に、urlを使用して、上記のマークダウン構文を使用してそれらを含めることができます。
![some alternate text that describes the image](^github generated url from git lfs^)
例:この写真を使用するとします。次に、マークダウンを使用できます。構文:
![In what order to compile the files](https://media.githubusercontent.com/media/pc-magas/myFirstEnclave/master/doc/SGX%20Compile%20workflow.png)
私の場合、「Github」だけでなく「NPM」にも印刷画面を表示したかったのです。 相対パスを使用することは「Github」内で機能していましたが、その外では機能していませんでした。 基本的に、プロジェクトを「NPM」にもプッシュしたとしても(同じ「readme.md」を使用するだけで、画像が表示されることはありませんでした。
私はいくつかの方法を試しましたが、最後にこれが私にとってうまくいきました。
。![プレビュー](https://raw.githubusercontent.com/username/project/master/image-path/image.png)
。
これで、「NPM」またはパッケージを公開できる他の場所で画像が正しく表示されました。