Osadzanie obrazów w repozytorium GitHub wiki (gollum)?

84

Strony wiki Github są obsługiwane przez oddzielne repozytorium git, a następnie główne repozytorium projektu.

Ten post autorstwa zespołu Github sprawia, że ​​brzmi to tak, jakbyś mógł linkować do obrazów przechowywanych w repozytorium wiki wewnątrz znaczników wiki.

Obrazy i foldery

Możesz teraz odwoływać się do obrazów hostowanych w repozytorium Git.

Sprawdziłem repozytorium mojej wiki i umieściłem w nim folder zasobów oraz obraz. Moje pytanie brzmi: jak mam użyć tego obrazu ?

Czy to w ogóle możliwe, czy coś źle zrozumiałem?

James McMahon
źródło
Jest github-faq o dodawaniu-obrazów do wiki , ale to nie ma informacje o krótkich względnych adresów URL obrazu omówione tutaj
k3b

Odpowiedzi:

57

Aby użyć ścieżek względnych, wykonaj:

[[foo.jpg]]

Aby uzyskać więcej informacji, zobacz stronę demo wiki na obrazach .

Benjamin Oakes
źródło
Jest to lepsze niż zakodowanie ścieżki. Jedyne, czego nie mogłem wymyślić, to jak utworzyć tekst alternatywny za pomocą tej metody. Aha, i obrazy w tym demo nie ładują się dla mnie.
James McMahon
Jeśli sklonujesz git: //github.com/mojombo/gollum-demo.git, a następnie uruchomisz gollum, zobaczysz je. :)
Benjamin Oakes
4
Może czegoś mi brakuje ... ale [[wiki syntax]]prace na tej wiki, w których pomagam: github.com/newhavenrb/conferences/wiki/WindyCityRails-2012 Być może próbujesz tego z README?
Benjamin Oakes
2
Składnia wiki jest określana przez rozszerzenie pliku. .wikiużywa stylu mediawiki. .mdużywa stylu przecen (odpowiedź RyanQ).
Drew Noakes
3
Ta odpowiedź już nie działa, zobacz odpowiedź @ Wernera poniżej (w skrócie, użyj! [Tekst] (images / someimage.png) i zapisz - nie pokaże się w podglądzie)
edmofro
96

Dla widzów, którzy chcą oglądać obrazy na wiki github, znalazłem następującą metodę:

  • Przejdź do zakładki „Git Access” na stronie wiki swojego repozytorium i pobierz ścieżkę SSH, która powinna być podobna do: [email protected]: USER / REPO.wiki.git, gdzie USER to nazwa twojego konta, a REPO to nazwa repozytorium.
  • Na komputerze lokalnym użyj dowolnego narzędzia wiersza poleceń Git, które chcesz przenieść do wybranego katalogu lokalnego i pobierz repozytorium przez

    git clone [email protected]: USER / REPO.wiki.git

  • Teraz w tym repozytorium utwórz katalog obrazów, nazwę go „obrazy” i umieszczę dowolne obrazy w katalogu

  • Następnie prześlij swój katalog wiki git do github
  • Nie będziesz w stanie fizycznie zobaczyć obrazów na przykład na karcie „Strony”, ale jeśli po prostu odwołasz się do obrazów w lokalnym linku, powinieneś być w stanie je zobaczyć. Przykład z Markdown poniżej:

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

  • Możesz także osadzić obraz jako sam link, zawijając go dalej w następujący sposób:

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

Możesz także dodać podkatalogi do swojej lokalnej kopii, aby pomóc w organizowaniu wiki, ponieważ karta „strony” po prostu je wyszczególnia. Pamiętaj jednak, że nawet gdy nowy katalog jest wciśnięty, zakładka „strony” nie wyświetla katalogu.

Ryan Q
źródło
31

Żadna z odpowiedzi nie wydaje się działać podczas dodawania obrazu readme.md. Mam jednak rozwiązanie:

Jeśli adres URL obrazu to:

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

Zastąpienie blobprzez rawdaje adres URL nieprzetworzonego obrazu:

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

Teraz możesz osadzić obraz przy użyciu normalnej przeceny:

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

AKTUALIZACJA: Obecnie GitHub obsługuje również surowe obrazy z innej subdomeny raw.github.com. Możesz więc również użyć:

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

PRZYKŁAD: https://raw.github.com/Automattic/liveblog/master/screenshot-1.png

to ja
źródło
Niesamowite ... to pozwoliło mi na link do obrazu bezpośrednio w komentarzu na GitHub. :) github.com/mccalltd/AttributeRouting/issues/…
Leniel Maccaferri
1
pracował dla mnie dzięki. szkoda, że ​​nie działa ze ścieżkami względnymi
Elvis Ciotti,
26

Względna ścieżka działa dla mnie w ten sposób:

strona główna wiki:

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

podstrona wiki:

![text](images/someimage.png)

Zauważ, że podczas robienia podglądu obraz się nie pokaże, musiałem go zapisać.

Werner
źródło
3
Ta wskazówka autorstwa @Werner jest bardzo ważna. (BARDZO dziękuję!) Z jakiegoś powodu strona domowa twojej wiki różni się od wszystkich innych, więc na stronie domowej potrzebujesz wiki / path / foo.ext, gdzie wszystkie inne strony używają path / foo.ext . Względne odwołania do własnego repozytorium są znacznie lepsze niż odniesienia bezwzględne. Jeśli przeniesiesz lub sklonujesz swój projekt lub zmodyfikujesz go offline, wszystko nadal działa bez względu na to, gdzie znajduje się repozytorium. Zwróć również uwagę, że składnia! [Tekst] (link) jest odpowiednia do większości zastosowań, ale jeśli chcesz wyrównać obraz, musisz użyć standardowego znacznika HTML IMG.
TonyG
Wydaje się, że jest to bardziej aktualna odpowiedź
albfan
Jaka jest tu gałąź?
Jonny
15

Jeśli chcesz szybko przesłać obraz za pomocą przeciągania / upuszczania, możesz wykonać następujące czynności (aczkolwiek hackish):

Utwórz fałszywy problem; przeciągnij i upuść tam swój obraz; skopiuj / wklej przesłany kod obrazu Markdown na swoją wiki;

Po jednokrotnym utworzeniu problemu możesz użyć go w tym celu dowolną liczbę razy.

Mam nadzieję, że pomoże to każdemu, kto szuka szybkiej naprawy, bez konieczności umieszczania obrazu w repozytorium.

tiby
źródło
8

Oto praktyczny sposób na zrobienie tego:

  • Przejdź do dowolnego problemu na githubie
  • W sekcji komentarzy możesz dołączać pliki, po prostu przeciągnij / upuść, wybierz lub wklej obraz
  • Skopiuj kod / link wyświetlany w polu tekstowym
  • Wklej go na wiki
  • Zysk!

Nie musisz nawet tworzyć ani modyfikować żadnego problemu w porównaniu do rozwiązania @tiby!

Jacob Yiendedoi
źródło
2
Dziękuję Ci! Zastanawiam się, dlaczego github nie obsługuje tej funkcji na swoich stronach wiki.
Sven
2

Na koniec umieściłem obrazy w repozytorium przy użyciu metody opisanej przez nerdwina i wyświetlono je na wiki za pomocą ![test](test.jpg)

rupweb
źródło
1

Poniższe przeceny będą odnosić się do obrazu w repozytorium GitHub z odpowiedniego obszaru wiki GitHub

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

Powyższy przykład zakłada, że ​​w repozytorium masz następującą strukturę plików

  • Ścieżka
    • ToAssets
      • W
        • Repo.png

Dla przykładu z prawdziwego świata, gdybym chciał odwołać się do tego obrazu na githubie z odpowiedniej wiki, użyłbym tej przeceny

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

Ostrzeżenia

  1. Sprawa ma znaczenie
  2. Jeśli jesteś na specjalnej stronie domowej wiki, nie musisz przechodzić na wyższy poziom za pomocą ../ W moim przykładzie powyżej, poprawny link to

Na stronę główną:

![Azure App Settings](blob/master/TrelloWorld/TrelloWorld.Server/Assets/Azure_AppSettings.png?raw=true)
Josh
źródło
Sprawa ma znaczenie. Repo.png to nie to samo, co repo.png
Josh
Jeśli jesteś na stronie głównej wiki, to się nieznacznie zmienia. Musisz upuścić ../. Link miałby postać (blob / master / Path / ToAsset / In / Repo.png? Raw = true)
Josh
Czy gałąź hostowanego obrazu ma znaczenie?
Jonny
Nie próbowałem tego, ale patrząc na adresy URL w mojej próbce, wydaje mi się, że tak. W moich próbkach zakładam, że wszystko jest w porządku. Można przypuszczalnie po prostu zmienić słowo „master” w mojej próbce na dowolną gałąź, w której znajduje się obraz.
Josh,
1

Użyj ścieżki względnej

Wiki znajduje się pod adresem [repositoryname]/wiki

Pliki w repozytorium znajdują się pod adresem [repositoryname]/raw/master/[file path in repository]

Po prostu użyj ścieżki względnej: ../raw/master/[file path in repository]

Samuel P.
źródło
Musiałem to zrobić ../../w podstronie, więc strzeżcie się to w stosunku do bieżącej ścieżki widoku
tutuDajuju
Jeśli nie masz oddziału o nazwie Master?
Jonny
1

Umieszczam zarówno obrazy, jak i pliki PDF na moich wiki. I sklonować wiki i dodać imagesi do fileskatalogu, a następnie kliknąć na poniższy przecen osadzić linków graficznych i linków plików dodatek:

Zdjęcia:

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

Początkowy ukośnik nie jest konieczny, jeśli wszystkie strony wiki znajdują się na poziomie głównym, ale używam podkatalogów, a ścieżka bezwzględna jest poprawnie rozpoznawana i sprawia, że ​​wszystko jest proste.

Akta:

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

Uwaga: brak wiodącego ukośnika w filesścieżce wiki, który byłby poprawnie rozpoznawany jako łącze w tym formacie.

Udokumentowałem to bardziej szczegółowo w streszczeniu GitHub

Subfuzion
źródło
0

Aby osadzić zewnętrzną miniaturę obrazu, użyj następującego, ![Image](<external link to the image>)

delta24
źródło
0

Komentarz @ Drew Noakes do pierwotnego pytania zrobił to za mnie:

Składnia obrazu, który chciałem wyświetlić:

[[/images/imageName.png]]

Ten obraz był wyświetlany tylko podczas zmiany nazwy:

wikiPage.md --> wikiPage.wiki

W repozytorium wiki zastosowano następującą strukturę folderów:

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

ALE:

Składnia w plikach .wiki różni się od składni plików .md.

rocksteady
źródło
0

Wiele odpowiedzi mi nie pomogło, oto co w końcu zadziałało:

![](../raw/master/Images/ImportantImage.png)

Korzystanie z trybu edytora „Markdown” i podstrony takiej jak:

https://github.com/project/repo/wiki/MyPage

-Jan

JohnKoz
źródło