Son zamanlarda GitHub'a katıldım . Orada birkaç projeye ev sahipliği yaptım.

README Dosyama bazı resimler eklemem gerekiyor. Bunu nasıl yapacağımı bilmiyorum.

Ben bu konuda arama, ama tüm "web üzerinde görüntüleri barındırmak ve görüntü yolunu README.md dosyasında belirtin" bana bazı bağlantılar oldu.

Herhangi bir üçüncü taraf web barındırma hizmetleri görüntüleri barındırmadan bunu yapmak için herhangi bir yolu var mı?

Bu işaretlemeyi deneyin:

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

Deponuzda saklanıyorsa, bir görüntünün ham sürümüne doğrudan bağlanabileceğinizi düşünüyorum. yani

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

Gibi göreli yolları da kullanabilirsiniz.

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

• Yeni Bir Sayı oluşturabilirsiniz
• resimleri yükle (sürükle ve bırak)
• Resim URL'sini kopyalayın ve README.md dosyanıza yapıştırın.

İşte detaylı bir youTube videosu bunu ayrıntılı olarak açıkladı:

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

Bundan çok daha basit.

Resminizi havuz köküne yükleyin ve dosya adına herhangi bir yol olmadan bağlantı verin, şöyle:

![Screenshot](screenshot.png)

Basit HTML etiketlerine sahip resimler de ekleyebilirsiniz :

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

Gönderilen çözümlerin çoğu eksik veya benim zevkime göre değil.

• İmgur benzeri harici bir CDN zincire başka bir araç ekler. Meh.
• Sorun izleyicide kukla bir sorun yaratmak bir hack'tir. Karmaşıklık yaratır ve kullanıcıları karıştırır. Bu çözümü bir çatala veya GitHub'dan geçirmek bir acıdır.
• Gh-pages dalını kullanmak URL'leri kırılgan hale getirir. Gh-sayfasını koruyan projede çalışan başka bir kişi, bu görüntülerin yoluna bağlı olarak harici bir şey bilmeyebilir. Gh-pages dalı GitHub'da CDN görüntülerini barındırmak için gerekli olmayan belirli bir davranışa sahiptir.
• Sürüm kontrolünde varlıkları izlemek iyi bir şeydir. Bir proje büyüdükçe ve değiştikçe, birden fazla kullanıcı tarafından yapılan değişiklikleri yönetmek ve izlemek için daha sürdürülebilir bir yöntemdir.
• Bir görüntü yazılımın belirli bir revizyonu için geçerliyse, değişmez bir görüntünün bağlanması tercih edilebilir. Bu şekilde, görüntü daha sonra yazılımdaki değişiklikleri yansıtacak şekilde güncellenirse, revizyonun benioku dosyasını okuyan herkes doğru resmi bulur.

Esinlenerek Benim tercih çözümü, bu ana fikri , bir kullanmaktır varlıklar dalı ile belirli düzeltmelerine Kalıcı Bağlantılar .

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.

Görüntünün bu revizyonuna bir "kalıcı bağlantı" oluşturun ve Markdown'a sarın.

Ancak, taahhüt SHA'sını elle aramak elverişsizdir, bu nedenle bir kısayol olarak, bu help.github sayfasının söylediği gibi belirli bir taahhütteki bir dosyaya kalıcı bağlantı için Y tuşuna basın .

Varlıklar dalında her zaman en son resmi göstermek için damla URL'sini kullanın:

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

(Aynı GitHub yardım sayfasından Dosya görünümleri bir daldaki en son sürümü gösterir )

Teslim resim ( resim.png bir klasör (in) myfolder ) ve aşağıdaki satırı ekleyin README.md :

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

• Resim eklemeyle ilgili bir sorun oluşturun
• Resmi sürükleyip bırakarak veya dosya seçiciyle ekleyin

• Ardından görüntü kaynağını kopyalayın

• Şimdi ![alt tag](http://url/to/img.png)README.md dosyanıza ekleyin

Bitti!

Alternatif olarak bazı görüntü barındırma sitelerini kullanabilir imgurve URL'sini alabilir ve README.md dosyanıza ekleyebilirsiniz veya bazı statik dosya barındırma da kullanabilirsiniz.

Örnek sorun

README Dosyama bazı resimler eklemem gerekiyor. Bunu nasıl yapacağımı bilmiyorum.

GitHub deponuzun benioku için basit resim galerileri oluşturmanıza ve özelleştirmenize olanak tanıyan küçük bir sihirbaz oluşturdum: Bkz. BeniokuGalleryCreatorForGitHub .

Sihirbaz GitHub'ın img etiketlerinin README.md. Ayrıca, sihirbaz, sorunları sorun alanında sürükleyip bırakarak GitHub'a resim yükleme popüler numarasından yararlanır (bu konudaki cevaplardan birinde daha önce belirtildiği gibi).

Sadece <img>deponuza göreli src ile README.md bir etiket ekleyin . Göreli src kullanmıyorsanız, sunucunun CORS'yi desteklediğinden emin olun.

GitHub inline-html'yi desteklediğinden çalışır

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

Burada gözlemleyin

Temel Sözdizimi

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

Buraya:

1. my-image-alt-tag: resim gösterilmezse görüntülenecek metin.
2. url-to-image: resim kaynağınız ne olursa olsun. Görüntünün URI'si

Misal:

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

Bu aşağıdaki gibi görünecektir:

Öne çıkmak için tabloları kullanın, ona ayrı bir cazibe verecektir

Tablo Sözdizimi:

Her sütun hücresini sembolle ayırın |

ve tablo üstbilgisi (İlk satır) ---

| sütun 1 | sütun 2 |
| ------------ | ------------- |
| görüntü 1 | görüntü 2 |

çıktı

<img src="url/relativePath">İki resim kullanıyorsanız şimdi resim 1 ve resim 2'yi koyun

Not: Birden fazla görüntü kullanıyorsanız yalnızca daha fazla sütun varsa, okunabilir görünmesi için genişlik ve yükseklik özelliğini kullanabilirsiniz.

Misal

| sütun 1 | sütun 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">|

Aralık önemli değil

Çıktı resmi

yardım eden: adam-p

Sadece şunları yapabilirsiniz:

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

Sonra sadece READMEdosyada şöyle başvurabilirsiniz :

![diagram](diagram.png)

Benim durumumda imgur kullanıyorum ve doğrudan bağlantıyı bu şekilde kullanıyorum.

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

Alternatif github CDN bağlantısını kullanarak projenizdeki resimlere README.md'den (veya harici olarak) bağlanabilirsiniz.

URL şöyle görünecektir:

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

Projemde bir SVG görüntüsü var ve Python proje belgelerimde başvurduğumda işlem yapmıyor.

Proje bağlantısı

İşte dosyanın proje bağlantısı (resim olarak görüntülenmez):

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

Gömülü görüntü örneği:

Ham bağlantı

İşte dosyaya RAW bağlantısı (yine de görüntü olarak görüntülenmiyor):

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

Gömülü görüntü örneği:

CDN bağlantısı

CDN bağlantısını kullanarak (bir görüntü olarak oluşturur) kullanarak dosyaya bağlayabilirsiniz:

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

Gömülü görüntü örneği:

Hem README.mddosyamda hem de PyPi projemde reStructredText doucmentation ( burada ) projemdeki görüntüleri bu şekilde kullanabiliyorum

Bu sorunu çözdüm. Yalnızca bir başkasının benioku dosyasına başvurmanız gerekir.

İlk olarak, github kod kütüphanesine bir resim dosyası yüklemelisiniz! Ardından görüntü dosyasının adresine doğrudan başvuru.

Genellikle görüntüyü sitede barındırırım, bu barındırılan herhangi bir görüntüye bağlanabilir. Bunu benioku içinde at. .rstDosyalar için çalışır , hakkında emin değilim.md

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

Benim durumumda bir yazdırma ekranı göstermek istedim Githubama aynı zamanda üzerinde NPM. Göreli yolu kullanmak Githubiçte çalışmasına rağmen, bunun dışında çalışmıyordu. Temel olarak, projemi de itmiş olsam bile NPM(ki sadece aynı şeyi kullanıyor readme.md, görüntü asla gösterilmiyordu.

Birkaç yol denedim, sonunda bu benim için işe yaradı:

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

Şimdi NPMresmimi paketimi yayınlayabileceğim başka bir yerde veya başka bir yerde görüyorum.

Belgeleme için bazı resimler yüklemeniz gerekirse, git-lfs kullanmak iyi bir yaklaşımdır . Git-lfs'yi yüklediğinizde aşağıdaki adımları izleyin:

1. Her resim türünüz için git lfs'yi başlatın:

   git lfs *.png
   git lfs *.svg
   git lfs *.gif
   git lfs *.jpg
   git lfs *.jpeg
   

2. Görüntü konumu olarak kullanılacak bir klasör oluşturun örn. doc. GNU / Linux ve Unix tabanlı sistemlerde bu şu şekilde yapılabilir:

   cd project_folder
   mkdir doc
   git add doc
   

3. Herhangi bir görüntüyü doc klasörüne yapıştırın. Daha sonra bunları git addkomutla ekleyin .

4. Kesin ve itin.

5. Resimler aşağıdaki URL'de herkese açık olarak bulunur:

   https://media.githubusercontent.com/media/ ^ github_username ^ / ^ repo ^ / ^ şube ^ / ^ repodaki resim_konumu ^

Burada: * ^github_username^github'daki kullanıcı ^repo_name^adıdır ( profil sayfasında bulabilirsiniz) * havuz adıdır * * ^branch^görüntünün yüklendiği depo dalıdır * ^image_location in the repo^görüntünün depolandığı klasörü içeren konumdur.

Ayrıca önce görüntüyü yükleyebilir, ardından projeler github sayfanızdaki konumu ziyaret edebilir ve görüntüyü bulana kadar gezinebilir ve daha sonra download basabilir ve URL'yi tarayıcının adres çubuğundan kopyalayıp yapıştırabilirsiniz.

bakın bu referans olarak projemden.

Ardından, URL'yi yukarıda belirtilen işaretleme sözdizimini kullanarak dahil etmek için kullanabilirsiniz:

![some alternate text that describes the image](^github generated url from git lfs^)

Örneğin: Bu fotoğrafı kullandığımızı varsayalım. O zaman işaretleme sözdizimini kullanabilirsiniz:

![In what order to compile the files](https://media.githubusercontent.com/media/pc-magas/myFirstEnclave/master/doc/SGX%20Compile%20workflow.png)

SADECE BU İŞLER !!

etiketinizdeki dosya adı büyük harfine dikkat edin ve PNG dosyasını kök haline getirin ve dosya yoluna herhangi bir yol olmadan bağlantı verin:

![Screenshot](screenshot.png)

Sadece kabul edilmiş cevaba bir örnek ekliyorum veya ekliyorum.

Görüntüyü Github deponuza yerleştirdikten sonra.

Sonra:

• Tarayıcınızda ilgili Github deposunu açın.
• Hedef görüntü dosyasına gidin Sonra görüntüyü yeni bir sekmede açın.
• URL'yi kopyalayın
• Ve son olarak URL'yi aşağıdaki desene ekleyin ![alt text](https://raw.githubusercontent.com/username/projectname/branch/path/to/img.png)

Benim durumumda

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

Nerede

• shadmazumder benim username
• Xcode bu projectname
• master bu branch
• InOnePicture.png, imageBenim durumumda InOnePicture.pngkök dizinde.

Bunu yapmanın 2 basit yolu var,

1) HTML img etiketini kullanın,

2)! [] (Resminizin kaydedildiği yol / image-name.png)

yolu, bu resmi açarken tarayıcıdaki URL'den kopyalayabilirsiniz. aralık bırakma ile ilgili bir sorun olabilir, bu nedenle b / w'de iki yol kelimesi veya resim adı add->% 20 içinde boşluk olup olmadığından emin olun. tıpkı tarayıcı gibi.

Her ikisi de çalışacak, daha fazla anlamak istiyorsanız github'umu kontrol edebilirsiniz -> https://github.com/adityarawat29

Bu Cevap ayrıca şu adreste de bulunabilir: https://github.com/YourUserAccount/YourProject/blob/master/DirectoryPath/ReadMe.md

Repo'dan gelen görüntüleri kullanarak şunları görüntüleyin:

alan adını ekle: https://raw.githubusercontent.com/

bayrak ekle: ?sanitize=true&raw=true

Kullanım <img />etiketi

• Etki alanı :raw.githubusercontent.com/
• Kullanıcı Adı :YourUserAccount/
• Repo :YourProject/
• Şube :YourBranch/
• Yol :DirectoryPath/
• Dosya adı :example.png

SVG, PNG ve JPEG için çalışır

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

Kullanıldıktan sonra aşağıda görüntülenen çalışma örneği kodu:

**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 :

Teşekkürler: - 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

Başka bir çözüm buldum ama oldukça farklı ve açıklayacağım

Temel olarak, resmi göstermek için etiketi kullandım, ancak görüntü tıklandığında başka bir sayfaya gitmek istedim ve işte nasıl yaptım.

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

Yeni bir satırla birbirinin yanına koyarsanız, görüntüyü tıkladığınızda, href'i yönlendirmek istediğiniz diğer siteye sahip olan etikete gider.

EN SON

Vikisözler PNG, JPEG veya GIF görüntüleri görüntüleyebilir

Şimdi şunları kullanabilirsiniz:

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

-VEYA-

Bu adımları takip et:

1. GitHub'da, deponun ana sayfasına gidin.

2. Havuz adınızın altında Wiki'yi tıklayın.

3. Wiki kenar çubuğunu kullanarak değiştirmek istediğiniz sayfaya gidin ve Düzenle'yi tıklatın.

4. Wiki araç çubuğunda Görüntü'yü tıklatın .

5. "Resim Ekle" iletişim kutusuna resim URL'sini ve alternatif metni (arama motorları ve ekran okuyucuları tarafından kullanılır) yazın.
6. Tamam'ı tıklayın.

Bakınız Dokümanlar .

Bir kullanmayı düşünün tablebirden ekran görüntüleri ekleme ve burada gösterildiği gibi iyileştirilmiş erişilebilirlik için sekmeli verileri kullanılarak uyumlu hale getirmeyi istiyorum:

İşaretleme ayrıştırıcınız destekliyorsa, role="presentation"WIA-ARIA özniteliğini TABLO öğesine ekleyebilir ve thetiketleri atlayabilirsiniz .

Adım adım işlem, Önce bir klasör oluşturun (klasörünüzü adlandırın) ve yüklemek istediğiniz görüntüyü / görüntüleri Readme.md dosyasına ekleyin. (resmi / görüntüleri projenizin mevcut herhangi bir klasörüne de ekleyebilirsiniz.) Şimdi, Readme.md dosyasının düzenleme simgesini tıklayın, ardından

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

Resim ekledikten sonra, "Değişiklikleri Önizle" sekmesinde değişikliklerin önizlemesini görebilirsiniz. Resminizi burada bulabilirsiniz. örneğin böyle, Benim durumumda,

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

uygulama klasörü -> src klasörü -> ana klasör -> res klasörü -> çekilebilir klasör -> ve içinde çekilebilir klasör refrence_image.png dosyası bulunur. Birden fazla resim eklemek için bunu şu şekilde yapabilirsiniz,

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

Not 1 - Görüntü dosyası adınızın boşluk içermediğinden emin olun. Boşluk içeriyorsa, dosya adı arasındaki her boşluk için% 20 eklemeniz gerekir. Boşlukları kaldırmak daha iyidir.

Not 2 - HTML etiketlerini kullanarak görüntüyü yeniden boyutlandırabilirsiniz veya başka yollar da vardır. daha fazla bilgi için google. Eğer ihtiyacın olursa.

Bundan sonra, taahhüt değişiklikleri mesajınızı yazın ve ardından Değişikliklerinizi yapın.

Bunu yapmak gibi bir çok kesmek vardır, bir sorun vb oluşturmak vb. Şimdiye kadar bu karşılaştığım en iyi yöntemdir.

Bunu basitçe yapabiliriz,

• GitHub'da Yeni Sayı Oluştur
• vücut üzerinde sürükle ve bırak görüntüleri divKonunun

birkaç saniye sonra bir bağlantı oluşturulur. Şimdi bağlantıyı veya resim URL'sini kopyalayın ve desteklenen herhangi bir platformu kullanın.

Deponuza dosya yükleme seçeneğinden resim ekleyin ve ardından README dosyasına ekleyin

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

Bahsetmediğim başka bir seçenek daha var. Kullanıcı veya kuruluşunuz altında "varlıklar" adı verilen başka bir havuz oluşturabilirsiniz. Resimlerinizi bu repoya aktarın ve diğer depolarınızdan referans alın:

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

Bunu depolarımdan birinde yaptım ve bana iyi geliyor. README görüntülerimi kodumdan bağımsız olarak tüm projelerim için güncelleyebilirim, ancak yine de hepsini tek bir yerde saklayabilirim . Hiçbir sorun veya şube veya kolayca yanlış yerleştirilebilen başka yapay öğeler gerekmez.