Twitter share dynamic content


I’m working on my “Random Quote Machine” project and I’m trying to implement a Twitter button that shares the generated quote. I have, however, no idea on how to achieve this. Any tips?

This is what I have now ->
I’ve been thinking about assigning the “.message” content to Twitter, but I don’t know how :frowning:

Thanks for your attention!

After getting a new quote, you can change the tweet button’s href attribute like so:

$('.twitter-share-button').attr('href', '' + $('.message').text());

That looks awesome, and it looks like something similar should work for me. But I can’t seem to figure it out (after a couple full days of trying things).

Instead of changing the whole href, I just want to change my attribute data-text to be what my quote is.

Here’s my CodePen.

Any help is appreciated!


Edit: I might try this?

I’m not really familiar with using the Twitter widget. From what I can find, the widget uses the default blah blah text from the data attributes, even when you get a new quote. There’s probably a way to dynamically update the widget when you hit the new quote button.

Yeah, that’s what I was trying to do. I just put that blah blah in there as a placeholder. It seems like you could use jquery’s .attrs but I haven’t figured it out.

I think there’s something like a Twitter plugin for jQuery. Maybe you can use that?

1 Like

Hmm, I’ll look into it. Thank you.

Well I guess the simplest way was to generate the whole string on click (instead of just changing the data-text field).

As they did here.

Mine is updated and I’m happy-ish with it.