Facebook Style Typography

Developer
ThatGuySam
Size
5,539 Kb
Views
40,480
  1. Facebook Style Typography Previews
  2. Facebook Style Typography HTML Codes
  3. Facebook Style Typography CSS Codes

How do I make an facebook style typography?

Based on http://media.fb.com/2015/05/12/instantarticles/?ref=producthunt. What is a facebook style typography? How do you make a facebook style typography? This script and codes were developed by ThatGuySam on 06 August 2022, Saturday.

Facebook Style Typography Previews
IQ Test

Facebook Style Typography - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Facebook Style Typography</title> <script src="//use.typekit.net/lee2ktp.js"></script>
<script>try{Typekit.load();}catch(e){}</script> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container1040">	<section id="blog-posts">
<article class="card post has-image">	<a href="http://media.fb.com/2015/05/12/instantarticles/">	<img width="722" height="382" src="https://fbookmedia.files.wordpress.com/2015/05/1-e1431456559724.jpg?w=1444" class="attachment-blog-landing wp-post-image" alt="1" originalw="722" src-orig="https://fbookmedia.files.wordpress.com/2015/05/1-e1431456559724.jpg?w=722" scale="2">	</a>	<h2><a href="http://media.fb.com/2015/05/12/instantarticles/">Introducing Instant Articles</a></h2>	<div class="date"><time pubdate="" datetime="2015-05-12T21:00:55+00:00">May 12, 2015</time></div>	<div class="post-content">	<p><em>By <a href="https://www.facebook.com/reckhow">Michael Reckhow</a>, Product Manager</em></p>
<p>Today we’re excited to introduce Instant Articles, a new product for publishers to create fast, interactive articles on Facebook.</p>
<p>As more people get their news on mobile devices, we want to make the experience faster and richer on Facebook. People share a lot of articles on Facebook, particularly on our mobile app. To date, however, these stories take an average of eight seconds to load, by far the slowest single content type on Facebook. Instant Articles makes the reading experience as much as ten times faster than standard mobile web articles.</p>
<div class="fb-video fb_iframe_widget fb_iframe_widget_fluid_desktop" data-allowfullscreen="true" data-href="https://www.facebook.com/fbmedia/videos/vb.127345500640211/882217825152971/" fb-xfbml-state="rendered" fb-iframe-plugin-query="allowfullscreen=true&amp;app_id=1467881390161840&amp;container_width=626&amp;href=https%3A%2F%2Fwww.facebook.com%2Ffbmedia%2Fvideos%2Fvb.127345500640211%2F882217825152971%2F&amp;locale=en_US&amp;sdk=joey" style="width: 100%;"><span style="vertical-align: bottom; width: 626px; height: 352px;"><iframe name="f15ef88b08" width="1000px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:video Facebook Social Plugin" src="http://www.facebook.com/plugins/video.php?allowfullscreen=true&amp;app_id=1467881390161840&amp;channel=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter%2FNM7BtzAR8RM.js%3Fversion%3D41%23cb%3Df12ffe2c8%26domain%3Dmedia.fb.com%26origin%3Dhttp%253A%252F%252Fmedia.fb.com%252Ff7d2029%26relation%3Dparent.parent&amp;container_width=626&amp;href=https%3A%2F%2Fwww.facebook.com%2Ffbmedia%2Fvideos%2Fvb.127345500640211%2F882217825152971%2F&amp;locale=en_US&amp;sdk=joey" style="border: none; visibility: visible; width: 626px; height: 352px;" class=""></iframe></span></div>
<p><span id="more-2481"></span></p>
<p>Along with a faster experience, Instant Articles introduces a suite of interactive features that allow publishers to bring their stories to life in new ways. Zoom in and explore high-resolution photos by tilting your phone. Watch auto-play videos come alive as you scroll through stories. Explore interactive maps, listen to audio captions, and even like and comment on individual parts of an article in-line.</p>
<p><a href="https://fbookmedia.files.wordpress.com/2015/05/2-photo.jpg"><img class="aligncenter size-large wp-image-2505" src="https://fbookmedia.files.wordpress.com/2015/05/2-photo.jpg?w=1252&amp;h=702" alt="2-Photo" width="640" height="359" originalw="640" originalh="359" src-orig="https://fbookmedia.files.wordpress.com/2015/05/2-photo.jpg?w=640&amp;h=359" scale="2"></a></p>
<p>We designed Instant Articles to give publishers control over their stories, brand experience and monetization opportunities. Publishers can sell ads in their articles and keep the revenue, or they can choose to use Facebook’s Audience Network to monetize unsold inventory. Publishers will also have the ability to track data and traffic through comScore and other analytics tools.</p>
<p><a href="https://fbookmedia.files.wordpress.com/2015/05/3-map.jpg"><img class="aligncenter size-large wp-image-2507" src="https://fbookmedia.files.wordpress.com/2015/05/3-map.jpg?w=1252&amp;h=702" alt="3-Map" width="640" height="359" originalw="640" originalh="359" src-orig="https://fbookmedia.files.wordpress.com/2015/05/3-map.jpg?w=640&amp;h=359" scale="2"></a></p>
<p>“Fundamentally, this is a tool that enables publishers to provide a better experience for their readers on Facebook” said Facebook Chief Product Officer Chris Cox. “Instant Articles lets them deliver fast, interactive articles while maintaining control of their content and business models.”</p>
<p><a href="https://fbookmedia.files.wordpress.com/2015/05/4-video.jpg"><img class="aligncenter size-large wp-image-2508" src="https://fbookmedia.files.wordpress.com/2015/05/4-video.jpg?w=1252&amp;h=702" alt="4-Video" width="640" height="359" originalw="640" originalh="359" src-orig="https://fbookmedia.files.wordpress.com/2015/05/4-video.jpg?w=640&amp;h=359" scale="2"></a></p>
<p>Facebook is working with nine launch partners for Instant Articles: The New York Times, National Geographic, BuzzFeed, NBC, The Atlantic, The Guardian, BBC News, Spiegel and Bild.</p>
<p><a href="https://fbookmedia.files.wordpress.com/2015/05/screen-shot-2015-05-13-at-8-50-43-am.jpg"><img class="aligncenter size-large wp-image-2519" src="https://fbookmedia.files.wordpress.com/2015/05/screen-shot-2015-05-13-at-8-50-43-am.jpg?w=1252&amp;h=252" alt="Screen Shot 2015-05-13 at 8.50.43 AM" width="640" height="129" originalw="640" originalh="129" src-orig="https://fbookmedia.files.wordpress.com/2015/05/screen-shot-2015-05-13-at-8-50-43-am.jpg?w=640&amp;h=129" scale="2"></a>Mark Thompson, President and CEO, The New York Times Company said, “The New York Times already has a significant and growing audience on Facebook. We’re participating in Instant Articles to explore ways of growing the number of Times users on Facebook, improving their experience of our journalism and deepening their engagement. We have a long tradition of meeting readers where they are and that means being available not just on our own sites, but on the social platforms frequented by many current and potential Times users.”</p>
<p>“It is great to see Facebook trialing new ways for quality journalism to flourish on mobile,” said Tony Danker, International Director, Guardian News &amp; Media. “The Guardian is keen to test how the new platform can provide an even more engaging experience for our readers. It is then vital that, over time, Instant Articles delivers recurring benefit for publishers, whose continued investment in original content underpins its success.”</p>
<p>Instant Articles is launching on Facebook for iPhone with a special set of stories published by The New York Times, BuzzFeed, National Geographic, NBC and The Atlantic. We will continue developing Instant Articles with our partners over the coming months and will listen to feedback from readers to help us improve the experience. For further information about Instant Articles, visit <a href="http://instantarticles.fb.com/">instantarticles.fb.com</a>.</p>
<p><b>Downloads:</b></p>
<p><a href="https://fbnewsroomus.files.wordpress.com/2015/05/press-images-e28094-new.zip">Screenshots</a></p>
<p><a href="https://fbnewsroomus.files.wordpress.com/2015/05/facebook-instant-articles-product-b-roll-video-mp4.zip">B-roll</a></p>
<p><a href="https://fbnewsroomus.files.wordpress.com/2015/05/facebook-instant-articles-video-embed-code-rtf.zip"> Instant Articles Video Embed Code</a></p>
<p>&nbsp;</p>	<div class="entry-meta">	<div class="entry-category">	<span class="entry-tag-title">Tags:</span>	<a href="http://media.fb.com/category/news/">News</a>	</div>	<div class="entry-fb-like fb-social-plugin fb-like fb_iframe_widget" data-font="lucida grande" data-href="http://media.fb.com/2015/05/12/instantarticles/" data-layout="button_count" data-send="true" data-width="150" fb-xfbml-state="rendered" fb-iframe-plugin-query="app_id=1467881390161840&amp;container_width=133&amp;font=lucida%20grande&amp;href=http%3A%2F%2Fmedia.fb.com%2F2015%2F05%2F12%2Finstantarticles%2F&amp;layout=button_count&amp;locale=en_US&amp;sdk=joey&amp;send=true&amp;width=150"><span style="vertical-align: bottom; width: 133px; height: 20px;"><iframe name="f3707d8b5c" width="150px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:like Facebook Social Plugin" src="http://www.facebook.com/plugins/like.php?app_id=1467881390161840&amp;channel=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter%2FNM7BtzAR8RM.js%3Fversion%3D41%23cb%3Df2a3cbb77%26domain%3Dmedia.fb.com%26origin%3Dhttp%253A%252F%252Fmedia.fb.com%252Ff7d2029%26relation%3Dparent.parent&amp;container_width=133&amp;font=lucida%20grande&amp;href=http%3A%2F%2Fmedia.fb.com%2F2015%2F05%2F12%2Finstantarticles%2F&amp;layout=button_count&amp;locale=en_US&amp;sdk=joey&amp;send=true&amp;width=150" style="border: none; visibility: visible; width: 133px; height: 20px;" class=""></iframe></span></div>	</div>	<nav class="navigation post-navigation" role="navigation">	<div class="nav-links">	<div class="nav-previous"><a href="http://media.fb.com/2015/05/04/cant-miss-videos-april/" rel="prev">Can’t Miss Videos: April</a></div>	</div><!-- .nav-links -->	</nav><!-- .navigation -->	</div>	<div class="flag">News</div>	</article>	</section>	<div id="secondary" class="widget-area" role="complementary">	</div><!-- #secondary -->
</div>
</body>
</html>

Facebook Style Typography - Script Codes CSS Codes

body { -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; background: #e9e9ed; color: #4e5665; font-family: "freight-sans-pro", "FreightSans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
}
#blog-posts { float: left; margin: 48px 48px 48px 0; width: 724px;
}
.card { background: #fff; padding: 48px; border: 1px solid #ddd; border-top: 0; margin-bottom: 48px; border-radius: 3px;
}
#blog-posts .post .attachment-blog-landing { display: block; margin: -32px -48px 0 -48px; border-radius: 3px 3px 0px 0px;
}
.post-content { color: #000; font-size: 15px; line-height: 24px;
}
p { margin-bottom: 1.5em;
}
Facebook Style Typography - Script Codes
Facebook Style Typography - Script Codes
Home Page Home
Developer ThatGuySam
Username ThatGuySam
Uploaded August 06, 2022
Rating 3
Size 5,539 Kb
Views 40,480
Do you need developer help for Facebook Style Typography?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

ThatGuySam (ThatGuySam) Script Codes
Name
Guts Less Mixins
Add This API
Quiet Email Subscribe Button
Instagram Follow Button
Stopwatch Embed
Pictures of Bill Murray
Angry Face
Google Cardboard Apps
Nike Cube Shadow Pure CSS
Auto Expiring Content
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!