Skip to content
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

Update social links block to output a custom class on each individual link #20998

Merged
merged 1 commit into from Mar 21, 2020

Conversation

brentswisher
Copy link
Contributor

Description

Fixed #19335 by updating render_block_core_social_link() to append a custom class to each <li> if one is present.

How has this been tested?

  • Create a post with a social links block.
  • Click to select an individual link (not the whole block).
  • Add a custom css class to "Additional CSS class(es)" under the "Advanced" panel.
  • Publish the post and see that the <li> has your custom class appended.
  • Also, add a custom class to the entire block and see that it still works as well.

Screenshots

Edit_Post_‹gutenberg—_WordPress
Add a custom class 'CUSTOM' to the individual link

Edit_Post_‹gutenberg—_WordPress 2
Add a custom class 'Banana' to the entire block

DevTools_-_localhost_8888__p_7_preview_id_7_preview_nonce_65857c213d_preview_true_and_gutenberg
See that they both render correctly on the public side

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@github-actions
Copy link

github-actions bot commented Mar 18, 2020

Size Change: 0 B

Total Size: 856 kB

ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 998 B 0 B
build/annotations/index.js 3.43 kB 0 B
build/api-fetch/index.js 3.39 kB 0 B
build/autop/index.js 2.58 kB 0 B
build/blob/index.js 620 B 0 B
build/block-directory/index.js 6.02 kB 0 B
build/block-directory/style-rtl.css 760 B 0 B
build/block-directory/style.css 760 B 0 B
build/block-editor/index.js 100 kB 0 B
build/block-editor/style-rtl.css 10.9 kB 0 B
build/block-editor/style.css 10.9 kB 0 B
build/block-library/editor-rtl.css 7.24 kB 0 B
build/block-library/editor.css 7.24 kB 0 B
build/block-library/index.js 110 kB 0 B
build/block-library/style-rtl.css 7.41 kB 0 B
build/block-library/style.css 7.42 kB 0 B
build/block-library/theme-rtl.css 669 B 0 B
build/block-library/theme.css 671 B 0 B
build/block-serialization-default-parser/index.js 1.65 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 57.5 kB 0 B
build/components/index.js 191 kB 0 B
build/components/style-rtl.css 15.8 kB 0 B
build/components/style.css 15.7 kB 0 B
build/compose/index.js 6.21 kB 0 B
build/core-data/index.js 10.6 kB 0 B
build/data-controls/index.js 1.04 kB 0 B
build/data/index.js 8.2 kB 0 B
build/date/index.js 5.37 kB 0 B
build/deprecated/index.js 771 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 3.06 kB 0 B
build/edit-post/index.js 91.2 kB 0 B
build/edit-post/style-rtl.css 8.47 kB 0 B
build/edit-post/style.css 8.46 kB 0 B
build/edit-site/index.js 5.56 kB 0 B
build/edit-site/style-rtl.css 2.62 kB 0 B
build/edit-site/style.css 2.62 kB 0 B
build/edit-widgets/index.js 4.43 kB 0 B
build/edit-widgets/style-rtl.css 2.58 kB 0 B
build/edit-widgets/style.css 2.58 kB 0 B
build/editor/editor-styles-rtl.css 381 B 0 B
build/editor/editor-styles.css 382 B 0 B
build/editor/index.js 43.8 kB 0 B
build/editor/style-rtl.css 3.97 kB 0 B
build/editor/style.css 3.96 kB 0 B
build/element/index.js 4.44 kB 0 B
build/escape-html/index.js 733 B 0 B
build/format-library/index.js 6.95 kB 0 B
build/format-library/style-rtl.css 502 B 0 B
build/format-library/style.css 502 B 0 B
build/hooks/index.js 1.93 kB 0 B
build/html-entities/index.js 621 B 0 B
build/i18n/index.js 3.49 kB 0 B
build/is-shallow-equal/index.js 711 B 0 B
build/keyboard-shortcuts/index.js 2.3 kB 0 B
build/keycodes/index.js 1.69 kB 0 B
build/list-reusable-blocks/index.js 2.99 kB 0 B
build/list-reusable-blocks/style-rtl.css 226 B 0 B
build/list-reusable-blocks/style.css 226 B 0 B
build/media-utils/index.js 4.84 kB 0 B
build/notices/index.js 1.58 kB 0 B
build/nux/index.js 3.01 kB 0 B
build/nux/style-rtl.css 616 B 0 B
build/nux/style.css 613 B 0 B
build/plugins/index.js 2.54 kB 0 B
build/primitives/index.js 1.5 kB 0 B
build/priority-queue/index.js 780 B 0 B
build/redux-routine/index.js 2.83 kB 0 B
build/rich-text/index.js 14.4 kB 0 B
build/server-side-render/index.js 2.55 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/url/index.js 4.01 kB 0 B
build/viewport/index.js 1.61 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.18 kB 0 B

compressed-size-action

Copy link
Member

@jorgefilipecosta jorgefilipecosta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍
Thank you for this fix!

@@ -19,14 +19,15 @@ function render_block_core_social_link( $attributes ) {
$attributes['label'] :
/* translators: %s: Social Link service name */
sprintf( __( 'Link to %s' ), block_core_social_link_get_name( $service ) );
$class_name = ( isset( $attributes['className'] ) ) ? ' ' . $attributes['className'] : false;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems we can remove the external parentheses ( isset( $attributes['className'] ) ) right?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah no problem, that was just how the rest of the ternary assignments were written for the other attributes in the function so I thought it might be a WordPress coding convention, I can update

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's been updated to remove the external parentheses

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry did not notice the other attributes also had parentheses, anyway I think they are not required so thank you for the update 👍

@jorgefilipecosta jorgefilipecosta moved this from Needs Review to Approved in WordPress 5.4 Must Have Mar 20, 2020
@brentswisher brentswisher force-pushed the update/social-link-custom-class branch from 8754ef3 to 811c6e3 Compare March 20, 2020 17:55
@jorgefilipecosta jorgefilipecosta merged commit b16542e into master Mar 21, 2020
WordPress 5.4 Must Have automation moved this from Approved to Done Mar 21, 2020
@jorgefilipecosta jorgefilipecosta deleted the update/social-link-custom-class branch March 21, 2020 16:29
@github-actions github-actions bot added this to the Gutenberg 7.8 milestone Mar 21, 2020
@jorgefilipecosta jorgefilipecosta added [Type] Bug An existing feature does not function as intended Backport to WP Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta labels Mar 21, 2020
@jorgefilipecosta jorgefilipecosta removed the Backport to WP Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta label Mar 27, 2020
@ellatrix ellatrix mentioned this pull request Jun 16, 2020
12 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Bug An existing feature does not function as intended
Projects
No open projects
Development

Successfully merging this pull request may close these issues.

Social Links Block: custom class not applied to individual icons
2 participants