Skip to content

how to insert images #936

Description

@ShusenTang

I already have a written document:

- docs
  - chap1
     - doc1.md
  ...
  - img
     - img1.png 

here I inserted the image img1.png into doc1.md using

<div align=center>
<img width="200" src="../img/img1.png"/>
</div>

This will show the img1 very well in GitHub or other markdown editor. But if I deploy the doc in gitpages, the image broken.

If I use

<div align=center>
<img width="200" src="./img/img1.png"/>
</div>

it works.

But I don't want to make changes to my doc, how should I configure docsify to show the image properly?

Activity

  1. marcantoinem commented on Oct 21, 2019

    @marcantoinem

    There's no way to configure docsify to show the image with ../ without changing your code. ./ is the good way to write it. In the other issue, I was talking about the markdown syntax which is incorrect name, that would be converted in html like this name.

  2. ShusenTang commented on Oct 22, 2019

    @ShusenTang
    Author

    There's no way to configure docsify to show the image with ../ without changing your code. ./ is the good way to write it. In the other issue, I was talking about the markdown syntax which is incorrect name, that would be converted in html like this name.

    Thanks for your reply. I solved my problem using a workaround, I added

    hook.beforeEach(function(content) {
                return content.replace(/..\/..\/img/g, "img");
              })
    

    into index.html to convert all "../../img" into "img" before each parsing the Markdown file.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions