(English → Deutsch) View originalTranslators:
Recently, someone asked me how to put together a link in HTML that, when clicked, took the clicker to their Twitter page with a tweet already filled in. She basically wanted an easy way to let people share her newsletter. I was putting this little color-coded guide together for her and I thought I’d turn it into a blog post. Check it.lgm5hviw2p8prkhio6hb1vq9kib1ru13
Regular Ol’ Linksa4st7crct0z33yrfkbp6ilpa9yzb9toa
To begin, let’s review how to make a simple link in HTML. First, make sure you’re editing in HTML and not Rich Text. You’ll be able to tell because you’ll see a bunch of “t6arv1vmvd94tf1t674q1me67wdbvngf<"s and ">“s everywhere. Below is a color-coded diagram of the code for an HTML link. (If you’re a newbie to HTML, remember that your code won’t be in color)k684um6webzc24udcs2gpm28hf7bic4t
- Blue is the HTML code99t9kkda4k2sua38i8gvay4zm0fz7ty72zkmk2m19pb0qewnyla3916ql59wpnni7y79z60dkf4j11s7c8t5h7ypnk17m2sk
- Orange is the URL where the link will gotdhyezogegcf6alr7lg170u4okkfv33e
- Black is what the link will say8d1ggu1v29v1ypvbg6v4ftuim9rm3ib1ozqil7iy6i9dky26rzqycdk444t2af2p7u9qzwnirwmmtac3gqk7bupwuyn3j7yh
Example:2leaq2gj1hm9e1o96kectqno4rq80odsq1pz9w48rwjeaxu2ueniwe902272fquvbn55y8un81w4rdlu3f282rieyb66wf2y
Googlesvbwubw3i87bl1u1xf9xeiiab6wgeibx
Share on Twitter Linksg0zj29nk9jyofx3gt1ysuqzsi4jqvyf2
Creating a link to automatically fill in some Tweet text is pretty simple. You just need to know some additional code to stick into the HTML link code. Let’s take a look:n6oosqd10b729udcpo65afyt7jphvfj8
To make a link that, when clicked, sends the clicker to this:kn4o6pdfmx1tip0lwokeyl7wb99v8fei5ciwwcg8x3xgpxp00pq2atp3j44lt0hp
…use the following code:y4wyamuzhwt0np9f6col2x3nh5c1e1s3pezvjj2zhgozfvgv3453tcdzyjz2wa8b
Share This on Twittero0acz55herkt3wmb7xoe5qtzx8o7j1sx
- Blue is the HTML code99t9kkda4k2sua38i8gvay4zm0fz7ty72zkmk2m19pb0qewnyla3916ql59wpnni7y79z60dkf4j11s7c8t5h7ypnk17m2sk
- Green is the code that gets Twitter to generate a tweet through a linkyl86lxk1g21kj1pqge1nc8nemov6q1pf
- Red is the text of the tweet. You can’t use spaces in this area of HTML but you can get spaces in your tweet text by typing %20 instead.xxboyylfmpam3ci9iiw7ovqpwpnllxn8
- Orange is the URL that will be included in the tweet. Twitter will automatically shorten it to save space.tekyjukgy5jtqt9krohe9oly127rr0ha
- Black is what the link will say8d1ggu1v29v1ypvbg6v4ftuim9rm3ib1ozqil7iy6i9dky26rzqycdk444t2af2p7u9qzwnirwmmtac3gqk7bupwuyn3j7yh
Example:2leaq2gj1hm9e1o96kectqno4rq80odsq1pz9w48rwjeaxu2ueniwe902272fquvbn55y8un81w4rdlu3f282rieyb66wf2y
Share This on Twitter79wpngonilt342krnuu6pmqweewtv9is
Learn how to add #-hashtags and @-tag users with Share this on Twitter links.dt6leyfoeh5l9bawbtwo5zmz7ojyzwg3
Share on Facebook Links7y65qrvxhsgfjj02cka12ju9b0hg3bc0
Creating auto-share links for someone’s Facebook Wall is just as easy.ybrrqv6snt8ak3rurz2vpnfdod9acpa0
To make a link that, when clicked, sends the clicker to this:kn4o6pdfmx1tip0lwokeyl7wb99v8fei5ciwwcg8x3xgpxp00pq2atp3j44lt0hp
…use the following code:y4wyamuzhwt0np9f6col2x3nh5c1e1s3pezvjj2zhgozfvgv3453tcdzyjz2wa8b
Share This Link on Facebooka5ir5gss7s6hpsxbgfx2glp05crdm3xn
- Blue is the HTML code99t9kkda4k2sua38i8gvay4zm0fz7ty72zkmk2m19pb0qewnyla3916ql59wpnni7y79z60dkf4j11s7c8t5h7ypnk17m2sk
- Green is the code that gets Facebook to generate a wall post through a linkn8315gccz1chhsckse22ds08afioefts
- Orange is the URL that will be attached to the post.e8ke5j5m0zj7ph55gz0a1a6a2ycojnio
- Black is what the link will say8d1ggu1v29v1ypvbg6v4ftuim9rm3ib1ozqil7iy6i9dky26rzqycdk444t2af2p7u9qzwnirwmmtac3gqk7bupwuyn3j7yh
Example:2leaq2gj1hm9e1o96kectqno4rq80odsq1pz9w48rwjeaxu2ueniwe902272fquvbn55y8un81w4rdlu3f282rieyb66wf2y
Share This Link on Facebookbzzw97rwo0w4f3w2mhp7zd8b0m0ls3ct
What are your favorite tricks to make your links do more?ew9k60yhj24i2uql0culq64qjnktj56o
Get more out of your Share on Twitter links with this post
Making a ‘Tweet This’ Button with # and @32fpeyoxruvvw8z0wzkgoelrql8k03at
9lpl5zyy577w10742ymh58zd1vuq6a85
(original) View Deutsch translation
Recently, someone asked me how to put together a link in HTML that, when clicked, took the clicker to their Twitter page with a tweet already filled in. She basically wanted an easy way to let people share her newsletter. I was putting this little color-coded guide together for her and I thought I’d turn it into a blog post. Check it.
Regular Ol’ Links
To begin, let’s review how to make a simple link in HTML. First, make sure you’re editing in HTML and not Rich Text. You’ll be able to tell because you’ll see a bunch of “<"s and ">“s everywhere. Below is a color-coded diagram of the code for an HTML link. (If you’re a newbie to HTML, remember that your code won’t be in color)
- Blue is the HTML code
- Orange is the URL where the link will go
- Black is what the link will say
Example:
Share on Twitter Links
Creating a link to automatically fill in some Tweet text is pretty simple. You just need to know some additional code to stick into the HTML link code. Let’s take a look:
To make a link that, when clicked, sends the clicker to this:
…use the following code:
- Blue is the HTML code
- Green is the code that gets Twitter to generate a tweet through a link
- Red is the text of the tweet. You can’t use spaces in this area of HTML but you can get spaces in your tweet text by typing %20 instead.
- Orange is the URL that will be included in the tweet. Twitter will automatically shorten it to save space.
- Black is what the link will say
Example:
Learn how to add #-hashtags and @-tag users with Share this on Twitter links.
Share on Facebook Links
Creating auto-share links for someone’s Facebook Wall is just as easy.
To make a link that, when clicked, sends the clicker to this:
…use the following code:
- Blue is the HTML code
- Green is the code that gets Facebook to generate a wall post through a link
- Orange is the URL that will be attached to the post.
- Black is what the link will say
Example:
What are your favorite tricks to make your links do more?
Get more out of your Share on Twitter links with this post
Making a ‘Tweet This’ Button with # and @
