Blog Archive

Check out all blog posts in my blog archive. Click on a headline to read the teaser.

Video & Music Player › Play Audio & Video with media­element.js
Do you like music? Or are you a podcaster? Do you want to stream your videos in a nice player? Than you likely will like the integration of mediaelement.js. It enables you to play music and stream video in a consistent player that looks in each browser delicious. It even works in IE6-8. Read More ›

Reading Experience › Wonderful Typography
Feeling Responsive uses Volkhov for headlines, Lato for everything else and if you are in need to show some code, it will be in Lucida Console or Monaco. Read More ›

Discussion › Now with Comments!
For a blog you need comments. Like all those other jekyll themes we baked in Disqus. It's easy to set, it works and makes a static jekyll blog more dynamic. Read More ›

Headers With Style › No Header
Feeling Responsive allows you to use all kinds of headers. This example shows no header at all. Just the navigation. Read More ›

Headers With Style › No Header but Article Image
Feeling Responsive enables you to get the attention of visitors. If you don't want to use a big header, use an image for the article instead. Read More ›

Headers With Style › Header With Text
Feeling Responsive allows you to use all kinds of headers. This header is with text. Read More ›

Headers With Style › Header With Logo Only
Feeling Responsive allows you to use all kinds of headers. This is the default mode. It shows a header just with your logo on the standard background. Read More ›

Headers With Style › Header Image With Background Color
Feeling Responsive allows you to use all kinds of headers. This example shows a header image with a defined background color via front matter. Read More ›

Headers With Style › Header with a Full-Width-Image
Feeling Responsive allows you to use all kinds of headers. This example shows a header with a full-width-image. Read More ›

Headers With Style › Header Image With Pattern
Feeling Responsive allows you to use all kinds of headers. This example shows a header image in front of a pattern. Read More ›

Templates › Responsive Galleries with Foundation
Wanna create a responsive gallery to showcase your portfolio, recent photos or images? It's quite easy thanks to Foundation and Clearing Lightbox. Read More ›

Templates › Video Template
If you want to show videos in a large manner, the video template is the right choice. Read More ›

Multi-Device Layouts in Color › Grid & Colors
Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. To optimize the size of your images, you find the correct dimensions beneath. Further below you find the colorscheme and colors used for Feeling Responsive and their color codes. Read More ›

Portfolio › Show your beautiful work!
With Feeling Responsive you don't need a special portfolio template. Just check out the great possibilities of the foundation grid and experiment with it. Read More ›

Publications
Yu Song Lab @ CityU Read More ›

Yu Song Lab @ CityU › Publications
Yu Song Lab @ CityU › Research
Templates › Page/Post Right Sidebar
This is an example of page/post with a sidebar on the right. Read More ›

Yu Song Lab @ CityU › News
Yu Song Lab @ CityU › Awards & Honors
Templates › The Post/Page Template
The default template for posts and pages aligns the page beautifully in the middle. But you can customize posts/pages easily via switches in the front matter to get a sidebar and/or to turn off meta-information at the end of the page like categories, tags and dates. Read More ›

Breadcrumbs
If you need them, Feeling Responsive offers you a breadcrumb navigation. You can easily turn it on/off via frontmatter. Read More ›

Templates › Page/Post With Left Sidebar
This is a example of page/post with a sidebar on the left. Read More ›