Upload images to GitHub from the browser

问题

I am using GitHub Pages, Jekyll, and Prose to manage a Website. Everything works fine, besides I cannot find a way to upload images. The Prose image uploader is not working probably as discussed in various tickets (for instance here).

Since the Website is for a friend without any git or command line experience, I am looking for another option to upload images easily from the browser to GitHub. Are there any other options like this? I don't want to host the image on an external site.

回答1:

GitHub just added this functionality:

https://help.github.com/articles/adding-a-file-to-a-repository/

Example:

回答2:

It is possible to upload the images from the browser, without using Git.

Create a new GitHub issue and drag the image into the textbox.
GitHub will upload the image and create a link like this one:
https://f.cloud.github.com/assets/19977/1656110/a3f8b280-5b6d-11e3-818d-c06ab05bd613.jpg

Source: GitHub's Phil Haack

回答3:

The workaround I use, is to base64 encode images, here is one tool that will do that for you (it even offers image optimization): https://www.base64-image.de/

Then you can just click copy image and that will give you a long string of characters that can be used inside of an <img>'s src="", or a markdown embedded image ![alt text](data:image/png;crazy-long-string-of-characters).

I did that for this blog post I wrote from a ChromeBook:

https://ryanpcmcquen.org/javascript/2015/10/20/fix-hackpad-printing.html

The screenshots there are base64!

回答4:

Context Yes, it is possible to upload images using Git, but not from the website. I work with Rails and Git upload a limited ammount of assets (logos, pngs, backgrounds, etc.)

Answer If you are working with a Github Page I would recommend you to store the images somewhere else. I particularly use Tumblr. I have an independent Tumblr blog where I post all my images (icons, backgrounds, client work, etc.). Tumblr doesn't compress them as much as Facebook or Google+, so is perfect for that. http://superfantasticassets.tumblr.com

回答5:

Update: Github has released Upload option for repositories! There is an easy way to upload images to Github using prose.io.

But you have to add the code below to _config.yml if you want to upload images to Jekyll blog or if you are using just githb pages then you have to create a _prose.yml file in the root and add this code inside.

This works and this is how I'm updating my blog posts and adding images in it.

prose:
  rooturl: '/'
  siteurl: 'http://prose.github.io/starter/'
  relativeLinks: 'http://prose.github.io/starter/links.jsonp'
  media: 'media'
  ignore:
    - index.md
    - _config.yml
    - /_layouts
    - /_includes
  metadata:
    _posts:
      - name: "layout"
        field:
          element: "hidden"
          value: "blog"
      - name: "tags"
        field:
          element: "multiselect"
          label: "Add Tags"
          placeholder: "Choose Tags"
          options:
            - name: "Apples"
              value: "apples"
            - name: "Bananas"
              value: "bananas"
    _posts/static:
      - name: "layout"
        field:
          element: "hidden"
          value: "page"
      - name: "permalink"
        field:
          element: "text"
          label: "Permalink"
          value: ""

Now you should be able to upload images through prose.io

Read detailed Tutorial here: How to add or edit Jekyll posts online

回答6:

If you keep your images in the Jeykll repo, they're uploaded and hosted. Just find them on GitHub in your repo, and pass the src of your img in your HTML the raw value.

Example: Image in my repo: https://github.com/kevinSuttle/kevinsuttle.github.io/blob/master/images/19698565-media_httpfarm5static_jhkva.jpg

Raw: https://raw.github.com/kevinSuttle/kevinsuttle.github.io/master/images/19698565-media_httpfarm5static_jhkva.jpg

It took me awhile to wrap my head around it also.

回答7:

You can also use GitHub Desktop. Then just add the repo, add images to the folder from your computer, commit and sync. This is essentially the command line git functionality but in the form of a GUI, making it easy for your friend to use.

P.S. Yes, I know this isn't actually on the Github website but it would solve your issue of giving your friend a way to upload images easily from Github.

来源：https://stackoverflow.com/questions/20865752/upload-images-to-github-from-the-browser