Bixal / bixal-site-drupal

Bixal drupal site
https://www.bixal.com
0 stars 0 forks source link

Contact Information - Contact Info #122

Closed mpbixal closed 5 months ago

mpbixal commented 6 months ago

How the contact info was added to https://stage-y77w3ti-tsvj5tw7p3f66.us.platformsh.site/node/30 adds a bunch of extra

tags that adds a lot of space: image

@mejiaj has added this to storybook with recommended dom: Note the wrapping

tag http://localhost:5050/?path=/story/pages-contract-vehicles-contract-vehicle--default image

I went into Drupal and saved this into WYSIWYG

<address>
    <strong>Maricarmen Smith-Martinez</strong><br>
    <strong>Senior Director, Strategic Growth and Partnerships</strong><br>
    <a href="mailto:maricarmen.smith-martinez@bixal.com">Maricarmen Smith-Martinez</a><br>
    <a href="tel:+1-703-634-5701">703.634.5701</a><br>
</address>

And it came out like: image Note how it 'helpfully' added <p> tags inside the <address>...

Anyway you shake it, it's going to be hard to add this dom to a contract vehicle > Key Points of Contact section.

What are your guys thoughts on either:

  • Somehow making this easy to add from the WYSIWYG or
  • Adding a group of fields below 'Key Points of Contact section' of a text plain multiple for names, an email field, and a telephone field and then we have full control of the fields and the output?
buddy-harlow commented 5 months ago

@mpbixal I think the second option would likely be the cleanest for making this happen. @mejiaj What do you think?

mejiaj commented 5 months ago

@mpbixal @buddy-harlow a few questions…

  1. How difficult would it be to strip the wrapping <p> inside of <address>?
  2. What are some tips for making it easier to add in WYSIWYG?

The tag is meant to make the content more semantic & accessible. Option two seems like a good solution. Especially if the LOE is low.

mpbixal commented 5 months ago

@buddy-harlow @mejiaj

  1. This is doable, it's just adding another formatter plugin which we've done many times
  2. This is the real rub, if there is no button for it, people are not going to manually type these things. If we want to go this route I think this comment right here is a great place to start https://www.drupal.org/project/wysiwyg_template/issues/3264254#comment-14420830. I've never attempted to extend Ckeditor in Drupal but it would be a lot of fun. It may be possible to add an 'address' button and then they already can create bold text and links, but I'm not sure how complicated that is to do in Ckeditor.

Another interesting approach we might be able to take, is to make an 'address' media type with the same fields, that way they could embed it just like an image. But that seems pretty janky to make something just text media.