New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Editor: a full image edit options modal is missing #307

Closed
designsimply opened this Issue Nov 20, 2015 · 19 comments

Comments

@designsimply
Contributor

designsimply commented Nov 20, 2015

Users would like to have a way to edit image details similar to the edit flow for galleries. They would like to be able to edit everything you have access to modify in WP Admin.

Here is how it currently looks in WordPress.com:

screen shot 2015-11-20 at fri nov 20 2 22 32 pm

screen shot 2015-11-20 at 14 24 32

In WP Admin, you can access the "Image Details" screen by clicking on the pencil icon in the image toolbar. (1m36s)

screen shot 2015-11-20 at fri nov 20 2 16 58 pm

screen shot 2015-11-20 at 13 58 47

Recently, the most-requested items have been:

  • Link To
  • Image Border & Color
  • Image Margins

They also expect to be able to change:

  • Caption
  • Alt text

Other things are used and requested less frequently to my knowledge.

@koke

This comment has been minimized.

Show comment
Hide comment
@koke

koke Nov 23, 2015

Member

Link To is the one I'm missing the most, but in my case it's often because some images look small on a post and I want to be able to see them bigger. I think I wouldn't care about where the image links to if clicking on it would open a bigger view like it does when it's a gallery.

Member

koke commented Nov 23, 2015

Link To is the one I'm missing the most, but in my case it's often because some images look small on a post and I want to be able to see them bigger. I think I wouldn't care about where the image links to if clicking on it would open a bigger view like it does when it's a gallery.

@mikejolley

This comment has been minimized.

Show comment
Hide comment
@mikejolley

mikejolley Nov 25, 2015

Contributor

Also seen this request in ticket 982616. For now I'm recommending they switch to the old editor to access the link-to functionality, or click the 'link' button after inserting the image which also works.

Contributor

mikejolley commented Nov 25, 2015

Also seen this request in ticket 982616. For now I'm recommending they switch to the old editor to access the link-to functionality, or click the 'link' button after inserting the image which also works.

@eliorivero

This comment has been minimized.

Show comment
Hide comment
@eliorivero

eliorivero Nov 27, 2015

Contributor

User at 2437867-t complains about missing image editing features, in this case regarding cropping, flipping and rotation.

Contributor

eliorivero commented Nov 27, 2015

User at 2437867-t complains about missing image editing features, in this case regarding cropping, flipping and rotation.

@carinapilar

This comment has been minimized.

Show comment
Hide comment
@carinapilar

carinapilar Jan 15, 2016

User missing the "Link To" feature here.

carinapilar commented Jan 15, 2016

User missing the "Link To" feature here.

@aduth

This comment has been minimized.

Show comment
Hide comment
@aduth

aduth Jan 15, 2016

Member

As an FYI, we do support linking to the original images by clicking the Add Link button in the toolbar after selecting an image. Doing so will prepopulate the URL field with a link to the full-size image. This is a common use-case, though we do intend to add support for other "Link to" options (attachment page, custom URL, etc).

Member

aduth commented Jan 15, 2016

As an FYI, we do support linking to the original images by clicking the Add Link button in the toolbar after selecting an image. Doing so will prepopulate the URL field with a link to the full-size image. This is a common use-case, though we do intend to add support for other "Link to" options (attachment page, custom URL, etc).

@carinapilar

This comment has been minimized.

Show comment
Hide comment
@carinapilar

carinapilar Jan 16, 2016

Yeah, the problem is that you have to do that in all images, add image then add the link. Before, if you set "Link To" to "Media File" in the first one, when adding other images it was loading the same option as default.

carinapilar commented Jan 16, 2016

Yeah, the problem is that you have to do that in all images, add image then add the link. Before, if you set "Link To" to "Media File" in the first one, when adding other images it was loading the same option as default.

@jeherve

This comment has been minimized.

Show comment
Hide comment
@jeherve

jeherve Mar 28, 2016

Member

User missing the "Link To" feature here.

Member

jeherve commented Mar 28, 2016

User missing the "Link To" feature here.

@formosattic

This comment has been minimized.

Show comment
Hide comment
@formosattic

formosattic Apr 12, 2016

User in 2621414-t is missing "Link To" for media file. A feature he relies on a weekly basis.

formosattic commented Apr 12, 2016

User in 2621414-t is missing "Link To" for media file. A feature he relies on a weekly basis.

@ryanboren

This comment has been minimized.

Show comment
Hide comment
@ryanboren

ryanboren Apr 26, 2016

Contributor

I'm trying to improve the accessibility of my posts my adding alt to my images. I don't see how to do that in Calypso. I usually drag-and-drop images. The inline image toolbar allows adding a caption, but not alt.

Contributor

ryanboren commented Apr 26, 2016

I'm trying to improve the accessibility of my posts my adding alt to my images. I don't see how to do that in Calypso. I usually drag-and-drop images. The inline image toolbar allows adding a caption, but not alt.

@aduth aduth referenced this issue Apr 29, 2016

Merged

Create TinyMCE command for adding media #5092

1 of 1 task complete
@ryanboren

This comment has been minimized.

Show comment
Hide comment
@ryanboren

ryanboren Apr 30, 2016

Contributor

I added accessibility because alt provisioning is not part of drag-and-drop image flow. Encourage accessible images.

Contributor

ryanboren commented Apr 30, 2016

I added accessibility because alt provisioning is not part of drag-and-drop image flow. Encourage accessible images.

@ryanboren

This comment has been minimized.

Show comment
Hide comment
@ryanboren

ryanboren Oct 25, 2016

Contributor

Giving this a bump because of the accessibility implications.

The lack of a modal means those who drag-and-drop images directly into the editor can't add alt text to dropped images without rummaging in the insert image modal (accessed via a + plus button).

Further, without access to the image details modal from the editor’s inline image toolbar, adding alt to images on old posts requires scrolling through the image modal looking for the right image amidst months of thumbnails. Unlike in core WP, there is no “Images uploaded to this post” filter. This is supremely frustrating flow if you're trying to be good about alt text.

https://test.wordpress.com/2016/09/30/session-notes-drag-and-drop-image-flow-trackers-editor-masterbar-macnchrome-iphone-7/

Contributor

ryanboren commented Oct 25, 2016

Giving this a bump because of the accessibility implications.

The lack of a modal means those who drag-and-drop images directly into the editor can't add alt text to dropped images without rummaging in the insert image modal (accessed via a + plus button).

Further, without access to the image details modal from the editor’s inline image toolbar, adding alt to images on old posts requires scrolling through the image modal looking for the right image amidst months of thumbnails. Unlike in core WP, there is no “Images uploaded to this post” filter. This is supremely frustrating flow if you're trying to be good about alt text.

https://test.wordpress.com/2016/09/30/session-notes-drag-and-drop-image-flow-trackers-editor-masterbar-macnchrome-iphone-7/

@kriskarkoski

This comment has been minimized.

Show comment
Hide comment
@kriskarkoski

kriskarkoski Feb 15, 2017

+1 to adding this soon

Link To in paritcular is asked by users quite frequently and while it can be done in the Calypso Editor by clicking the image, then the link icon, having to do this for every image is tedious and it’s not intuitive to users how to do this, especially those used to the options already in the WP Admin editor.

kriskarkoski commented Feb 15, 2017

+1 to adding this soon

Link To in paritcular is asked by users quite frequently and while it can be done in the Calypso Editor by clicking the image, then the link icon, having to do this for every image is tedious and it’s not intuitive to users how to do this, especially those used to the options already in the WP Admin editor.

@shaunandrews

This comment has been minimized.

Show comment
Hide comment
@shaunandrews

shaunandrews Mar 8, 2017

Contributor

A quick idea for adding the details modal:

image selection and details

Contributor

shaunandrews commented Mar 8, 2017

A quick idea for adding the details modal:

image selection and details

@drw158

This comment has been minimized.

Show comment
Hide comment
@drw158

drw158 Mar 16, 2017

Member

Here is what I suggest for tackling this.

  1. We need to at least add an edit button to the popover that is shown when you click an image in the editor. Missing that button is a broken experience.

fullsizerender 6

Next, it helps me to think of things that affect the original image, and things that are only relevant to this post.

  1. I propose that we add a new tab to the image details modal that contains all of the post specific settings:

fullsizerender 5

I'm not sure Post settings is the right name, but Display settings doesn't make much sense if it contains the link setting.

Image settings contains all of the existing info like caption and alt text.

We could also add in image size and image alignment to Post settings, but this would just be the secondary way to edit these settings. The primary way would be to do it from the popover in the editor.

  1. Next, I'd try to bring as many of the important actions into the editor popover, like Link To:

fullsizerender 8

Clicking the link icon would bring up a variation of the link modal:

fullsizerender 7

This way it's more obvious how to link an image, and they can do it right from the editor.

Member

drw158 commented Mar 16, 2017

Here is what I suggest for tackling this.

  1. We need to at least add an edit button to the popover that is shown when you click an image in the editor. Missing that button is a broken experience.

fullsizerender 6

Next, it helps me to think of things that affect the original image, and things that are only relevant to this post.

  1. I propose that we add a new tab to the image details modal that contains all of the post specific settings:

fullsizerender 5

I'm not sure Post settings is the right name, but Display settings doesn't make much sense if it contains the link setting.

Image settings contains all of the existing info like caption and alt text.

We could also add in image size and image alignment to Post settings, but this would just be the secondary way to edit these settings. The primary way would be to do it from the popover in the editor.

  1. Next, I'd try to bring as many of the important actions into the editor popover, like Link To:

fullsizerender 8

Clicking the link icon would bring up a variation of the link modal:

fullsizerender 7

This way it's more obvious how to link an image, and they can do it right from the editor.

@drw158

This comment has been minimized.

Show comment
Hide comment
@drw158

drw158 Mar 20, 2017

Member

Can this issue be filed under a Project, or can it be assigned to someone? It seems that Delta is already going to handle this issue, but I didn't know until reading through a P2.

Member

drw158 commented Mar 20, 2017

Can this issue be filed under a Project, or can it be assigned to someone? It seems that Delta is already going to handle this issue, but I didn't know until reading through a P2.

@msmithgu

This comment has been minimized.

Show comment
Hide comment
@msmithgu

msmithgu May 5, 2017

Contributor

This issue is partly covered by Issue #8306 and PR #13479 , which adds an inline image edit button, but does not provide a Link To feature. We may want to create a separate issue for a Link To button.

Contributor

msmithgu commented May 5, 2017

This issue is partly covered by Issue #8306 and PR #13479 , which adds an inline image edit button, but does not provide a Link To feature. We may want to create a separate issue for a Link To button.

@jblz

This comment has been minimized.

Show comment
Hide comment
@jblz

jblz May 22, 2017

Member

@msmithgu @gwwar -- is anything still outstanding here (or in #8306)?

Since #14143 got merged and we're tracking issues in (at least) #14233, are the above issues ok to close?

Member

jblz commented May 22, 2017

@msmithgu @gwwar -- is anything still outstanding here (or in #8306)?

Since #14143 got merged and we're tracking issues in (at least) #14233, are the above issues ok to close?

@gwwar

This comment has been minimized.

Show comment
Hide comment
@gwwar

gwwar May 22, 2017

Member

@jblz, yes I think it makes sense to close these out and add new issues for additional improvements.

Member

gwwar commented May 22, 2017

@jblz, yes I think it makes sense to close these out and add new issues for additional improvements.

@jblz

This comment has been minimized.

Show comment
Hide comment
@jblz

jblz May 22, 2017

Member

Sounds good. Thanks! If anyone disagrees, please feel free to reopen :)

Member

jblz commented May 22, 2017

Sounds good. Thanks! If anyone disagrees, please feel free to reopen :)

@jblz jblz closed this May 22, 2017

@jblz jblz moved this from TODO to Done in Image Editor v2 May 22, 2017

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