A Pen by JFarrow.

index.html

<h1>Twitter Web Intent: Tweet</h1>

<p>Quick form to help you create a 'tweet' button for your users.</p>

<h2>Form</h2>

<label for="message">Message:</label>
<input id="message" type="text" />
<label for="hashtag">#:</label>
<input id="hashtag" type="text" />
<label for="hashtag">@:</label>
<input id="related" type="text" />

<input id="go" type="submit" value="Get the Code" class="btn" />

<h3>Result</h3>
<textarea id="result" value="" type="text" class="result" disabled></textarea>

script.js

$('#go').click(function() {
    
    var message = $('#message').val();
    var hashtag = $('#hashtag').val();
    var related = $('#related').val();
    
    var url = "<a href='http://twitter.com/intent/tweet?text=" + message + "&hashtags=" + hashtag + "&related=" + related + "'>tweet</a>";
    
    $('#result').val(url);
});

style.scss

body{
  background: -webkit-linear-gradient(45deg, #9c7762 0%,#75b1b1 100%);
	background:    -moz-linear-gradient(45deg, #9c7762 0%,#75b1b1 100%);
	background:      -o-linear-gradient(45deg, #9c7762 0%,#75b1b1 100%);
}
h1,h2,h3 { font-weight: bold; margin-bottom: 10px;}

h1 { font-size: 24px;}
h2 { font-size: 20px;}
h3 { font-size: 18px;}

p { margin-bottom: 20px;}

label { clear: both; margin-top: 20px; display: block;}
.result {
display: block;
    width: 300px;
}

.btn {
display: block;
padding: 2px 10px;
 font-size: 16px;
  margin-top: 20px;
  margin-bottom: 40px;
}

Twitter-Web-Intent:-Tweet.markdown

Twitter Web Intent: Tweet

Quick form to help you create a tweet button you can stick on your website.

Forked from Rick Chadwick's Pen Twitter Web Intent: Tweet.

A Pen by JFarrow on CodePen.

License.