Có thể đặt ảnh chụp màn hình trong tệp README trong kho GitHub không? Cú pháp là gì?

Nếu bạn sử dụng Markdown (README.md):

Với điều kiện bạn có hình ảnh trong repo của mình, bạn có thể sử dụng URL tương đối:

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

Nếu bạn cần nhúng một hình ảnh được lưu trữ ở nơi khác, bạn có thể sử dụng một URL đầy đủ

![Alt text](http://full/path/to/img.jpg "Optional title")

GitHub khuyên bạn nên sử dụng các liên kết tương đối với ?raw=truetham số để đảm bảo điểm repos rẽ nhánh chính xác.

Các raw=truetham số là có để đảm bảo hình ảnh mà bạn liên kết đến, sẽ được trả lại như vậy. Điều đó có nghĩa là chỉ hình ảnh sẽ được liên kết đến, chứ không phải toàn bộ giao diện GitHub cho tệp tương ứng đó. Xem bình luận này để biết thêm chi tiết.

Kiểm tra một ví dụ: https://raw.github.com/altercation/solarized/master/README.md

Nếu bạn sử dụng SVG thì bạn cũng cần phải đặt thuộc tính khử trùng thành true: ?raw=true&sanitize=true. (Cảm ơn @EliSherer)

Ngoài ra, tài liệu về các liên kết tương đối trong các tệp README: https://help.github.com/articles/relative-links-in-readmes

Và tất nhiên, các tài liệu markdown: http://daredfireball.net/projects/markdown/syntax

Ngoài ra, nếu bạn tạo một nhánh mới screenshotsđể lưu trữ hình ảnh, bạn có thể tránh chúng ở trong mastercây làm việc

Sau đó, bạn có thể nhúng chúng bằng cách sử dụng:

![Alt text](/../<branch name>/path/to/image.png?raw=true "Optional Title")

Mặc dù đã có một câu trả lời được chấp nhận, tôi muốn thêm một cách khác để tải hình ảnh lên readme trên GitHub.

• Bạn cần tạo vấn đề trong repo của bạn
• Kéo và thả trong khu vực bình luận hình ảnh của bạn
• Sau khi liên kết cho hình ảnh được tạo, chèn nó vào readme của bạn

Thêm chi tiết bạn có thể tìm thấy ở đây

Tôi thấy rằng đường dẫn đến hình ảnh trong repo của tôi không đủ, tôi phải liên kết đến hình ảnh trên raw.github.comtên miền phụ.

Định dạng URL https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH}

Ví dụ đánh dấu ![Settings Window](https://raw.github.com/ryanmaxwell/iArrived/master/Screenshots/Settings.png)

1. Tải hình ảnh của bạn lên postimage.org
2. Nhận url của github Markdown
3. Chèn vào ReadMe của bạn

Một dòng dưới đây sẽ là những gì bạn đang tìm kiếm

nếu tập tin của bạn nằm trong kho

![ScreenShot](https://raw.github.com/{username}/{repository}/{branch}/{path})

nếu tập tin của bạn nằm trong url bên ngoài khác

![ScreenShot](https://{url})

Cú pháp đánh dấu để hiển thị hình ảnh thực sự là:

![image](https://{url})

NHƯNG: Làm thế nào để cung cấp url?

• Bạn có thể không muốn làm lộn xộn repo của mình bằng ảnh chụp màn hình, chúng không liên quan gì đến mã
• bạn có thể không muốn đối phó với rắc rối làm cho hình ảnh của mình có sẵn trên web ... (tải nó lên máy chủ ...).

Vì vậy, ... bạn có thể sử dụng thủ thuật tuyệt vời này để khiến github lưu trữ tệp hình ảnh của bạn. TDLR:

1. tạo một vấn đề trong danh sách vấn đề của repo của bạn
2. kéo và thả ảnh chụp màn hình của bạn về vấn đề này
3. sao chép mã đánh dấu mà github vừa tạo để bạn hiển thị hình ảnh của mình
4. dán nó vào readme của bạn (hoặc bất cứ nơi nào bạn muốn)

http://solutionoptimist.com/2013/12/28/awgie-github-tricks/

Đơn giản hơn nhiều so với việc thêm URL Chỉ cần tải hình ảnh lên cùng một kho lưu trữ, như:

![Screenshot](screenshot.png)

thêm phần này vào README

<div align="center">
    <img src="/screenshots/screen1.jpg" width="400px"</img> 
</div>

Đánh dấu ![Screenshot](http://url/to/img.png)

• Tạo một vấn đề liên quan đến việc thêm hình ảnh
• Thêm hình ảnh bằng cách kéo và thả hoặc bằng trình chọn tệp

• Sau đó sao chép nguồn hình ảnh

• Bây giờ thêm ![Screenshot](http://url/to/img.png)vào tệp README.md của bạn

Làm xong!

Ngoài ra, bạn có thể sử dụng một số trang web lưu trữ hình ảnh như imgurvà lấy url của nó và thêm nó vào tệp README.md của bạn hoặc bạn cũng có thể sử dụng một số lưu trữ tệp tĩnh.

Vấn đề mẫu

Phương pháp 1-> Cách đánh dấu

![Alt Text](https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH})

Phương pháp 2-> cách HTML

<img src="https://link(format same as above)" width="100" height="100"/>

hoặc là

<img src="https://link" style=" width:100px ; height:100px " />

Lưu ý -> Nếu bạn không muốn tạo kiểu cho hình ảnh của mình tức là thay đổi kích thước, hãy xóa phần kiểu

Đầu tiên, tạo một thư mục (thư mục) trong thư mục gốc của repo cục bộ của bạn sẽ chứa những screenshotsgì bạn muốn thêm vào. Hãy gọi tên của thư mục này screenshots. Đặt hình ảnh (JPEG, PNG, GIF, `, v.v.) bạn muốn thêm vào thư mục này.

Ảnh chụp màn hình không gian làm việc của Android Studio

Thứ hai, bạn cần thêm một liên kết đến từng hình ảnh vào README của bạn. Vì vậy, nếu tôi có hình ảnh được đặt tên 1_ArtistsActivity.pngvà 2_AlbumsActivity.pngtrong thư mục ảnh chụp màn hình của mình, tôi sẽ thêm các liên kết của chúng như vậy:

 <img src="screenshots/1_ArtistsActivity.png" height="400" alt="Screenshot"/> <img src=“screenshots/2_AlbumsActivity.png" height="400" alt="Screenshot"/>

Nếu bạn muốn mỗi ảnh chụp màn hình trên một dòng riêng biệt, hãy viết các liên kết của chúng trên các dòng riêng biệt. Tuy nhiên, sẽ tốt hơn nếu bạn viết tất cả các liên kết trong một dòng, chỉ cách nhau bởi khoảng trắng. Nó thực sự có thể trông không được tốt lắm nhưng bằng cách đó, GitHub sẽ tự động sắp xếp chúng cho bạn.

Cuối cùng, cam kết thay đổi của bạn và đẩy nó!

Tôi đã googled một vài câu hỏi tương tự và không thấy bất kỳ câu trả lời với vấn đề của tôi và giải pháp khá đơn giản / dễ dàng của nó.

Google Cloud Storage - một cách tiếp cận hơi khác với hình ảnh trong READMEs

Đây là: giống như OP, tôi muốn có một hình ảnh trong Github README của mình và biết cú pháp Markdown để làm như vậy, đã nhập nó vào:

![My Image](https://storage.cloud.google.com/${MY_BUCKET}/${MY_IMAGE}

Bạn cần hoàn thành các thay thế thực tế ở trên (ví dụ MY_IMAGE = image.jpg) để làm việc này.

Nhưng, chờ đã ... thất bại - không có ảnh thực tế nào! Và liên kết chính xác như được cung cấp bởi Google Storage!

Github camo- Hình ảnh ẩn danh

Github lưu trữ hình ảnh của bạn ẩn danh , yay! Tuy nhiên, điều này trình bày một vấn đề đối với tài sản lưu trữ của Google. Bạn cần lấy url được tạo từ Google Cloud Console.

Tôi chắc chắn rằng có một cách mượt mà hơn, tuy nhiên, chỉ cần truy cập điểm cuối URL đã cho của bạn và sao chép URL dài. Chi tiết:

Hướng dẫn

1. Truy cập bảng điều khiển lưu trữ của bạn: https://console.cloud.google.com/st Storage / browser / $ {MY_BucksET}? Project = $ {MY_PRO DỰ ÁN}
2. Nhấp vào hình ảnh bạn muốn hiển thị trong Github (trang này hiển thị trang "Chi tiết đối tượng")
3. Sao chép mì ống mà URL (cái bắt đầu httpskhông gs) vào tab / cửa sổ trình duyệt mới
4. Sao chép pasta URL được tạo mới - nó phải dài hơn - từ tab / cửa sổ trình duyệt mới vào tệp Github README của bạn

Hy vọng rằng điều này sẽ giúp tăng tốc và làm rõ vấn đề này cho bất cứ ai khác.

Đối với tôi cách tốt nhất là -

1. Tạo một vấn đề mới với kho lưu trữ đó trên github và sau đó tải tệp lên ở định dạng gif. Để chuyển đổi tệp video thành định dạng gif, bạn có thể sử dụng trang web này http://www.online-convert.com/
2. Gửi vấn đề mới được tạo.
3. Sao chép địa chỉ của tệp đã tải lên
4. Cuối cùng, trong tệp README của bạn, hãy đặt! [Bản demo] (ĐỊA CHỈ SAO)

Hy vọng điều này sẽ giúp.

Thêm hình ảnh trong kho lưu trữ từ tùy chọn tệp tải lên, sau đó trong tệp README

![Alt text]("enter image url of repositoryhere") 

Với những hình ảnh nằm trong /screen-shotsthư mục. Bên ngoài <div>cho phép các hình ảnh được định vị. Đệm được thực hiện bằng cách sử dụng <img width="desired-padding" height="0">.

<div align="center">
        <img width="45%" src="screen-shots/about.PNG" alt="About screen" title="About screen"</img>
        <img height="0" width="8px">
        <img width="45%" src="screen-shots/list.PNG" alt="List screen" title="List screen"></img>
</div>