Topic footer Reply button can break the thread

UX
1

Hello,

Yeah I know this is an interesting situation. I write this topic because it seems the blue Reply button is more popular (especially on mobile [1]) then the reply button in the post. This is a problem if the answer is actually to the latest post and not to the OP.

There are two problem with this:

  1. The actual person to whom the message was sent will not be notified unless they have been mentioned or quoted.

  2. When this happens staff have a much harder job with for example move posts because these posts cannot be selected with (select + replies) and it can break the thread (conversation) if they don’t notice it.

I am thinking what would be the best to handle this. Maybe simple rename the blue button to Reply to topic or somehow indicate that button is for reply to the OP… :thinking:

I decided to change the topic footer Reply button to Reply to topic and add a section title Topic Controls on desktop. On mobile the Topic Controls already there on dropdown.

Hopefully, in this way, the users will also see better that they are responding to the topic (OP) with that button. :slightly_smiling_face:

  1. because there is only icon in post reply ↩︎

3 Likes
2

i tend to agree, i sometimes use the wrong button myself. i may steal your idea and rename one of them. on our forum, we use the quick quote component and it works great because you know you are responding to a post.

3 Likes
3

Yeah, but renaming the topic footer (blue) Reply is possible now with a theme component because the topic footer reply button and reply button in posts has a same string js.topic.reply.title. So if you change this both button will change.

You can change it for the topic footer button with adding this to a new theme component or an existing one.

Common / CSS

#topic-footer-buttons {
  .topic-footer-main-buttons {
    button.btn-primary.create {
      span.d-button-label:after {
        // Adding this content after Reply
        content: " to topic";
      }
    }
  }
}

This is a great component thanks for sharing :slightly_smiling_face: I will check this too. :heart:

4 Likes
4

Really? Even when used to answer to several persons?

What about situations where a reply starts with quote and next chapter is actually reply to topic?

I think this is a bit confusing. And… because so many ordinary users aren’t using (and totally understanding the difference) ”right” answer-button, I’m not totally sure it works so perfectly.

What would be better option? I don’t know.

2 Likes
5

not sure what you mean but one can use the quick quote multiple times via copy and paste in the same post to reply to different people. i really don’t understand your concern? next chapter? “right” answer-button? i have no idea what you are referring to?

6

anyways, i renamed the bottom reply button now and i like that difference it is a bit clearer on the interface. thank you for the code snippet @dodesz :slight_smile:

1 Like
7

This is an answer to you.

But this is an anwer to Don.

Splendid indeed! Can we… change text similar way to Reply Post button too?

And this one could be a topic reply:

I reckon the main issue isn’t (Quick quote component solves it out, though) quoting and/or tagging per se, but two different buttons are doing same thing, but acting slightly differently.

From otherside I understand it. For users reply is reply is reply. But… if one reads a post/comment/answer why don’t they just use the closest reply-button, but the very last one?

Yes, I know. Without a quote happens this and that, but still.

—

Do you follow me at all now? How should this post act: as a reply to you, a reply to Don, neither one or both? Sure — I did quote, and that actually makes quite useless trying to think what kind reply this is.

8

You see, the fact you quoted both posts made automatic back-references: you can see your post after clicking on the 1 Reply ⌄ button that now exists on both posts you quoted.

I agree that some clearer differentiation between “Reply” buttons may be helpful, I’ll probably test it on my community too.

2 Likes
9

Damn! You are totally right. Everyday something new, but how could I miss that :man_facepalming:

3 Likes
10

not just the back ref links (up arrows), but also quote boxes if you click/tap the down arrows:

image
image1506×1828 253 KB

apologies, i think i just misunderstood you earlier.

1 Like
11

Thanks for this Don, I have been wanting to do this for years! I took your idea one step further for my needs. Since my site is a bit different and each category is different and not just straight discussions, I choose to change the reply button text completely. So for my image critique category I changed it to “Give Critique or Reply”, by adding the ‘or Reply’ I believe it gets around Jakke’s concern. Thanks for bringing that up Jakke, I initially had it set to only “Give Critique”, but you’re right that it doesn’t work for all situations.

I don’t love the font-size: 0 trick, but I couldn’t get the visibility:hidden trick to work with this for some reason. Also, I tried to set the font-size to 1em rather than px, but that didn’t seem to work either. I ended up going with a slightly larger font to make that button stand out, but I would prefer to use em so the font will scale.

// Image Critique
body.category-image-critiques-abstract-critiques,
body.category-image-critiques-avian-critiques,
body.category-image-critiques-flora-critiques,
body.category-image-critiques-human-fauna-critiques,
body.category-image-critiques-landscape-critiques,
body.category-image-critiques-macro-critiques,
body.category-image-critiques-night-critiques,
body.category-image-critiques-non-nature-critiques,
body.category-image-critiques-wildlife-critiques,
body.category-image-critiques-weekly-challenge {
  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label {
          //hide reply text
          font-size: 0;
        }
      }
    }
  }

  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label:after {
          // New text
          font-size: 18px;
          content: "Critique Image or Reply";
        }
      }
    }
  }
}

This is especially great for my AMA category where I changed the reply button to “Ask Question”, perfect! It also helps the person doing the AMA understand that they need to use the little reply button.

// AMA
body.category-learning-ama {
  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label {
          //hide reply text
          font-size: 0;
        }
      }
    }
  }

  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label:after {
          // New text
          font-size: 18px;
          content: "Ask a question";
        }
      }
    }
  }
}

I also set a background color for the reply button so it stands out a bit more. I haven’t figured out how to make it transition properly for hovering, any ideas there would be helpful…

.discourse-no-touch .topic-body .actions .fade-out {
    background: var(--primary-low);
}

image
image1880×1430 116 KB

Anyway, hopefully my rambling will help others!

2 Likes