Development Tip

GitHub Wiki (gollum) 저장소에 이미지를 삽입 하시겠습니까?

yourdevel 2020. 10. 8. 19:06
반응형

GitHub Wiki (gollum) 저장소에 이미지를 삽입 하시겠습니까?


Github 위키는 별도의 git 저장소와 기본 프로젝트 저장소에서 지원됩니다.

Github 팀 의이 게시물 은 위키 마크 업 내부의 위키 저장소에 저장된 이미지에 링크 할 수 있어야하는 것처럼 들립니다.

이미지 및 폴더

이제 Git 저장소 내에서 호스팅되는 이미지를 참조 할 수 있습니다.

내 위키의 저장소를 확인하고 리소스 폴더와 이미지를 여기에 푸시했습니다. 제 질문은 이 이미지를 어떻게 사용 합니까?

이것이 가능하거나 내가 뭔가를 오해 했습니까?


상대 경로를 사용하려면 다음을 수행하십시오.

[[foo.jpg]]

자세한 내용 은 이미지에 대한 데모 위키 페이지를 참조하세요 .


github wiki에서 이미지를보고자하는 시청자를 위해 다음과 같은 방법을 찾았습니다.

  • 저장소의 wiki 페이지에있는 "Git Access"탭으로 이동하여 다음과 같은 SSH 경로를 검색하십시오. git@github.com : USER / REPO.wiki.git 여기서 USER는 계정 이름이고 REPO는 저장소 이름.
  • 로컬 컴퓨터에서 선택한 로컬 디렉토리로 cd하고 다음을 통해 저장소를 가져 오려는 Git 명령 줄 도구를 사용합니다.

    git clone git@github.com : USER / REPO.wiki.git

  • 이제이 저장소에서 이미지 디렉토리를 만들고 "이미지"라고 부르고 원하는 이미지를 디렉토리에 넣습니다.

  • 그런 다음 wiki git 디렉토리를 github에 푸시하십시오.
  • "페이지"탭에서 이미지를 물리적으로 볼 수는 없지만 로컬 링크에서 이미지를 참조하면 이미지를 볼 수 있습니다. 아래 마크 다운이있는 예 :

    ![Alt attribute text Here](images/YOURIMAGE.ext)

  • 다음과 같이 추가로 래핑하여 이미지를 링크 자체로 포함 할 수도 있습니다.

    [![Alt attribute text Here](images/YOURIMAGE.ext)](http://Yoursite.com)

"페이지"탭에 단순히 나열되기 때문에 위키를 구성하는 데 도움이되도록 로컬 사본 내에 하위 디렉토리를 추가 할 수도 있습니다. 그러나 새 디렉토리가 푸시 되더라도 "페이지"탭에는 디렉토리가 나열되지 않습니다.


에 이미지를 추가 할 때 어떤 답변도 작동하지 않는 것 같습니다 readme.md. 그래도 해결책이 있습니다.

이미지의 URL이 다음과 같은 경우 :

https://github.com/Username/Repository-Name/blob/master/Directory-Inside-Repository/image.png

교체 blob로하는 것은 raw당신에게 원시 이미지의 URL을 제공합니다 :

https://github.com/Username/Repository-Name/raw/master/Directory-Inside-Repository/image.png

이제 일반 마크 다운을 사용하여 이미지를 삽입합니다.

![Image Alt](https://github.com/Username/Repository-Name/raw/master/Directory-Inside-Repository/image.png)

업데이트 : 현재 GitHub는 다른 하위 도메인의 원시 이미지도 제공합니다 raw.github.com. 따라서 다음을 사용할 수도 있습니다.

https://raw.github.com/Username/Repository-Name/master/Directory-Inside-Repository/image.png

예: https://raw.github.com/Automattic/liveblog/master/screenshot-1.png


상대 경로는 다음과 같이 작동합니다.

위키의 홈페이지 :

![text](wiki/images/someimage.png)

위키의 하위 페이지 :

![text](images/someimage.png)

미리보기를 할 때 이미지가 표시되지 않고 저장했습니다.


드래그 앤 드롭으로 이미지를 빠르게 업로드하려면 다음을 수행 할 수 있습니다 (해킹이지만).

더미 문제를 만듭니다. 이미지를 거기에 끌어다 놓습니다. 업로드 된 마크 다운 이미지 코드를 위키에 복사 / 붙여 넣기

이슈를 한 번 생성 한 후에는 여러 번 사용하여이를 수행 할 수 있습니다.

이것이 이미지가 저장소에 상주 할 필요없이 빠른 수정을 찾는 사람에게 도움이되기를 바랍니다.


이를위한 실용적인 방법은 다음과 같습니다.

  • github의 문제로 이동
  • 댓글 섹션에서 파일을 첨부하고 드래그 / 드롭, 이미지 선택 또는 붙여 넣기 만 할 수 있습니다.
  • 텍스트 영역에 표시된 코드 / 링크 복사
  • 위키에 붙여 넣기
  • 이익!

@tiby 솔루션에 비해 이슈를 생성하거나 수정할 필요조차 없습니다!


그것을 알아 냈습니다.

URL의 형식은 다음과 같습니다.

https://raw.github.com/wiki/username/project/pathtoimage/imagename.extension

pathtoimage is optional


James' URL format did not work for me, perhaps it has been changed. I have used:

https://github.com/username/project/wiki/pathtoimage/image.extension

Where pathtoimage is optional.


Finally got the images into repository using the method described by nerdwin and got them to display in the wiki using ![test](test.jpg)


The following markdown will reference an image in your GitHub repo from within your corresponding GitHub wiki

![My Alt Text](../blob/master/Path/ToAsset/In/Repo.png?raw=true)

The above example assumes that you have the following file structure in your repo

  • Path
    • ToAssets
      • In
        • Repo.png

For a real world example, if I wanted to reference this image in github from the corresponding wiki, I'd use this markdown

![Azure App Settings](../blob/master/TrelloWorld/TrelloWorld.Server/Assets/Azure_AppSettings.png?raw=true)

Caveats

  1. Case matters
  2. If you are on the special Home page of the wiki, you do not need to go up a level with the ../ In my example above, the correct link would be

For Home Page:

![Azure App Settings](blob/master/TrelloWorld/TrelloWorld.Server/Assets/Azure_AppSettings.png?raw=true)

Use the relative path

the Wiki is located at [repositoryname]/wiki

The files in the repository are located at [repositoryname]/raw/master/[file path in repository]

So just use the relative path: ../raw/master/[file path in repository]


I put both images and PDFs in my wikis. I clone the wiki and add an images and a files directory, then use the following markdown to embed image links and add file links:

Images:

[[/images/path/to/image.ext|ALT TEXT]]

The leading slash isn't necessary if your wiki pages are all at the root level, but I use subdirectories and an absolute path resolves correctly and keeps things simple.

Files:

[link text](files/path/to/file.ext "ALT TEXT")

Note, no leading slash for the wiki files path to resolve correctly as a link in this format.

I documented this with more detail in a GitHub gist


To embed an external image thumbnail, use the following, ![Image](<external link to the image>)


The comment from @Drew Noakes to the original question did it for me:

The syntax for the image I wanted to be displayed:

[[/images/imageName.png]]

This image was only displayed when renaming:

wikiPage.md --> wikiPage.wiki

The following folder structure was used in the wiki repository:

repository.wiki
   |--wikiPage.wiki
   |--images
        |--imageName.png       

BUT:

The syntax in .wiki differs from .md files.

참고URL : https://stackoverflow.com/questions/10045517/embedding-images-inside-a-github-wiki-gollum-repository

반응형