[wp-trac] [WordPress Trac] #54173: Twenty Twenty-One: Social icons

[WordPress Trac]

#54173: Twenty Twenty-One: Social icons
-----------------------------------+------------------------------
 Reporter:  marco.milone           |       Owner:  (none)
     Type:  feature request        |      Status:  new
 Priority:  normal                 |   Milestone:  Awaiting Review
Component:  Bundled Theme          |     Version:
 Severity:  normal                 |  Resolution:
 Keywords:  has-patch 2nd-opinion  |     Focuses:
-----------------------------------+------------------------------
Changes (by sabernhardt):

 * keywords:  has-patch => has-patch 2nd-opinion


Comment:

 I'm not sure we should ''automatically'' replace a visible phone number
 with an icon in Twenty Twenty-One. I have added phone number links—among
 other text links—on clients' sites, where I would not want the number
 changed to an icon only. On the other hand, this change would make the
 call link visually consistent with (most) other links in the secondary
 menu location. Ultimately, this could benefit the majority of users who
 add links in that menu, but I think some other people would not be happy
 about it.

 In Seedlet 1.1.7, that theme added a
 [https://themes.trac.wordpress.org/browser/seedlet/1.1.13/classes/class-
 seedlet-svg-icons.php#L242 phone icon] to the social group, after Twenty
 Twenty-One became available. With bundled themes, though, we closed
 requests for new Twenty Twenty icons in favor of creating a filter (see
 ticket:48713#comment:7). (For what it's worth, I would prefer a phone icon
 instead of the generic link icon in Twenty Seventeen and Twenty Twenty.)

 Regardless of how we decide for this ticket, you could use Twenty Twenty-
 One's existing filters. The SVG in the example below comes from Seedlet,
 as others did for Twenty Twenty-One.
 {{{
 function wptrac54173_twenty_twenty_one_social_icons_map( $social_icons_map
 ) {
         $social_icons_map['phone'] = array(
                 'tel:',
         );

         return $social_icons_map;
 }
 add_filter( 'twenty_twenty_one_social_icons_map',
 'wptrac54173_twenty_twenty_one_social_icons_map' );

 function wptrac54173_twenty_twenty_one_svg_icons_social( $social_icons ) {
         $social_icons['phone'] = '<svg viewBox="-5 -5 24 24" version="1.1"
 xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-
 rule="evenodd" d="M1 1l1 4.5L4 3 3 1H1zm7.5 11l4.5 1v-2l-2-1-2.5 2z"
 fill="currentColor"/><path d="M2 5.5l-.732.163a.75.75 0 001.318.306L2
 5.5zM1 1V.25a.75.75 0 00-.732.913L1 1zm3 2l.586.469a.75.75 0 00.085-.804L4
 3zM3 1l.67-.335A.75.75 0 003 .25V1zm10 12l-.163.732A.75.75 0 0013.75
 13H13zm-4.5-1l-.469-.586a.75.75 0 00.306 1.318L8.5 12zm4.5-1h.75a.75.75 0
 00-.415-.67L13 11zm-2-1l.335-.67a.75.75 0 00-.804.084L11 10zM2.732
 5.337l-1-4.5-1.464.326 1 4.5 1.464-.326zm.682-2.806l-2 2.5 1.172.938
 2-2.5-1.172-.938zM2.33 1.335l1 2 1.342-.67-1-2-1.342.67zM1
 1.75h2V.25H1v1.5zm12.163 10.518l-4.5-1-.326 1.464 4.5 1 .326-1.464zM12.25
 11v2h1.5v-2h-1.5zm-1.585-.33l2 1 .67-1.34-2-1-.67 1.34zm-1.696
 1.916l2.5-2-.938-1.172-2.5 2 .938 1.172zM.25 1C.25 8.042 5.958 13.75 13
 13.75v-1.5C6.787 12.25 1.75 7.213 1.75 1H.25z"></path></svg>';

         return $social_icons;
 }
 add_filter( 'twenty_twenty_one_svg_icons_social',
 'wptrac54173_twenty_twenty_one_svg_icons_social' );
 }}}

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/54173#comment:7>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform