최근에 GitHub에 가입했습니다 . 나는 거기에 몇 가지 프로젝트를 주최했습니다.

README 파일에 일부 이미지를 포함시켜야합니다. 어떻게해야할지 모르겠습니다.

이것에 대해 검색했지만 "웹에서 이미지를 호스팅하고 README.md 파일에 이미지 경로를 지정하십시오"라는 링크가 있습니다.

타사 웹 호스팅 서비스에서 이미지를 호스팅하지 않고이 작업을 수행 할 수있는 방법이 있습니까?

이 마크 다운을 시도하십시오.

![alt text](http://url/to/img.png)

이미지가 저장소에 저장된 경우 원시 버전의 이미지에 직접 연결할 수 있다고 생각합니다. 즉

![alt text](https://github.com/[username]/[reponame]/blob/[branch]/image.jpg?raw=true)

다음과 같은 상대 경로를 사용할 수도 있습니다

![Alt text](relative/path/to/img.jpg?raw=true "Title")

• 새로운 이슈를 만들 수 있습니다
• 이미지를 업로드 (드래그 앤 드롭)
• 이미지 URL을 복사하여 README.md 파일에 붙여 넣습니다.

여기에 자세한 youTube 비디오가 자세히 설명되어 있습니다.

https://www.youtube.com/watch?v=nvPOUdz5PL4

그것보다 훨씬 간단합니다.

이미지를 저장소 루트에 업로드하고 경로없이 파일 이름에 링크하십시오.

![Screenshot](screenshot.png)

간단한 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은 체인에 다른 도구를 추가합니다. Meh.
• 이슈 트래커에서 더미 이슈를 생성하는 것은 해킹입니다. 혼란을 야기하고 사용자를 혼란스럽게합니다. 이 솔루션을 포크 또는 GitHub로 마이그레이션하는 것은 고통입니다.
• gh-pages 분기를 사용하면 URL이 부서지기 쉽습니다. gh-page를 유지 관리하는 프로젝트를 진행하는 다른 사람은 이러한 이미지의 경로에 따라 외부적인 것을 알지 못할 수 있습니다. gh-pages 브랜치는 GitHub에서 CDN 이미지를 호스팅하는 데 필요하지 않은 특정 동작을 가지고 있습니다.
• 버전 관리에서 자산을 추적하는 것이 좋습니다. 프로젝트가 성장하고 변경되면 여러 사용자의 변경 사항을 관리하고 추적 할 수있는보다 지속 가능한 방법입니다.
• 이미지가 소프트웨어의 특정 버전에 적용되는 경우 변경 불가능한 이미지를 연결하는 것이 좋습니다. 이렇게하면 나중에 소프트웨어의 변경 사항을 반영하여 이미지를 업데이트하면 해당 개정의 추가 정보를 읽는 사람이 올바른 이미지를 찾을 수 있습니다.

영감 나의 선호하는 솔루션, 이 요점은 , 사용하는 것입니다 자산 분기를 함께 특정 개정에 대한 영구 링크 .

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 optional, you'll see below.

이 이미지 개정판에 대한 "퍼머 링크"를 구성하고 마크 다운으로 래핑하십시오.

커밋 SHA를 직접 찾는 것은 불편하지만, 이 help.github 페이지 에서 알 수 있듯이 바로 가기로 Y를 눌러 특정 커밋에서 파일에 대한 영구 링크를 누르십시오 .

자산 분기에 항상 최신 이미지를 표시하려면 BLOB URL을 사용하십시오.

https://github.com/github/{repository}/blob/assets/cat.png 

(동일한 GitHub 도움말 페이지에서 파일보기는 지점의 최신 버전을 보여줍니다 )

폴더 ( myFolder )에 이미지 ( image.png )를 커밋 하고 README.md에 다음 줄을 추가하십시오 .

![Optional Text](../master/myFolder/image.png)

• 이미지 추가와 관련된 문제 만들기
• 끌어서 놓기 또는 파일 선택기로 이미지 추가

• 그런 다음 이미지 소스를 복사하십시오.

• 이제 ![alt tag](http://url/to/img.png)README.md 파일에 추가 하십시오

끝난!

또는 일부 이미지 호스팅 사이트를 사용하여 imgurURL을 가져 와서 README.md 파일에 추가하거나 정적 파일 호스팅을 사용할 수도 있습니다.

샘플 문제

README 파일에 일부 이미지를 포함시켜야합니다. 어떻게해야할지 모르겠습니다.

GitHub 리포지토리의 readme에 대한 간단한 이미지 갤러리를 만들고 사용자 지정할 수있는 작은 마법사를 만들었습니다 . ReadmeGalleryCreatorForGitHub를 참조하십시오 .

마법사는 GitHub에서 img 태그가에서 허용된다는 사실을 이용합니다 README.md. 또한 마법사는 이미지를 이슈 영역에 끌어다 놓아 GitHub에 이미지를 업로드하는 인기있는 트릭을 사용합니다 (이 스레드의 답변 중 하나에서 이미 언급 한 바와 같이).

그냥 추가 <img> 저장소를 기준으로 SRC와 README.md에 태그를. 상대 src를 사용하지 않는 경우 서버가 CORS를 지원하는지 확인하십시오.

GitHub가 인라인 HTML을 지원하기 때문에 작동합니다.

<img src="/docs/logo.png" alt="My cool logo"/>
# My cool project and above is the logo of it

여기서 관찰

기본 구문

![myimage-alt-tag](url-to-image)

여기:

1. my-image-alt-tag : 이미지가 표시되지 않은 경우 표시되는 텍스트입니다.
2. url-to-image : 이미지 리소스가 무엇이든간에. 이미지의 URI

예:

![stack Overflow](http://lmsotfy.com/so.png)

이것은 다음과 같습니다 :

테이블을 사용하여 눈에 띄면 별도의 매력이 생깁니다.

테이블 구문은 다음과 같습니다.

각 열 셀을 기호로 구분 |

테이블 헤더 (첫 번째 행) x 두 번째 행 ---

| 열 1 | 열 2 |
| ------------ | ------------- |
| 이미지 1 | 이미지 2 |

산출

이제 <img src="url/relativePath">두 개의 이미지를 사용하는 경우 이미지 1과 이미지 2를 넣으십시오 .

참고 : 여러 이미지를 사용하는 경우 열이 더 포함 된 경우 width 및 height 속성을 사용하여 읽을 수있게 만들 수 있습니다.

예

| 열 1 | 열 2 |
| ------------ | ------------- |
| <img src="https://media.wired.com/photos/5926db217034dc5f91becd6b/master/w_582,c_limit/so-logo-s.jpg" width="250"> | <img src="https://mk0jobadderjftub56m0.kinstacdn.com/wp-content/uploads/stackoverflow.com-300.jpg" width="250">|

간격은 중요하지 않습니다

출력 이미지

도움 : adam-p

당신은 할 수 있습니다 :

git checkout --orphan assets
cp /where/image/currently/located/on/machine/diagram.png .
git add .
git commit -m 'Added diagram'
git push -u origin assets

그런 다음 README파일 에서 다음 과 같이 참조 할 수 있습니다 .

![diagram](diagram.png)

제 경우에는 imgur 를 사용하고 이런 식으로 직접 링크를 사용합니다.

![img](http://i.imgur.com/yourfilename.png)

대체 github CDN 링크를 사용하여 README.md (또는 외부)에서 프로젝트의 이미지에 링크 할 수 있습니다.

URL은 다음과 같습니다.

https://cdn.rawgit.com/<USER>/<REPO>/<BRANCH>/<PATH>/<TO>/<FILE>

내 프로젝트에 SVG 이미지가 있고 Python 프로젝트 문서에서 SVG 이미지를 참조하면 렌더링되지 않습니다.

프로젝트 링크

파일에 대한 프로젝트 링크는 다음과 같습니다 (이미지로 렌더링되지 않음).

https://github.com/jongracecox/anybadge/blob/master/examples/awesomeness.svg

임베드 된 이미지 예 :

원시 링크

파일에 대한 RAW 링크는 다음과 같습니다 (여전히 이미지로 렌더링되지는 않음).

https://raw.githubusercontent.com/jongracecox/anybadge/master/examples/awesomeness.svg

임베드 된 이미지 예 :

CDN 링크

CDN 링크를 사용하여 (렌더러를 이미지로 사용)을 사용하여 파일에 연결할 수 있습니다.

https://cdn.rawgit.com/jongracecox/anybadge/master/examples/awesomeness.svg

임베드 된 이미지 예 :

이것은 내 README.md파일과 PyPi 프로젝트에서 reStructredText 문서화 ( here ) 에서 프로젝트의 이미지를 사용하는 방법입니다.

이 문제를 해결했습니다. 다른 사람의 readme 파일 만 참조하면됩니다.

먼저 이미지 파일을 github 코드 라이브러리에 업로드해야합니다! 그런 다음 이미지 파일의 주소를 직접 참조하십시오.

나는 일반적으로 사이트에서 이미지를 호스팅합니다. 이것은 모든 호스팅 이미지에 연결할 수 있습니다. readme에서 이것을 던지기. .rst확실하지 않은 파일 작업.md

.. image:: https://url/path/to/image
   :height: 100px
   :width: 200 px
   :scale: 50 %

제 경우에는 인쇄 화면을 표시하고 싶었 Github습니다 NPM. 상대 경로를 사용하여에서 작업했지만 Github외부에서 작동하지 않았습니다. 기본적으로 프로젝트를 밀어 넣더라도 NPM(단순히 같은를 사용 readme.md하더라도) 이미지가 표시되지 않았습니다.

나는 몇 가지 방법을 시도했지만 결국 이것은 나를 위해 일한 것입니다.

![Preview](https://raw.githubusercontent.com/username/project/master/image-path/image.png)

이제 NPM패키지를 게시 할 수있는 다른 곳이나 이미지가 올바르게 표시 됩니다.

문서화를 위해 그림을 업로드해야하는 경우 git-lfs 를 사용하는 것이 좋습니다 . git-lfs를 설치했다고 가정하면 다음 단계를 따르십시오.

1. 각 이미지 유형에 대해 git lf를 초기화하십시오.

   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 add doc
   

3. 이미지를 doc 폴더에 붙여 넣습니다. 그런 다음 git add명령을 통해 추가하십시오 .

4. 커밋하고 푸시하십시오.

5. 이미지는 다음 URL에서 공개적으로 사용할 수 있습니다.

   https://media.githubusercontent.com/media/ ^ github_username ^ / ^ repo ^ / ^ branch ^ / ^ 이미지의 위치

여기서 * ^github_username^는 github의 사용자 이름입니다 (프로필 페이지에서 찾을 수 있습니다). * ^repo_name^는 저장소 이름입니다. *^branch^ 이미지가 업로드되는 리포지토리 분기입니다. * ^image_location in the repo^이미지가 저장된 폴더를 포함한 위치입니다.

또한 이미지를 먼저 업로드 한 다음 프로젝트 github 페이지의 위치를 ​​방문하고 이미지를 찾을 때까지 탐색 한 다음 download 버튼을 누른 다음 브라우저의 주소 표시 줄에서 URL을 복사하여 붙여 넣을 수 있습니다.

보기 이 참고로 내 프로젝트에서.

그런 다음 URL을 사용하여 위에서 언급 한 마크 다운 구문을 사용하여 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)

그냥 작동합니다 !!

파일 이름 대문자를 태그로 처리하고 PNG 파일을 루트에 넣고 경로없이 파일 이름으로 연결하십시오.

![Screenshot](screenshot.png)

이미 수락 된 답변에 예제를 확장하거나 추가하고 있습니다.

Github 저장소에 이미지를 넣으면

그때:

• 브라우저에서 해당 Github 저장소를 엽니 다.
• 대상 이미지 파일로 이동 한 다음 새 탭에서 이미지를 엽니 다.
• URL을 복사
• 마지막으로 다음 패턴에 URL을 삽입하십시오. ![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)

내 경우에는

![In a single picture](https://raw.githubusercontent.com/shadmazumder/Xcode/master/InOnePicture.png)

어디

• shadmazumder 나의 username
• Xcode 입니다 projectname
• master 입니다 branch
• InOnePicture.png는 IS image내 경우에, InOnePicture.png루트 디렉토리에 있습니다.

이 작업을 수행 할 수있는 두 가지 간단한 방법이 있습니다.

1) HTML img 태그를 사용하십시오.

2)! [] (이미지가 저장되는 경로 /image-name.png)

해당 이미지를 연 상태에서 브라우저의 URL에서 복사 할 수있는 경로입니다. 간격에 문제가있을 수 있으므로 경로의 두 단어 또는 이미지 이름 add-> % 20에 공백이 있는지 확인하십시오. 브라우저처럼.

둘 다 작동합니다. 더 많은 것을 이해하려면 내 github을 확인할 수 있습니다-> https://github.com/adityarawat29

이 답변은 https://github.com/YourUserAccount/YourProject/blob/master/DirectoryPath/ReadMe.md 에서도 찾을 수 있습니다.

다음을 사용하여 저장소에서 이미지를 표시하십시오.

선행 도메인 : https://raw.githubusercontent.com/

플래그 추가 : ?sanitize=true&raw=true

<img />태그 사용

• 도메인 :raw.githubusercontent.com/
• 사용자 이름 :YourUserAccount/
• 레포 :YourProject/
• 지점 :YourBranch/
• 경로 :DirectoryPath/
• 파일명 :example.png

SVG, PNG 및 JPEG에서 작동

 - `raw.githubusercontent.com/YourUserAccount/YourProject/YourBranch/DirectoryPath/svgdemo1.svg?sanitize=true&raw=true`

사용한 후 아래에 표시되는 실제 예제 코드 :

**raw.githubusercontent.com**:
<img src="https://raw.githubusercontent.com/YourUserAccount/YourProject/master/DirectoryPath/Example.png?raw=true" />

<img src="https://raw.githubusercontent.com/YourUserAccount/YourProject/master/DirectoryPath/svgdemo1.svg?sanitize=true&raw=true" />

raw.githubusercontent.com :

감사합니다 : - https://stackoverflow.com/a/48723190/1815624 - https://github.com/potherca-blog/StackOverflow/edit/master/question.13808020.include-an-svg-hosted-on-github -in-markdown / readme.md

나는 다른 해결책을 찾았지만 상당히 다르다. 나는 그것을 설명 할 것이다.

기본적으로 태그를 사용하여 이미지를 표시했지만 이미지를 클릭했을 때 다른 페이지로 가고 싶었고 여기에 내가 한 방법이 있습니다.

<a href="the-url-you-want-to-go-when-image-is-clicked.com" />
<img src="image-source-url-location.com" />

새 줄로 구분하여 서로 바로 옆에 넣으면 이미지를 클릭하면 리디렉션하려는 다른 사이트로 href가있는 태그로 이동합니다.

최근

위키는 PNG, JPEG 또는 GIF 이미지를 표시 할 수 있습니다

이제 다음을 사용할 수 있습니다.

[[https://github.com/username/repository/blob/master/img/octocat.png|alt=octocat]]

-또는-

이 단계를 따르세요:

1. GitHub에서 저장소의 메인 페이지로 이동하십시오.

2. 저장소 이름 아래에서 Wiki를 클릭하십시오.

3. Wiki 사이드 바를 사용하여 변경하려는 페이지로 이동 한 다음 편집을 클릭하십시오.

4. 위키 도구 모음에서 이미지를 클릭하십시오 .

5. "이미지 삽입"대화 상자에서 이미지 URL과 대체 텍스트 (검색 엔진 및 화면 판독기에서 사용)를 입력하십시오.
6. 확인을 클릭하십시오.

문서를 참조하십시오 .

table여러 스크린 샷을 추가 하는 경우 다음과 같이 접근성을 향상시키기 위해 테이블 ​​형식의 데이터를 사용하여 정렬하려는 경우를 사용하십시오.

마크 다운 파서가이를 지원하는 경우 role="presentation"WIA-ARIA 속성을 TABLE 요소에 추가하고 th태그를 생략 할 수도 있습니다 .

단계별 프로세스, 먼저 폴더를 만들고 (폴더 이름) Readme.md 파일에 업로드 할 이미지 / 이미지를 추가하십시오. (프로젝트의 기존 폴더에 이미지 / 이미지를 추가 할 수도 있습니다.) 이제 Readme.md 파일의 편집 아이콘을 클릭 한 다음

![](relative url where images is located/refrence_image.png)  // refrence_image is the name of image in my case.

이미지를 추가 한 후 '변경 사항 미리보기'탭에서 변경 사항 미리보기를 볼 수 있습니다. 여기에서 이미지를 찾을 수 있습니다. 예를 들어, 내 경우에는

![](app/src/main/res/drawable/refrence_image.png)

응용 프로그램 폴더-> src 폴더-> 기본 폴더-> res 폴더-> 드로어 블 폴더-> 및 드로어 블 폴더 안에 refrence_image.png 파일이 있습니다. 여러 이미지를 추가하려면 다음과 같이하십시오.

![](app/src/main/res/drawable/refrence_image1.png)
![](app/src/main/res/drawable/refrence_image2.png)
![](app/src/main/res/drawable/refrence_image3.png)

참고 1-이미지 파일 이름에 공백이 없어야합니다. 공백이 있으면 파일 이름 사이에 각 공백에 대해 % 20을 추가해야합니다. 공백을 제거하는 것이 좋습니다.

참고 2-HTML 태그를 사용하여 이미지 크기를 조정하거나 다른 방법이있을 수도 있습니다. 당신은 더 많은 구글 그것을 할 수 있습니다. 필요한 경우.

그런 다음 커밋 변경 메시지를 작성한 다음 변경 사항을 커밋하십시오.

그것을하고, 문제를 만드는 등의 다른 많은 해킹이 있습니다. 지금까지 내가 만난 가장 좋은 방법입니다.

우리는 이것을 간단히 할 수 있습니다.

• GitHub에서 새로운 이슈 만들기
• div이슈 본문 에 이미지 드래그 앤 드롭

몇 초 후에 링크가 생성됩니다. 이제 링크 또는 이미지 URL을 복사하여 지원되는 플랫폼에서 사용하십시오.

파일 업로드 옵션에서 저장소에 이미지를 추가 한 다음 README 파일에 이미지 추가

![Alt text]("enter repository image URL here") 

내가 언급하지 않은 또 다른 옵션이 있습니다. 사용자 또는 조직 아래에 "자산"이라는 다른 리포지토리를 만들 수 있습니다. 이미지를이 리포지토리로 푸시하고 다른 리포지토리에서 참조하십시오.

![alt text](https://raw.githubusercontent.com/my-org/assets/master/folder/logo.png)

나는 내 repos 중 하나 에서이 작업을 수행했으며 나에게 적합합니다. 코드와는 독립적으로 모든 프로젝트의 README 이미지를 버전 관리 할 수 ​​있지만 여전히 한 곳에 보관하십시오 . 이슈 나 브랜치 또는 기타 쉽게 놓칠 수있는 인공물이 필요하지 않습니다.