Pulls quotes from quotesbydesign API and posts to Twitter.
A Pen by Ashlynn Pai on CodePen.
-
-
Save ashlynnpai/708d42b762b0451bfe6af275cfde41ae to your computer and use it in GitHub Desktop.
Quotes
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <button id="getQuote">Get a Quote | |
| </button> | |
| <h1 id="quote-content"> | |
| </h1> | |
| <h2 id="quote-title"> | |
| </h2> | |
| <button id="btnTweet">Tweet This</button> | |
| </body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var posts = []; | |
| $(document).ready(function(){ | |
| $('#btnTweet').hide(); | |
| var url = 'https://cors-anywhere.herokuapp.com/https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=10'; | |
| $.getJSON( url, function(data) { | |
| posts = data; | |
| }); | |
| $('#getQuote').on('click', function() { | |
| post = posts.shift() | |
| $('#quote-title').html("--" + post.title); | |
| $('#quote-content').html(post.content); | |
| $('#btnTweet').show(); | |
| posts.push(post); | |
| }); | |
| $('#btnTweet').click(function (e) { | |
| tweet = post.content + " -- " + post.title; | |
| var twtLink = 'http://twitter.com/home?status=' +encodeURIComponent(tweet); | |
| window.open(twtLink,'_blank'); | |
| }); | |
| }); | |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @import url(https://fonts.googleapis.com/css?family=Dancing+Script); | |
| body { | |
| font-family: 'Dancing Script', Helvetica, Serif; | |
| text-align: center; | |
| } | |
| button { | |
| display:block; /* change this from inline-block */ | |
| width:20%; /* setting the width */ | |
| margin:0 auto; /* this will center it */ | |
| position:relative; | |
| text-align:center; | |
| font-size: 24px; | |
| color: #275cb2; | |
| border-radius: 5px; | |
| background: #FFF8DC; | |
| padding: 5px; | |
| } | |
| #getQuote { | |
| margin-top: 50px; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment