I’m bringing you a new article and a new design for News47ell, featuring a right sidebar and a black 1px border around pretty much everything. I’m also launching Weekly47ell newsletter, my first ever newsletter, which will be once a week (duh) Thursday at 21:00 and will contain the latest articles published here.
After leaving The Verge which he co-founded with few other great people, and after being personally fired by Michael Rubens Bloomberg, founder & CEO of Bloomberg L.P., Joshua Topolsky recently launched a new website called The Outline. A new kind of publication as they say with a very noticeable twist in the design department like nothing you’ve ever seen before.
If you visit The Outline (and you really should) you will notice right away how daring their design is. Different typefaces, colors, and layout for each and every article. Heck, there’s articles with multiple typefaces for each of their titles, like this one.
One issue I encountered while trying to achieve a high score in GTmetrix was in regards to Google fonts and how I injected them into my site directly using Google fonts CDN. The only way to solve it was to learn How to Host Google Fonts Locally.
Most people are familiar with Google fonts. For those who don’t, here’s how I describe it:
It’s a big, free and awesome library of fonts which you can use as your heart desire. It’s managed by Google and served from the domains fonts.gstatic.com fonts.googleapis.com
I‘ve been silently doing a lot of minor and medium size changes to News47ell since the redesign. With those changes, I had to find a way to keep my code as organized as possible so that I can understand it when I go back to it later along the road. Because I use WordPress, I decided to convert all my code into Site Specific WordPress Plugin.
Each plugin does a specific thing on the site and it includes a PHP file, JS file & CSS file. They are all served from my server over at Lightning Base so I can reduce the number of HTTP requests required to render the page.
As always, I was browsing some sites, scrolling up and down on them. Suddenly, I decided visit CNN, not for the news, but to see the site’s footer because I don’t remember seeing what it looked like for a while.
So I did, and I’m glad I did because I noticed that their footer said this:
© 2016 Cable News Network. Turner Broadcasting System, Inc. All Rights Reserved.
CNN Sans ™ & © 2016 Cable News Network.
Apparently, on April 21st, CNN rolled out their proprietary, “brand new” typeface called CNN Sans.
If you want to display code blocks on your WordPress site in a beautiful and unique way then you arrived at the right place, because in this tutorial I will teach you how to implement Prism syntax highlighter into WordPress.
It’s not every day that I write something about another news site, but this time, it’s different and the news is shocking and strange at the same time.
When I started learning how to re-design my site, what CSS is and all the cool things I can do with it, I needed a place where I can save the CSS code that I was writing.
WordPress themes already come with style.css file which you can add extra CSS to and change the old one, but when the theme receive an update, all the changes will be lost. You can use a child theme’s style.css file and do @import but you shouldn’t, and you need to avoid it.
What you need is a Custom CSS WordPress Plugin.
Jetpack have a Custom CSS module which comes with code revision, it’s simple and works well. And last but not least, there’s Tom Usborne’s Simple CSS Plugin that include CSS editor in the Customizer so you can live preview your changes and Metabox for page/post specific CSS.
But I wanted more, I was really thirsty for a plugin with more features.
So I put my backpack and started my journey trying to find the perfect plugin in the land of repo, a land so far away, with a population of 46,074 plugins.
After spending days in this land, trying plugin after another, I finally found the perfect one, it has the basic feature, a place for your Custom CSS code, and a ton of extra features that you never think you need until you see them and try them yourself.
Here’s my Simple Custom CSS and JS Review: