/
index.html
executable file
·127 lines (105 loc) · 10.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Write 25 headlines · If you want more clicks, you have to exercise your brain.</title>
<meta name="description" content="Write better headlines & get more clicks.">
<meta name="author" content="Neal Shyam">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='//fonts.googleapis.com/css?family=Oswald:400|Lato:500' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/styles.css">
<!--[if lt IE 9]>
<script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Twitter Card data -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@nealrs">
<meta name="twitter:creator" content="@nealrs">
<meta name="twitter:title" content="25 Headlines">
<meta name="twitter:description" content="Write better headlines & get more clicks.">
<meta name="twitter:image:src" content="https://raw.githubusercontent.com/nealrs/25Headlines/gh-pages/img/25Headlines.png">
<!-- Open Graph data -->
<meta property="og:title" content="25 Headlines" />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://nealrs.github.io/25Headlines/" />
<meta property="og:image" content="https://raw.githubusercontent.com/nealrs/25Headlines/gh-pages/img/25Headlines.png" />
<meta property="og:description" content="If you want more clicks, you have to excercise your brain." />
<meta property="og:site_name" content="25 Headlines" />
<!--<meta property="fb:admins" content="Facebook numeric ID" />-->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-110784667-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-110784667-1');
</script>
</head>
<body>
<h1>25 <span id="contentType">Headlines</span></h1>
<h3 id="subHead">Copywriters aren't born, they practice.</h3>
<p id="credit">Inspired by <a href="https://www.slideshare.net/Upworthy/upworthy-10-ways-to-win-the-internets" target="_blank" title="Adam is one of the Upworthy guys, duh.">Upworthy</a> & <a href="https://blog.kissmetrics.com/ultimate-home-page-headline/" target="_blank" title="KISSmetrics runs an excellent blog">KissMetrics</a>.</p>
<p class="applink">Do you like Jeopardy? Check out Think Fast Trivia on <a href="https://channelstore.roku.com/details/591781/think-fast-trivia" target="_blank" title="Install the free Think Fast Trivia Screensaver">Roku</a> and <a href="https://www.instagram.com/thinkfasttrivia/" target="_blank" title="Follow @ThinkFastTrivia on IG for awesome daily updates">Instagram</a>!</p>
<div id="selectors" class="btnContainer">
<h4>
<a id="selh" class="sel sela" title="Write headlines">Headlines</a>
<a href="twitter.html" id="selt" class="sel" title="Write tweets">Tweets</a>
<a href="email.html" id="sele" class="sel" title="Write email subject lines">Emails</a>
</h4>
</div>
<div>
<p>
<span class="length"><span id="len1" class="len leny" title="optimal length">50</span> Eh, ok</span>
<span class="length"><span id="len2" class="len leno" title="long, but still ok">62</span> Long</span>
<span class="length"><span id="len3" class="len lenr" title="max length allowed">100</span> No way</span>
</p>
</div>
<form id="form">
<div class="line"><p><span class="num">1.</span><input type="text" class="hl" id="h1" required placeholder="Who Else Wants a Killer Robot?" name="h1" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">2.</span><input type="text" class="hl" id="h2" required placeholder="The Secret of Giant Pandas" name="h2" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">3.</span><input type="text" class="hl" id="h3" required placeholder="Here's the Miracle That's Helping Bros Live Longer" name="h3" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">4.</span><input type="text" class="hl" id="h4"required placeholder="Little Known Ways to Nurse Your Cat" name="h4" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">5.</span><input type="text" class="hl" id="h5"required placeholder="Now You Can Have a Great Body Without Paying Too Much" name="h5" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">6.</span><input type="text" class="hl" id="h6" required placeholder="Annihilate Watermelons Like Gallagher" name="h6" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">7.</span><input type="text" class="hl" id="h7" required placeholder="Own the Yacht Your Neighbors Dream About" name="h7" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">8.</span><input type="text" class="hl" id="h8" required placeholder="What Everybody Ought to Know About Spiders" name="h8" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">9.</span><input type="text" class="hl" id="h9" required placeholder="100 Ways to Style Butter" name="h9" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">10.</span><input type="text" class="hl" id="h10" required placeholder="He Took the Road Less Traveled — You'll Never Guess What Happened Next" name="h10" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">11.</span><input type="text" class="hl" id="h11" required placeholder="How to Get Rid of Stubborn Bonos" name="h11" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">12.</span><input type="text" class="hl" id="h12" required placeholder="Fewer Zombies in 7 Days or Your Money Back!" name="h12" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">13.</span><input type="text" class="hl" id="h13" required placeholder="Now You Can Win Hackathons Even If You Don't Know Node.js" name="h13" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">14.</span><input type="text" class="hl" id="h14" required placeholder="How to Shop at Ikea Without Murdering Your Spouse" name="h14" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">15.</span><input type="text" class="hl" id="h15" required placeholder="684,935 Bedbugs Agree, Your Apartment Is Infested" name="h15" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">16.</span><input type="text" class="hl" id="h16" required placeholder="25 Reasons Why Manhattan Is Man-Has-Been" name="h16" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">17.</span><input type="text" class="hl" id="h17" required placeholder="Why SEO Gives Marketers Aneurysms" name="h17" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">18.</span><input type="text" class="hl" id="h18" required placeholder="The Ultimate Twerking Compilation Video" name="h18" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">19.</span><input type="text" class="hl" id="h19" required placeholder="The Brilliant, Super Fast Way to Shotgun a Beer" name="h19" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">20.</span><input type="text" class="hl" id="h20" required placeholder="Rage Spend Like a Jilted Kardashian" name="h20" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">21.</span><input type="text" class="hl" id="h21" required placeholder="The Future of Sharks Is Here" name="h21" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">22.</span><input type="text" class="hl" id="h22" required placeholder="Nebraska Just Got Exciting" name="h22" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">23.</span><input type="text" class="hl" id="h23" required placeholder="5 Lies Your Friends Tell You Everyday" name="h23" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">24.</span><input type="text" class="hl" id="h24" required placeholder="The Programming Language That RMS Actually Likes" name="h24" spellcheck="true"/><span class="count">0</span></p></div>
<div class="line"><p><span class="num">25.</span><input type="text" class="hl" id="h25" required placeholder="Avoid Embarrassment: Learn How to Turn down for What" name="h25" spellcheck="true"/><span class="count">0</span></p></div>
<!-- this button should go to a PH style voting interface so you can let colleagues help you pick a headline.-->
<!--<input type="submit" class="feedback" value="Help me pick a headline">-->
<!--<input type="submit" class="feedback" value="get feedback">-->
<div id="actionButtons" class="btnContainer">
<h4>
<a id="reset" class="reset" title="Delete all headlines and begin again.">clear all</a>
<a id="download" class="download" title="Download all headlines in a text file.">download</a>
<a id="share" class="download" title="Download & share headlines">share</a>
</h4>
</div>
</form>
<p>© 2020 · <a href="https://nealshyam.com" target="_blank" title="Neal Shyam is an awesome dude!">Neal Shyam</a> · <a href="mailto:nealrs@gmail.com" title="I'd love to get your feedback!">feedback plz</a></p>
<!-- JaVAVAVAVAVascript -->
<script
src="//code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
crossorigin="anonymous"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/uuid/8.1.0/uuidv4.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>