Skip to content
GitLab Next
    • GitLab: the DevOps platform
    • Explore GitLab
    • Install GitLab
    • How GitLab compares
    • Get started
    • GitLab docs
    • GitLab Learn
  • Pricing
  • Talk to an expert
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
    • Menu
    Projects Groups Snippets
  • Get a free trial
  • Sign up
  • Login
  • Sign in / Register
  • GitLab GitLab
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Locked Files
  • Issues 43,142
    • Issues 43,142
    • List
    • Boards
    • Service Desk
    • Milestones
    • Iterations
    • Requirements
  • Merge requests 1,351
    • Merge requests 1,351
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
    • Test Cases
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages & Registries
    • Packages & Registries
    • Package Registry
    • Container Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Metrics
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Code review
    • Insights
    • Issue
    • Repository
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar

GitLab 15.0 has launched! Please visit Breaking changes in 15.0 and 15.0 Removals to see which breaking changes may impact your workflow.

  • GitLab.org
  • GitLabGitLab
  • Issues
  • #216640
Closed
Open
Created May 05, 2020 by Eric Schurter@ericschurterDeveloper0 of 2 tasks completed0/2 tasks

Display images in the Static Site Editor

Problem to solve

The WYSIWYG experience in the Static Site Editor offers a familiar way to edit rich text, but does not currently offer any support for users looking to enhance their content using visual assets like pictures, screenshots, animated gifs, or charts.

Intended users

  • Parker (Product Manager)
  • Presley (Product Designer)

User experience goal

A user should be able to use the WYSIWYG mode of the Static Site Editor to add an inline image and preview the results.

Note: This is intended only for adding existing hosted images, not uploading new assets from the static site editor. That functionality is covered in #218529 (closed)

Proposal

Using the built-in support for images in Toast UI, we should display thumbnails of any existing images on the page in the WYSIWYG mode and allow a user to insert a reference to a new image by providing a URL and optional Description for accessibility.

Direct URL

  • A user can provide a URL to an image, for example: https://www.site.com/images/logo.png

Documentation

  • Add all known Documentation Requirements in this section. See https://docs.gitlab.com/ee/development/documentation/feature-change-workflow.html#documentation-requirements
  • If this feature requires changing permissions, update the permissions document. See https://docs.gitlab.com/ee/user/permissions.html -->

Designs

  • Designs: Inserting image
  • Figma: https://www.figma.com/file/RhYal9t4OZk7IeYsSvEHpW/WYSIWYG-markdown-editor-214559?node-id=310%3A520

Availability & Testing

What does success look like, and how can we measure that?

Acceptance criteria

  1. Images can be previewed in the WYSIWYG editor
  2. Images can be added by providing a valid URL and optional description

Links / references

Toast UI

TODO

  • Add ability to handle custom events on the ToastUI editor - !32945 (merged)
  • Insert an image using the Static Site Editor - !33029 (merged)
Edited May 27, 2020 by Eric Schurter
Assignee
Assign to
Time tracking