WordPress.org

Make WordPress Core

Opened 7 years ago

Closed 6 years ago

Last modified 6 years ago

#11420 closed task (blessed) (fixed)

Easy within-site linking from new content

Reported by: jane Owned by: koopersmith
Milestone: 3.1 Priority: normal
Severity: normal Version: 2.9
Component: Editor Keywords: has-patch
Focuses: Cc:

Description (last modified by janeforshort)

When writing a new post or page, we should make it easier to link to internal content (a previous post or page). The "Easy Post-to-Post Links" plugin enables shortcuts based on post ID or slug, but I'm envisioning something more user-friendly.

Something like you click a button for an internal link (though it should be same mechanism as for external link, possibly the popup could be sectioned or tabbed for external vs internal, like the media popup) and it allows you to search for a post or browse a list of existing content by title, date, author, etc. and select it for inclusion. It would allow you to enter the text you wanted linked, or would use the post title by default, maybe.

Attachments (25)

internal-linking.first-pass.diff (17.4 KB) - added by koopersmith 6 years ago.
internal-linking.second-pass.diff (32.5 KB) - added by koopersmith 6 years ago.
internal-linking.second-pass.2.diff (34.3 KB) - added by koopersmith 6 years ago.
internal-linking.third-pass.diff (26.6 KB) - added by koopersmith 6 years ago.
wp-concat-tinymce (1.0 KB) - added by ryan 6 years ago.
wp-concat-tinymce script
11204.dropdown.to.tabs.diff (5.0 KB) - added by koopersmith 6 years ago.
internal-linking.round-two.diff (25.2 KB) - added by koopersmith 6 years ago.
river.diff (10.0 KB) - added by koopersmith 6 years ago.
river.2.diff (10.4 KB) - added by koopersmith 6 years ago.
river.feedback.diff (4.9 KB) - added by koopersmith 6 years ago.
cancel-link-cursor.diff (121.0 KB) - added by mmuro 6 years ago.
CSS to force pointer cursor on hover
wpdialogs-and-friends.diff (59.2 KB) - added by koopersmith 6 years ago.
ui-dialog.to.wp-dialog.diff (3.2 KB) - added by koopersmith 6 years ago.
11420.fix-search-and-pagination.diff (1019 bytes) - added by nacin 6 years ago.
Don't forget to send the title when making a pagination request.
api.cleanup.diff (11.0 KB) - added by koopersmith 6 years ago.
clear-fields-on-refresh.diff (1.2 KB) - added by koopersmith 6 years ago.
http.by.default.diff (591 bytes) - added by koopersmith 6 years ago.
no.title.11420.patch (506 bytes) - added by ocean90 6 years ago.
11420_cache_search_results.diff (1.3 KB) - added by batmoo 6 years ago.
Caches AJAX results to avoid repeated calls for the same query
update.and.save.diff (3.0 KB) - added by koopersmith 6 years ago.
internal-linking-oddity.png (19.6 KB) - added by sbressler 6 years ago.
Rendering oddity for long titles. Happens in IE9 and Chrome, at the least.
11420_text_wrapping.diff (1.2 KB) - added by batmoo 6 years ago.
Fixes text wrapping issues (quick sanity check done in IE6)
11420_label_for.diff (1.3 KB) - added by batmoo 6 years ago.
Add for attributes to labels
IE6-Internal-Linking_clearboth.png (9.5 KB) - added by batmoo 6 years ago.
Title wonkiness in IE6 using r16750
IE6-internal-linking_clearelement.png (11.8 KB) - added by batmoo 6 years ago.
Title wonkiness gone in IE6 with clearing element

Download all attachments as: .zip

Change History (101)

#1 @janeforshort
7 years ago

  • Description modified (diff)

#2 @pavelevap
7 years ago

  • Cc pavelevap@… added

#3 @hakre
7 years ago

Please provide a patch.

#4 @hakre
7 years ago

  • Keywords needs-patch added; writing links removed

#5 @hakre
7 years ago

  • Keywords reporter-feedback added
  • Milestone changed from 3.0 to Future Release

Can you exemplary name existing software which implements "within-site linking" so it's easier to make up oneself's mind?

#6 @dremeda
7 years ago

  • Cc dre@… added

I imagine this needs to push out.

#8 @westi
6 years ago

  • Cc westi added

#9 @westi
6 years ago

I imagine a new core shortcode backing this which people can easily enter by hand as well with obvious arguments.

#10 @jeffr0
6 years ago

As for plugin inspiration, you might want to check out Insights by Vladimir Prelovac which not only provides the ability to search for previous blog content, but has other sources of info available as well readily available within a meta box on the Post Writing screen.

http://wordpress.org/extend/plugins/insights/

#11 @ryan
6 years ago

  • Milestone changed from Future Release to 3.1

#12 @ryan
6 years ago

  • Type changed from feature request to task (blessed)

#13 @sennza
6 years ago

  • Cc sennza added

I've just been having a quick go an an alpha version of this that blends in with the current link button in TinyMCE.

e.g. http://www.sennza.com.au/trac/posts.png
http://www.sennza.com.au/trac/pages.png

I've got to do some styling and add a scrollable div for when there are stacks of posts and pages and I might attempt to add a patch for a possible starting point with this feature. I'll have to add the additional fields mentioned by janeforshort as well then work on adding a search option too.

It'd be my first attempt to submit a patch to WordPress. I might not be heading down the right track with this so I dunno :)

#14 @voyagerfan5761
6 years ago

  • Cc WordPress@… added

Assuming this is the internal linking task mentioned on the wpdevel blog yesterday, I know of an example implementation that I like, shortcode-wise: RB Internal Links. I'm not so sure I like the WYSIWYG implementation of that plugin, though.

It's nice to see the gist of #529 brought up again, with a happier resolution for users.

#15 @sillybean
6 years ago

  • Cc steph@… added

#16 @koopersmith
6 years ago

  • Keywords has-patch added; needs-patch reporter-feedback removed
  • Owner set to koopersmith
  • Status changed from new to accepted

Posting my first pass, which adds TinyMCE integration and maintains old link features. It needs post/term/etc selection to be written, but the foundation's there.

Patches welcome.

File guide:

  • wp-includes/js/tinymce/wp-mce-link.php — the link dialog
  • wp-includes/js/tinymce/plugins/wplink/ — TinyMCE plugin
    • editor-plugin.js — the main frame's JS
      • I left editor-plugin.js uncompressed and editor-plugin.dev.js empty for ease of development.
    • js/wplink.js — the link dialog's JS

#17 @idealien
6 years ago

  • Cc idealien added

Would also be fantastic to have configurable custom post types available for internal linking.

#18 @jane
6 years ago

Before people get carried away and we have another custom menus situation on our hands, I just want to remind everyone of the scope of this ticket, which is v1 of an internal linking feature. The scope that has been accepted blessed is as follows: enable a search/autocomplete (similar to menus) option to link to internal content, while external links will continue to work the same. No other additions to the feature for v1. Freeze on this is in less than two weeks, and we'd hoped to have it in testing by now. If anyone wants to suggest things for v2 of an internal linking feature, please start a new ticket to keep this one focused on the feature that has actually been blessed (see type) by the lead developers. Thanks.

#19 @aaroncampbell
6 years ago

  • Cc aaroncampbell added

#20 @azaozz
6 years ago

Some suggestions after looking through the first patch:

  • We can overload the command executed from the default 'link' button (similar to the Advanced Link plugin). This will remove the necessity of new translation, styling, etc. To return to the default link dialog the wpLink plugin can be disabled.
  • We would need a custom "Suggest" script that would return post/category/tag name + URL, probably best in JSON format. It should post to admin-ajax.php.
  • It's nice to hide the "advanced" link properties however the dialog looks incomplete/empty with so much white space at the bottom and cannot be resized dynamically. Perhaps we can leave them visible but move them under the fold, i. e. the user would have to scroll down to see them?

#21 @koopersmith
6 years ago

Attached is my second pass. It covers most of the big functions, including list views and search for all applicable post types and taxonomies.

Here's what's left:

  • Paging: Right now the links and PHP exist, but the AJAX does not.
  • Overload default 'link' plugin as Andrew suggested.
  • Do something about the "advanced" link properties.
  • Styling/UX improvements:
    • Disabling the "Update" button when an item isn't selected—currently it just silently stays put.
    • Potentially writing "Insert" instead of "Update" in certain contexts.

We also cannot retrieve internal link info when editing a link (it currently defaults to external link), but IIRC, that may be v2 material.

I also wrote a simple reusable tabs interface—currently its coupled in the wp-link files, but I think they'd fit best elsewhere. The interface could potentially be applied in several places within core to reduce code duplication, and could, over time, roll in existing interfaces such as the menu tabs manager.

#22 @koopersmith
6 years ago

This next patch adds AJAX for paging (AJAX for search was included in the previous patch as well).

#23 @wikichaves
6 years ago

If you haven't seen yet, this is a great plugin with great UI to associate pages with posts http://wordpress.org/extend/plugins/post-page-association-plugin/

#24 @pavelevap
6 years ago

Will be there any filter or hook to allow changes of output tranfered into editor window? For example, I do not want to insert post permalink as html link but shortcode with ID of this post...

#25 @ryan
6 years ago

Can the post type and taxonomy panels be rendered on demand via AJAX? Right now it seems to load the first page of "all" and "new" for every type and tax, which is a bit slow.

#26 @ryan
6 years ago

Wondering if we really want to show taxonomies in core. Sites that like to link back to their tag pages usually use an auto linker. Plus, it's a lame and annoying practice. ;-)

#27 @aaroncampbell
6 years ago

I understand that the automated linking could be annoying, but what would be the point of having taxonomy pages if they weren't linked from anywhere? Most sites might be happy to just have something like "filed in ", but I'm sure there are cases where it makes sense to link to a taxonomy page. I'd like to see the capability, but I wouldn't be opposed to it being a post-3.1 feature.

#28 @jane
6 years ago

v1 was supposed to offer linking to posts, pages and files only. I'd like to keep it that way to make it easier to measure issues with the UI. The whole thing could be pluggable if people want to add access to taxonomy indexes, etc, but for now, people can still use the blank URL field to link to anything in the world. We need to exercise a little restraint and not throw in every possible option when we add stuff just because it's easy.

#29 @koopersmith
6 years ago

Third pass covers what was discussed in last week's dev chat:

  • All queries are done via AJAX.
  • Taxonomies support removed.
  • Convert "target" dropdown into an "open in new tab" checkbox.
  • Remove "class" dropdown.
  • Overload the default 'link' button (as per Andrew's comment above). We should consider #15139 from a UX perspective.
  • ...plus refactoring and various odds and ends.

#30 @nacin
6 years ago

(In [15940]) Internal linking, first pass. props koopersmith, see #11420.

#31 @nacin
6 years ago

(In [15941]) Compress scripts and bump for [15939] [15940]. see #11420.

#32 @nacin
6 years ago

(In [15943]) Rearrange wp-load include. see #11420.

#33 @nacin
6 years ago

  • Reporter changed from janeforshort to jane

We'll want an admin_ajax_referer for the admin-ajax case. I would want a cap check there too, but that's going to be tough for editors on different post types ... might need to rely on WP_Query to only return posts the user can view.

#34 @azizur
6 years ago

  • Cc azizur added

#35 @jane
6 years ago

We need to get this finished up in the next day or two if possible. We've already missed a couple weeks we planned to be doing user testing with it.

#36 @ryan
6 years ago

(In [16060]) Update wp-tinymce.js.gz. see #11420

@ryan
6 years ago

wp-concat-tinymce script

#37 follow-up: @lonelicloud
6 years ago

I have a site based on wp 3.1-alpha. When I was editting a post, after clicking the insert link button, pasting the external link url, it's no response when clicking the "update" button.

But it works in another testing wp blog of mine which is not in multisite mode.

Does this mean that this new link edit funtion is not ready for multisite mode?

#38 in reply to: ↑ 37 @lonelicloud
6 years ago

Sorry, it's caused by WP-Minify.

Replying to lonelicloud:

I have a site based on wp 3.1-alpha. When I was editting a post, after clicking the insert link button, pasting the external link url, it's no response when clicking the "update" button.

But it works in another testing wp blog of mine which is not in multisite mode.

Does this mean that this new link edit funtion is not ready for multisite mode?

#39 @ryan
6 years ago

(In [16390]) Auto focus URL field. see #11420

#40 @ryan
6 years ago

(In [16391]) Minify wplink js. see #11420

#41 @nacin
6 years ago

(In [16393]) Next pass on internal linking. Functional, but needs styling. props koopersmith, see #11420.

#42 @ryan
6 years ago

(In [16397]) Minify wplink js. see #11420

#43 @nacin
6 years ago

(In [16398]) Internal linking UI updates. see #11420.

@koopersmith
6 years ago

@koopersmith
6 years ago

#44 @nacin
6 years ago

(In [16399]) Internal linking functionality updates. Scrap pagination for a river of results. props koopersmith, see #11420.

#45 @nacin
6 years ago

(In [16407]) Improve internal linking river feedback. props koopersmith, see #11420.

@mmuro
6 years ago

CSS to force pointer cursor on hover

#46 @nacin
6 years ago

(In [16457]) Ludicrous speed for internal linking. First pass. props koopersmith, see #11420.

#47 @nacin
6 years ago

(In [16458]) Second pass on internal linking preloading. Adjust styles, svn add the wpdialogs plugin, adjust files and docs. see #11420.

#48 @nacin
6 years ago

(In [16459]) Third pass on internal linking preloading. Or, what I left out of the second pass commit. see #11420.

#49 @nacin
6 years ago

Hey mmuro, didn't forget about your patch. It would have made more sense to apply this to wp-admin.dev.css versus the individual color stylesheets, but it was even easier -- once Koopersmith and I figured it out -- to fix the root problem, which was that the anchor was missing the href attribute.

#50 @nacin
6 years ago

(In [16460]) More svn add. see #11420.

#51 @nacin
6 years ago

(In [16461]) Kill the background from the default jQuery UI dialog theme. We'll get this from .wp-dialog in the colors stylesheets. props koopersmith, see #11420.

#52 @nacin
6 years ago

(In [16468]) s/ui-dialog/wp-dialog/ in our dialog styles. props koopersmith, see #11420.

@nacin
6 years ago

Don't forget to send the title when making a pagination request.

#53 follow-ups: @ocean90
6 years ago

What happens if no title is defined: http://grab.by/7tiW

#54 in reply to: ↑ 53 @voyagerfan5761
6 years ago

Replying to ocean90:

What happens if no title is defined: http://grab.by/7tiW

Which could easily happen if, say, asides from the upcoming Post Formats feature are used, as they have no title. Good place to check for an empty string and use "(untitled)" or a localized version?

#55 @jane
6 years ago

@voyagerfan5761: I'm not sure, but the P2 theme basically takes the first x words and treats them like the title for listing on edit.php, would expect something similar.

#56 @nacin
6 years ago

(In [16479]) Internal linking cleanups. Fix combination of pagination and searching. Add a margin of error (ha, get it?) to triggering the river. props koopersmith, see #11420.

#57 @ryan
6 years ago

(In [16491]) Clear fields on refresh. Props koopersmith. see #11420

#58 @ryan
6 years ago

(In [16492]) Fill http by default. Props koopersmith. see #11420

#59 in reply to: ↑ 53 @ocean90
6 years ago

Replying to ocean90:

What happens if no title is defined: http://grab.by/7tiW

Would be fixed with no.title.11420.patch.

@batmoo
6 years ago

Caches AJAX results to avoid repeated calls for the same query

#60 follow-up: @batmoo
6 years ago

  • Cc batmoo@… added

Patch is supposed to cache search results to avoid multiple AJAX calls for the same query, but I noticed that it horribly breaks pagination. Reworking it so ignore.

#61 in reply to: ↑ 60 @nacin
6 years ago

Replying to batmoo:

Patch is supposed to cache search results to avoid multiple AJAX calls for the same query, but I noticed that it horribly breaks pagination. Reworking it so ignore.

Cool, nice improvement! Koop and I spoke about this, but it opens the door for a memory leak, so we need to tread lightly.

#62 @nacin
6 years ago

(In [16500]) IE8 fixes for internal linking. props koopersmith, see #15485, see #11420.

#63 @nacin
6 years ago

(In [16510]) Use 'Update' and 'Save Link' for internal linking submit button. props koopersmith, see #11420.

@sbressler
6 years ago

Rendering oddity for long titles. Happens in IE9 and Chrome, at the least.

#64 @sbressler
6 years ago

  • Cc sbressler@… added

Just attached a screenshot of an oddity with regards to display of post dates with posts with long titles.

#65 follow-up: @nacin
6 years ago

Incomplete list of items remaining:

  1. Expand/collapse on the internal linking section.
  2. Fix rendering issues for long titles and no titles. Row should expand. Items with no titles should say 'Untitled' in emphasis tags (not sure why that isn't showing up). A trim() should occur first to verify an empty title.
  3. IE7 fixes.
  4. IE6 fixes.
  5. (X) in the search box (well, all search boxes) to clear the search terms.

#66 in reply to: ↑ 65 @ocean90
6 years ago

@nacin
Patch for no title is already there: no.title.11420.patch

@batmoo
6 years ago

Fixes text wrapping issues (quick sanity check done in IE6)

#67 @batmoo
6 years ago

Patch should fix text wrapping issues when the title is too long. Needed to use a clearing div to make it work nicely with early IE.

@batmoo
6 years ago

Add for attributes to labels

#68 @batmoo
6 years ago

Patch adds for attributes to labels.

#69 follow-up: @nacin
6 years ago

(In [16750]) Fix handling of no titles and long titles in internal linking. see #11240.

That changeset should handle no titles and long titles. Need to confirm that clear: both was enough for IE6.

@batmoo
6 years ago

Title wonkiness in IE6 using r16750

@batmoo
6 years ago

Title wonkiness gone in IE6 with clearing element

#70 in reply to: ↑ 69 @batmoo
6 years ago

Replying to nacin:

That changeset should handle no titles and long titles. Need to confirm that clear: both was enough for IE6.

clear: both doesn't quite do it :( See 11420_text_wrapping.diff for a fix that works in IE6. Screenshots attached for both.

Also see ocean90's patch for the no title issue (no.title.11420.patch). Using the _draft_or_post_title function seems like a good idea.

#71 @nacin
6 years ago

_draft_or_post_title pushes things through the filter, which we weren't doing. Adding a trim here and allowing the JS to handle the no title seems to work fine.

The issue with 11420_text_wrapping.diff is that it puts a width limit on the title. But that's basically the only solution, as otherwise you can't float something to the right when it's after a block element in the HTML flow and expect it to appear on the same line in IE6. That's what's happening here.

We can probably get away with clearfix instead of the extra markup.

Going to let koopersmith review and advise.

#72 @nacin
6 years ago

(In [16784]) Handle posts without titles better in internal linking. see #11420.

#73 @nacin
6 years ago

Latest change leverages get_the_title(), as _draft_or_post_title() would have. Still handling "(no title)" through JS though, that way we can easily account for that and prevent "(no title)" from being added to the title attribute field.

#74 @ryan
6 years ago

  • Resolution set to fixed
  • Status changed from accepted to closed

Report remaining bugs on new tickets.

#76 @nacin
6 years ago

(In [16827]) Add the for atteibute to internal linking labels. props batmoo, see #11420.

Note: See TracTickets for help on using tickets.