Categories
Themes What You Should Know

Use a SASS in WordPress Themes

A SASS mixin can save you from writing hundreds of CSS-lines in your WordPress theme. One of the great features of SASS is mixins. They resemble a function in ordinary programming. You create a series of commands, and pass certain variables. Then you don’t have to write the same code over and over again.

The _S (Underscores) theme is a wonderful tool, if you want to create a WordPress theme from scratch. Here SASS really shines, because you can create a mixin, and pass whatever numbers or settings that are needed. It’s as easy as this:

// tablets: iPads and friends
@media only screen and (max-width: 768px) {
    @include responsive(700px,400px,300px,1.1em); 
}

// mobile
@media only screen and (max-width: 598px) {
    @include responsive(500px,500px,500px,20px); 
}

And so on – in this way you can define the width of any HTML element. The SASS code for this particular mixin is:

@mixin responsive(
    $page,
    $primary,
    $aside,
    $siteTitle
 ) {

#page {
 background-color: #fff;
 max-width: $page;
 margin: auto;
 }
 
 // "wrapper" content container 
 #content {
 @include flexbox(); // prefixes for browsers
 display: flex;
 flex-wrap: wrap;
 }
 
 // content
 #primary {
 width: $primary;
 max-width: 100%;
 }
 
 // sidebar, widgets
 aside {
 width: $aside;
 max-width: 100%;
 }
 
 // site title size
 .site-title {
 a {
 font-size: $siteTitle; 
 } 
 }
 
 // images and media
 img, 
 iframe, 
 .entry-footer, 
 .entry-content, 
 .entry-header,
 .entry-footer, 
 .site-branding,
 .site.title,
 #mast-head {
 max-width: 100%; 
 }
} // end responsive mixin

Perhaps you feel that the mixin code is long. But on the other hand, you only have to write this code once. From now on you can pass variables to the responsive design in just one line:

.someClass { @include responsive(980px,500px,420px); }

Q.E.D.

Categories
Multimedia Deign

Wicked Bad Taste XMAS Theme

 

So this is Christmas
And what have you done
Another year over
And a new one just begun.
John Lennon

Xmas is a wonderful excuse for bad taste – here’s the new Xmas theme on Multimusen. It’s not completely finished yet. For now it’s just a big screen thing. So if you’re on a mobile device, you’re probably lost.

Categories
Book Review WordPress in the Classromm

“WordPress in the Classroom”: 2800+ visitors

Status “WordPress in the Classroom” : 2181 visitors, 290 downloads, avg. 9,8 pages seen per visit. Sources: Facebook, LinkedIn, WordPress.

Categories
What You Should Know

The WordPress Research Project now on EAviden.dk

Eaviden.dk - the page about my project
Eaviden.dk – the page about my project

Eaviden.dk has published a page about my research project “What You Should know about WordPress”. Eaviden is a web portal presenting the research and innovation activities on the Danish business academies.

On the page you find a description of the project, and links to my research blog (you’re reading it now). The text is in danish.

Here is the link to my project:

http://www.eaviden.dk/project/det-skal-du-vide-om-wordpress/

Categories
API Multimedia Deign

Stephen Raw’s Tolkien Middleearth Map

Imaginary maps: Tolkien

Categories
Book Review WordPress in the Classromm

Smashing Magazine tweet about my eBook

Vitaly Friedman and the Smashing Magazine kindly shared the link to my eBook on Twitter.  Smashing Magazine is always a great source of inspiration on everything about coding, design, graphics and UX trends.

Categories
API Multimedia Deign

Mapbox Cartogram

It’s a quick start method for Mapbox. Upload a picture, and select the colors on your map from the picture.

Mapbox Cartogram
Mapbox Cartogram