Home » Design » Page 12
Just a couple of links that deal with the usage or testing of structured data.
Structured data is not yet relevant for content rankings, but that might change in the future (Hangout).
“Structured data markup” is a standard way to annotate your content so machines can understand and categorize it. Proper usage elevates the way data is displayed on Google Search, Facebook, Twitter, Pinterest and many others, when one of your content links is posted there.
Really looking forward to the JSON-LD integration :)
CSS Crush is a standards inspired CSS pre-processor that is written in PHP from scratch.
For a current project I am adding CSS Crush side by side to Sass. Lets see which of them sticks around in the end :) Might be keeping them both, as CSS Crush provides some nice options.
CSS Crush @ Github
Upcoming ad for Industries des Céréales No. 195
Since completely moving to Sass, I am really obsessed to make my work easier :) There are many Mixins that really help to speedup development and remove some of the tedious tasks ;)
“Some things in CSS are a bit tedious to write, especially with CSS3 and the many vendor prefixes that exist. A mixin lets you make groups of CSS declarations that you want to reuse throughout your site. You can even pass in values to make your mixin more flexible. ” – Sass Basics
I will be showcasing some of the libs and resources here in the coming weeks. I only have one condition, Mixins should be simple dropin modules so that they can be used universally!
Here one Mixin, I love, that sets a REM font size with a Pixel fallback:
“The tracking.js library brings different computer vision algorithms and techniques into the browser environment. By using modern HTML5 specifications, we enable you to do real-time color tracking, face detection and much more”
Material Design for Bootstrap is a theme for Bootstrap 3 which lets you use the new Google Material Design in your favorite front-end framework.
I am currently working on a WPLMS enhancement for a customer, that allows to simplify the payout of instructor commissions. The whole system runs on the MyCred Points System and students pay for courses with Points. The problem is how to easily payout the instructor commissions via PayPal.
There is currently no addon for MyCred available that does that magic, so I build one myself.
At the moment the payment process via PayPal is completely manual, due to budget constraints. I am basically generating a custom “Send Money” link that prefills the PayPal email and amount to send.
The interface itself handles the payout sessions, tracks the instructor balance, paid and unpaid points.
Here some images to illustrate the admin dashboard:
This list the instructors and their point balance and allows to start the payment process.
Payout sessions make sure, that only one session can be started per instructor, as the instructor could earn new points during the process. The points converted can be changed, allowing you to payout a fixed amount of points.
Its a 3 step process. Login at PayPal. Open the “Send money” dialog and send money to instructor. Confirm that you manually send the money and than register the payment and payout points in the system.
The session can be cancelled at any point. You can also leave the session open and continue at a later point.
On the frontend I added an interface to the BuddyPress Profile, that allows the instructor to track his payouts and balance.
The whole setup could be updated using PayPal Adaptive Payments, to make the whole process completely automated. Something to consider for the future :) Pretty happy with the manual process so far and it will be a great help for my customer to keep track of the commission payouts.
The whole setup is currently targeted for WPLMS, but can easily be adapted to other setups using the MyCred Points System.
Build your Ajax Loading Icons with SVG / CSS / GIF.
“This repository is a community-curated list of flexbox issues and cross-browser workarounds for them. The goal is that if you’re building a website using flexbox and something isn’t working as you’d expect, you can find the solution here.”
They built screensiz.es to quickly find the screen specifications of the most popular devices and monitors currently on the market.