Twitter Bootstrap Question posted in

Allowing my tweet button to share the random quotes – Twitter bootstrap

Good morning everyone, I know this question has been asked before, but as a Noob to Javascript which i am struggling to learn, I cannot fathom out how to get my Twitter button to share the random quotes. If possible could a kind dev please explain to me how to actually type it out. I have a good understanding of HTML, CSS and Bootstrap but would appreciate someone explaining this to me.

Many Thanks in advance.

var quotes = [
  "'It is never too late to be what you might have been.' - George Eliot",
  "'What lies behind us and what lies before us are tiny matters compared to what lies within us.' - Henry Stanley Haskins",
  "'Great thoughts speak only to the thoughtful mind, but great actions speak to all mankind.' - Emily P. Bissell",
  "'I haven’t failed. I’ve just found 10,000 ways that don’t work.' - Thomas Edison",
  "'In between goals is a thing called life, that has to be lived and enjoyed.' - Sid Caesar"
]
function newQuote() {
  var randomNumber = Math.floor(Math.random() * (quotes.length));
  document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
}
<html>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<body>
  
  
  <h1>Simple Quote Generator</h1>
  <div id="quoteDisplay">
  </div>
    
  <div class="quoteButton">
  <button onclick="newQuote()">New Quote</button>
   
  </div>
  <a href="http://twitter.com/intent/tweet/?text" title="Share on Twitter" target="blank" class="btn btn-twitter-"><i class="fa fa-twitter"></i> Twitter</a>
  <script src="javascript.js"></script>
</body>
</html>
Tags:

2

Answers


  1. 0

    Your link’s target is static, it’s always twitter.com/intent/tweet/?text. I’m not familiar with the Twitter API, but I guess it expects something like ?text=some&encoded&text at the end of the URL.
    You need to set the value for the text :

    <a href="" id="twitterLink">

function newQuote() {
  var randomNumber = Math.floor(Math.random() * (quotes.length));
  document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];

  document.getElementById('twitterLink').href = "http://twitter.com/intent/tweet/?text=" + encodeURIComponent(quotes[randomNumber])

}
    Login or Signup to reply.
  2. 0 
    <span class="tweetquote" style="margin:15px; padding:15px; border:1px solid #ddd;">
<a  href="https://twitter.com/intent/tweet?url=https://twitter.com&;text=Tweet This piece of content the Entire quote in content and its url&;via=twitter&;" title="Tweet This piece of content the Entire quote in content and its url" target="_blank" rel="noopener noreferrer">Tweet This piece of content the Entire quote in content and its url</a>
<a href="https://twitter.com/intent/tweet?url=https://twitter.com&;text=Tweet This piece of content the Entire quote in content and its url&;via=twitter&;" title="Tweet This piece of content the Entire quote in content and its url" target="blank" class="btn btn-twitter-"><i class="fa fa-twitter"></i>Tweet</a>

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search