diff --git a/Gemfile b/Gemfile index 06d63a9f..05d76f16 100644 --- a/Gemfile +++ b/Gemfile @@ -7,6 +7,7 @@ group :development do gem 'jekyll-sitemap' gem 'jekyll-redirect-from' gem 'jekyll-picture-tag' + gem 'jekyll-archives' gem 'rouge' gem 'mini_magick' gem 'fileutils' @@ -17,4 +18,3 @@ group :development do gem 'gsl', :git => "https://github.com/tonyarnold/rb-gsl" end - diff --git a/_config.yml b/_config.yml index acb72ecc..639c6b55 100644 --- a/_config.yml +++ b/_config.yml @@ -55,6 +55,21 @@ gems: - jekyll-sitemap - jekyll-redirect-from - jekyll-picture-tag + - jekyll-archives + + +# jekyll-archives +# -------------------- + +jekyll-archives: + enabled: + - categories + - tags + layout: 'archive' + permalinks: + tag: '/tag/:name/' + category: '/:name/' + # jekyll-picture-tag # -------------------- diff --git a/_src/_assets/styl/content.styl b/_src/_assets/styl/content.styl index 097bab2f..2f1d1861 100644 --- a/_src/_assets/styl/content.styl +++ b/_src/_assets/styl/content.styl @@ -81,7 +81,7 @@ .byline, time, -.categories +.tags @extend .textcenter .byline, @@ -99,9 +99,19 @@ time display: block color: $text-color-dimmed -.categories +.tags margin-top: $line-height-computed +.tag + color: $text-color-dimmed + margin-right: 5px + + &:before + content: '#' + color: darken($page-bg, 15%) + margin-right: 2px + + .avatar width: 80px height: 80px diff --git a/_src/_includes/entry_meta.html b/_src/_includes/entry_meta.html index 477293be..f80e577a 100644 --- a/_src/_includes/entry_meta.html +++ b/_src/_includes/entry_meta.html @@ -15,4 +15,10 @@ {% endif %} +

+ {% for tag in page.tags %} + {{ tag }} + {% endfor %} +

+ diff --git a/_src/_layouts/archive.html b/_src/_layouts/archive.html new file mode 100644 index 00000000..3739a183 --- /dev/null +++ b/_src/_layouts/archive.html @@ -0,0 +1,29 @@ +--- +layout: base +--- + +
+ + {% if page.type == 'category' %} +

{{ page.title }}

+ {% else %} +

{{ page.type }} archive for {{ page.title }}

+ {% endif %} + + {% if page.title == 'photos' %} +
+
+ {% endif %} + + {% for post in page.posts %} + {% include articles.html %} + {% endfor %} + + {% if page.title == 'photos' %} +
+ {% endif %} + + +
+ +{% include paginator.html %} diff --git a/_src/_layouts/base.html b/_src/_layouts/base.html index 4f4dfe22..c376c3b4 100644 --- a/_src/_layouts/base.html +++ b/_src/_layouts/base.html @@ -1,24 +1,24 @@ - + {% include head.html %} {% capture id %}{{ page.url | replace:'/','-' | replace_first:'-','' | replace:'.html','' | replace:'-index','' }}{% endcapture %} - - + + {% include header.html %} - -
+ +
{{ content }}
- +
- + - -{% include footer.html %} \ No newline at end of file + +{% include footer.html %} diff --git a/_src/_posts/2008-03-30-launch-of-kremaliciouscom.md b/_src/_posts/2008-03-30-launch-of-kremaliciouscom.md index eb15c305..734b7bc2 100644 --- a/_src/_posts/2008-03-30-launch-of-kremaliciouscom.md +++ b/_src/_posts/2008-03-30-launch-of-kremaliciouscom.md @@ -8,6 +8,8 @@ date: 2008-03-30 19:24:21+00:00 wordpress_id: 14 categories: - personal +tags: + - wordpress --- A fresh start of my website under the new domain www.kremalicious.com and with [Wordpress](http://www.wordpress.org) under the hood. My former website under [www.jpberlin.de/krema](http://www.jpberlin.de/krema) will no longer be updated and will be deleted soon. I just implemented a few posts from the old weblog. diff --git a/_src/_posts/2008-07-01-everything-back-to-normal-on-kremaliciouscom-almost.md b/_src/_posts/2008-07-01-everything-back-to-normal-on-kremaliciouscom-almost.md index 13f1abea..cd9a93c0 100644 --- a/_src/_posts/2008-07-01-everything-back-to-normal-on-kremaliciouscom-almost.md +++ b/_src/_posts/2008-07-01-everything-back-to-normal-on-kremaliciouscom-almost.md @@ -8,6 +8,8 @@ date: 2008-07-01 16:39:02+00:00 wordpress_id: 80 categories: - personal +tags: + - wordpress --- ![Server screwed](/media/xserve_screwed.png)As you may have noticed, kremalicious.com was a bit screwed in the last week and some of you have asked me via mail and twitter what exactly was wrong. So to satisfy the curious geek in you I will provide some informations about it. diff --git a/_src/_posts/2008-07-11-enjoy-kremaliciousiphone.md b/_src/_posts/2008-07-11-enjoy-kremaliciousiphone.md index b0f1c46f..1ea50ab1 100644 --- a/_src/_posts/2008-07-11-enjoy-kremaliciousiphone.md +++ b/_src/_posts/2008-07-11-enjoy-kremaliciousiphone.md @@ -8,6 +8,8 @@ date: 2008-07-11 00:20:22+00:00 wordpress_id: 85 categories: - personal +tags: + - wordpress --- ![](/media/kremaliciousiphone_thumb.png)I'm thrilled to announce that kremalicious.com now uses an iPhone optimized theme. When you browse this website with your iPhone everything will automagically switch to the new kremalicious iPhone theme which is simply called kremalicious{iPhone}. See those hip brackets? @@ -53,20 +55,20 @@ And finally many thanks to [cschock](http://www.cschock.de) for continuously tes # Resources for you to do the same and even more * [iWPhone by ContentRobot](http://iwphone.contentrobot.com/): The plug-in I use for kremalicious.iPhone. It detects an iPhone or iPod Touch and switches to another simple theme. You can easily adjust the plugin to point it to your own theme. - + * [WPTouch - Wordpress iPhonified](http://www.bravenewcode.com/wptouch/): If you don't want to digg into html, css and iPhone specific properties this plug-in will help you. Once activated it automatically switches to an iPhone like theme with lots of eyecandy. You can customize some colors and a lot of different icons all from the Wordpress admin panel - + * [Tutorial: Building a website for the iPhone](http://www.engageinteractive.co.uk/blog/2008/06/19/tutorial-building-a-website-for-the-iphone/): Amazing tutorial for changing content based on the orientation of the iPhone or iPod Touch. Just browse their website with your iPhone or iPod Touch to see it in action. - + * [iPhone Native Looking Skin](http://ajaxian.com/archives/iphone-native-looking-skin): Sort of a template based on css and javascript which simulates the iPhone UI. ([Final look](http://joehewitt.com/files/iphone/navigation.html)) - + * [Touching and Gesturing on the iPhone](http://ajaxian.com/archives/iphone-native-looking-skin): Build your websites with some touch gesture features! Here's the javascript code for it. ## THE Apple resources for iPhone & Web Content - + * [Safari Web Content Guide for iPhone](http://developer.apple.com/documentation/AppleApplications/Reference/SafariWebContent/Introduction/chapter_1_section_1.html) - + * [iPhone Human Interface Guidelines for Web Applications](http://developer.apple.com/documentation/iPhone/Conceptual/iPhoneHIG/Introduction/chapter_1_section_1.html) - - * [iPhone Human Interface Guidelines](https://developer.apple.com/iphone/library/documentation/UserExperience/Conceptual/MobileHIG/Introduction/chapter_1_section_1.html) (free developer account required) \ No newline at end of file + + * [iPhone Human Interface Guidelines](https://developer.apple.com/iphone/library/documentation/UserExperience/Conceptual/MobileHIG/Introduction/chapter_1_section_1.html) (free developer account required) diff --git a/_src/_posts/2008-07-15-wordpress-25-get-rid-of-that-sluggish-dashboard.md b/_src/_posts/2008-07-15-wordpress-25-get-rid-of-that-sluggish-dashboard.md index 2267e0f6..802f545b 100644 --- a/_src/_posts/2008-07-15-wordpress-25-get-rid-of-that-sluggish-dashboard.md +++ b/_src/_posts/2008-07-15-wordpress-25-get-rid-of-that-sluggish-dashboard.md @@ -6,10 +6,12 @@ author: Matthias Kretschmann date: 2008-07-15 14:04:46+00:00 wordpress_id: 87 + categories: - design tags: - tutorial +- wordpress --- ![Wordpress Logo by kremalicious](/media/wordpress-logo.png)Since Wordpress 2.5 it was nearly impossible for me to log into Wordpress and quickly head over to the write tab. The Dashboard always wants to load a bunch of things in it but this always seemed to fail in my setup and slow things down. And not enough the Dashboard just locks everything up while loading which can take more than one minute. @@ -52,23 +54,23 @@ Now just uncomment the lines so it looks like this (every line with two leading // require_once (ABSPATH . WPINC . '/rss.php'); @header('Content-Type: ' . get_option('html_type') . '; charset=' . get_option('blog_charset')); // switch ( $_GET['jax'] ) { - // + // // case 'incominglinks' : // wp_dashboard_incoming_links_output(); // break; - // + // // case 'devnews' : // wp_dashboard_rss_output( 'dashboard_primary' ); // break; - // + // // case 'planetnews' : // wp_dashboard_secondary_output(); // break; - // + // // case 'plugins' : // wp_dashboard_plugins_output(); // break; - // + // // } ?> {% endhighlight %} @@ -76,5 +78,3 @@ Now just uncomment the lines so it looks like this (every line with two leading And that's it. Save the file on your server, log in to your Wordpress backend and you should see your Dashboard with everything intact. It just won't search for incoming links and all those other RSS sources anymore. Remember that every update of Wordpress will overwrite this file. - - diff --git a/_src/_posts/2008-12-11-how-to-set-a-custom-gravatar-image-in-wordpress-27.md b/_src/_posts/2008-12-11-how-to-set-a-custom-gravatar-image-in-wordpress-27.md index 232aee90..bd3a62e8 100644 --- a/_src/_posts/2008-12-11-how-to-set-a-custom-gravatar-image-in-wordpress-27.md +++ b/_src/_posts/2008-12-11-how-to-set-a-custom-gravatar-image-in-wordpress-27.md @@ -6,10 +6,12 @@ author: Matthias Kretschmann date: 2008-12-11 22:59:06+00:00 wordpress_id: 344 + categories: - design tags: - tutorial +- wordpress --- ![Wordpress Logo by kremalicious](/media/wordpress-logo.png) @@ -18,14 +20,14 @@ Sure enough I've upgraded immediately when [Wordpress 2.7 was released](http://w Before Wordpress 2.7 I achieved a custom gravatar image on kremalicious.com with this code placed in the comments.php template file: {% highlight php %} -/images/gravatar.png' + echo get_avatar( + $comment, + $size = '70', + $default = '/images/gravatar.png' ); - } + } ?> {% endhighlight %} @@ -40,7 +42,7 @@ But we can use the functions.php file in your template directory and add some li $avatar_defaults[$myavatar] = 'GRAVATAR NAME DISPLAYED IN WORDPRESS'; return $avatar_defaults; } - add_filter( 'avatar_defaults', 'my_own_gravatar' ); + add_filter( 'avatar_defaults', 'my_own_gravatar' ); ?> {% endhighlight %} @@ -59,4 +61,4 @@ And you can adjust the displayed size of the gravatar image by adding a paramete -And that's it. As you would guess I pretty much prefer this way to adjust the gravatar image. But you're free to [write your custom comment callback function](http://clarktech.no-ip.com/wordpress/wordpress-27-comment-callback-function) to exactly define the output of the comments. But it's definitely too much if you just want to change the gravatar stuff. \ No newline at end of file +And that's it. As you would guess I pretty much prefer this way to adjust the gravatar image. But you're free to [write your custom comment callback function](http://clarktech.no-ip.com/wordpress/wordpress-27-comment-callback-function) to exactly define the output of the comments. But it's definitely too much if you just want to change the gravatar stuff. diff --git a/_src/_posts/2008-12-13-howto-styling-author-comments-with-wordpress-27.md b/_src/_posts/2008-12-13-howto-styling-author-comments-with-wordpress-27.md index f3d70a1e..3dc20565 100644 --- a/_src/_posts/2008-12-13-howto-styling-author-comments-with-wordpress-27.md +++ b/_src/_posts/2008-12-13-howto-styling-author-comments-with-wordpress-27.md @@ -6,10 +6,12 @@ author: Matthias Kretschmann date: 2008-12-13 16:47:43+00:00 wordpress_id: 360 + categories: - design tags: - tutorial +- wordpress --- ![Wordpress Logo by kremalicious](/media/wordpress-logo.png) @@ -19,23 +21,23 @@ Let's start by looking at the code to achieve styling of author comments prior t {% highlight php %}
  • + comment_author_url == "http://www.kremalicious.com") + echo 'author'; + else echo $oddcomment; + ?> item" id="comment-"> other comments code
    • {% endhighlight %} - + So with some php stuff we were able to check for the author name or, as I did it, for the URL of the comment author. If one of these were detected Wordpress added a new class 'author' to the `
  • ` tag which we were able to style by adding a li.author to our css file: - + {% highlight css %}li.author { css comes in here }{% endhighlight %} But with Wordpress 2.7 these steps are needless because of the [new function ``](http://codex.wordpress.org/Template_Tags/wp_list_comments) which adds a class on author comments for itself! -If a comment from the author of an article is posted under this article, **Wordpress automatically adds the class 'bypostauthor' to the surrounding `
  • ` tag.** So all you have to do is adding a css style of `li.bypostauthor` to your css file or just renaming your old `li.author` class or whatever you used for this: +If a comment from the author of an article is posted under this article, **Wordpress automatically adds the class 'bypostauthor' to the surrounding `
  • ` tag.** So all you have to do is adding a css style of `li.bypostauthor` to your css file or just renaming your old `li.author` class or whatever you used for this: {% highlight css %}li.bypostauthor { css comes in here }{% endhighlight %} @@ -47,4 +49,4 @@ Wordpress also has a special class for registered users of your site so you're a {% highlight css %}li.byuser { css comes in here }{% endhighlight %} -All the various classes Wordpress adds to comments are listed [in the Codex page for enhanced comments display](http://codex.wordpress.org/Migrating_Plugins_and_Themes_to_2.7/Enhanced_Comment_Display#CSS_Styling). And [here's a very nice grahical overview about everything Wordpress 2.7 adds to comments](http://www.wp-fun.co.uk/2008/12/10/27-comment-classes/). \ No newline at end of file +All the various classes Wordpress adds to comments are listed [in the Codex page for enhanced comments display](http://codex.wordpress.org/Migrating_Plugins_and_Themes_to_2.7/Enhanced_Comment_Display#CSS_Styling). And [here's a very nice grahical overview about everything Wordpress 2.7 adds to comments](http://www.wp-fun.co.uk/2008/12/10/27-comment-classes/). diff --git a/_src/_posts/2009-03-29-ultimate-coda-wordpress-share-link-bonanza.md b/_src/_posts/2009-03-29-ultimate-coda-wordpress-share-link-bonanza.md index 17463f36..9fba4713 100644 --- a/_src/_posts/2009-03-29-ultimate-coda-wordpress-share-link-bonanza.md +++ b/_src/_posts/2009-03-29-ultimate-coda-wordpress-share-link-bonanza.md @@ -7,10 +7,12 @@ author: Matthias Kretschmann date: 2009-03-29 23:12:15+00:00 wordpress_id: 576 + categories: -- design + - design tags: -- tutorial + - tutorial + - wordpress --- ![Coda Clips Teaser](/media/codaclips-teaser.png) @@ -677,4 +679,4 @@ If you ever wanted or had to include such sharing links manually in your sites a And that's it. If you think there should be another site added feel free to post them in the comments or shoot me a note [via my contact form](http://www.kremalicious.com/about/contact). Also possible errors or any additions are much appreciated. If useful I will add your additions or more site links to the codaclips files and will update the article. -Also I would like to provide these links as [Espresso](http://macrabbit.com/espresso/) snippets probably as part of the HTML-(or PHP?)-Sugar but this seems to be rather complicated at the moment. As soon as this becomes more straightforward I will add these to this article. But if you're already advanced in creating Espresso sugars and would like to help me with this [please contact me!](http://www.kremalicious.com/about/contact) \ No newline at end of file +Also I would like to provide these links as [Espresso](http://macrabbit.com/espresso/) snippets probably as part of the HTML-(or PHP?)-Sugar but this seems to be rather complicated at the moment. As soon as this becomes more straightforward I will add these to this article. But if you're already advanced in creating Espresso sugars and would like to help me with this [please contact me!](http://www.kremalicious.com/about/contact) diff --git a/_src/_posts/2009-12-17-wordpress-post-thumbnails.md b/_src/_posts/2009-12-17-wordpress-post-thumbnails.md index 66349bb7..622c80ce 100644 --- a/_src/_posts/2009-12-17-wordpress-post-thumbnails.md +++ b/_src/_posts/2009-12-17-wordpress-post-thumbnails.md @@ -6,10 +6,12 @@ author: Matthias Kretschmann date: 2009-12-17 04:00:21+00:00 wordpress_id: 959 + categories: -- design + - design tags: -- tutorial + - tutorial + - wordpress --- ![Wordpress Logo by kremalicious](/media/wordpress-logo.png)WordPress 2.9 added a new feature which allows you to assign an image to an article to make it the post image like it's often used in magazine style themes. This new feature along with a new template tag makes all the custom field hacks usually used for this functionality in the past obsolete. So here's a quick walkthrough to make use of the new post thumbnail feature and of course how to make it backwards compatible. @@ -21,8 +23,8 @@ tags: So just open up your theme's _functions.php_ file in your favorite editor or create it if there's no such file in your theme folder. Add this little code snippet to this file: {% highlight php %} - {% endhighlight %} @@ -30,7 +32,7 @@ For backwards compatibility you should wrap this inside a function check for the {% highlight php %} {% endhighlight %} @@ -62,9 +64,9 @@ This template tag will display the thumbnail sized post thumbnail by default and But of course you can grab the other sizes WordPress automatically creates when you upload an image: -{% highlight php %}{% endhighlight %} _(Note: Matt [left a comment on WP Engineer](http://wpengineer.com/the-ultimative-guide-for-the_post_thumbnail-in-wordpress-2-9/#comment-3053) stating he wouldn't recommend using these named arguments but provided no explanation for it yet.)_ @@ -100,21 +102,21 @@ As for the title attribute this will be grabbed automatically from the entry you Finally if you want to respect the custom sizes you or your users have set under Settings > Media you can first grab those sizes with [get_option function](http://codex.wordpress.org/Function_Reference/get_option) and then put it in the array: -{% highlight php %} 'alignleft')); + + the_post_thumbnail(array($width, $height), array('class' => 'alignleft')); ?>{% endhighlight %} You can also detect the Media settings for the other sizes and whether the crop setting is active or not: -{% highlight php %}{% endhighlight %} @@ -126,11 +128,11 @@ With the check in your functions.php at the beginning there's already ensured ol So it's a pretty good idea to make this backwards compatible with some quick if else voodoo, code shamelessly [adapted from WP-Recipes](http://www.wprecipes.com/wordpress-2-9-display-post-image-with-backward-compatibility): -{% highlight php %}if ( (function_exists('has_post_thumbnail')) && (has_post_thumbnail()) ) { - the_post_thumbnail(); -} else { - $postimage = get_post_meta($post->ID, 'post-image', true); - if ($postimage) { +{% highlight php %}if ( (function_exists('has_post_thumbnail')) && (has_post_thumbnail()) ) { + the_post_thumbnail(); +} else { + $postimage = get_post_meta($post->ID, 'post-image', true); + if ($postimage) { echo ''; } }{% endhighlight %} @@ -144,22 +146,22 @@ This first checks if the feature exists and if a post thumbnail was addd with th - + * WP Engineer: [About WordPress Post Thumbnail](http://wpengineer.com/about-wordpress-post-thumbnail/) - + * WP Engineer: [The Ultimative Guide For the_post_thumbnail In WordPress 2.9](http://wpengineer.com/the-ultimative-guide-for-the_post_thumbnail-in-wordpress-2-9/) - + * WP Recipes: [WordPress 2.9 : Display post image with backward compatibility](http://www.wprecipes.com/wordpress-2-9-display-post-image-with-backward-compatibility) - + * Justin Tadlock: [Everything you need to know about WordPress 2.9’s post image feature](http://justintadlock.com/archives/2009/11/16/everything-you-need-to-know-about-wordpress-2-9s-post-image-feature) - + * Chris Harrison: [Post Thumbnails in RSS Feeds](http://cdharrison.com/2009/12/the_post_thumbnail-for-rss-feeds/) - + * Technosailor: [10 Things You Need to Know About WordPress 2.9](http://technosailor.com/2009/11/11/10-things-you-need-to-know-about-wordpress-2-9/) @@ -182,5 +184,3 @@ As always: before making your next coffee you should share this article on your 12/20/2009 function check for add_theme_support at the beginning 12/20/2009 corrected the size array code under Custom Output 12/17/2009 Added some code examples to respect the media settings - - diff --git a/_src/_posts/2011-12-15-badged.md b/_src/_posts/2011-12-15-badged.md index 224ca638..04a93765 100644 --- a/_src/_posts/2011-12-15-badged.md +++ b/_src/_posts/2011-12-15-badged.md @@ -9,8 +9,11 @@ featured: true date: 2011-12-15 07:56:46+00:00 wordpress_id: 1468 + categories: -- goodies + - goodies +tags: + - wordpress --- Made a quick WordPress plugin which transforms the standard WordPress update & comment notification badges into iOS-styled ones. @@ -96,4 +99,3 @@ If you find any problems you can [open an issue on GitHub](https://github.com/kr **v0.1** * initial alpha release - diff --git a/_src/_posts/2012-04-04-android-tab-conundrum.md b/_src/_posts/2012-04-04-android-tab-conundrum.md index 296d99fe..97509b91 100644 --- a/_src/_posts/2012-04-04-android-tab-conundrum.md +++ b/_src/_posts/2012-04-04-android-tab-conundrum.md @@ -6,8 +6,11 @@ layout: post slug: android-tab-conundrum title: The Android Tab Bar Conundrum. Again. wordpress_id: 1556 + categories: -- design + - design +tags: + - android --- ![](/media/tabs_overview.png) diff --git a/_src/_posts/2012-05-14-welcome-to-kremalicious2.md b/_src/_posts/2012-05-14-welcome-to-kremalicious2.md index 84381ee2..f9fab5be 100644 --- a/_src/_posts/2012-05-14-welcome-to-kremalicious2.md +++ b/_src/_posts/2012-05-14-welcome-to-kremalicious2.md @@ -7,8 +7,11 @@ author: Matthias Kretschmann date: 2012-05-14 19:33:22+00:00 wordpress_id: 1920 + categories: -- personal + - personal +tags: + - wordpress --- It finally happened. After so many rejected revisions, so many pauses, so much coffee: kremalicious2 is here. diff --git a/_src/_posts/2012-05-15-wp-icons-template.md b/_src/_posts/2012-05-15-wp-icons-template.md index 7cbfff52..702cb5ed 100644 --- a/_src/_posts/2012-05-15-wp-icons-template.md +++ b/_src/_posts/2012-05-15-wp-icons-template.md @@ -7,13 +7,14 @@ author: Matthias Kretschmann date: 2012-05-15 16:00:44+00:00 wordpress_id: 2043 + categories: -- design -- goodies + - design + - goodies tags: -- boilerplate -- tutorial -- wordpress + - boilerplate + - tutorial + - wordpress --- Here’s a template for designing your own icons for the admin area of WordPress including icons ready for Retina screens and some recommendations for the workflow of implementing these. @@ -214,4 +215,4 @@ But if you’re super cool and want to catch some karma you place a link back to If you need some inspiration for nicely consistent icons you should check out [these great admin icons from Laura Kalbag](http://laurakalbag.com/wordpress-admin-icons/). -And Julien Chaumond wrote a great piece, in his own words "less about the sizes, more about the style". It's a must-read: [How to design a good native-looking WordPress Admin icon](http://julien-c.fr/2012/07/wordpress-admin-icons/) \ No newline at end of file +And Julien Chaumond wrote a great piece, in his own words "less about the sizes, more about the style". It's a must-read: [How to design a good native-looking WordPress Admin icon](http://julien-c.fr/2012/07/wordpress-admin-icons/) diff --git a/_src/_posts/2012-06-13-retina-icons-in-wordpress-3-4.md b/_src/_posts/2012-06-13-retina-icons-in-wordpress-3-4.md index 5737daa7..4add483a 100644 --- a/_src/_posts/2012-06-13-retina-icons-in-wordpress-3-4.md +++ b/_src/_posts/2012-06-13-retina-icons-in-wordpress-3-4.md @@ -6,13 +6,14 @@ author: Matthias Kretschmann date: 2012-06-13 19:01:20+00:00 wordpress_id: 2195 + categories: -- design + - design tags: -- wordpress + - wordpress --- -Apart from a nicely responsive admin area, WordPress 3.4 now [includes retina assets](http://core.trac.wordpress.org/ticket/20293) for all the icons in the admin area to make them look crisp on devices with high-dpi screens like the iPhone or iPad 3, most flagship Android devices and of course the new ÜberMacBookPro. +Apart from a nicely responsive admin area, WordPress 3.4 now [includes retina assets](http://core.trac.wordpress.org/ticket/20293) for all the icons in the admin area to make them look crisp on devices with high-dpi screens like the iPhone or iPad 3, most flagship Android devices and of course the new ÜberMacBookPro. And it looks gorgeous. Here's a detail screenshot of the admin area in 3.4 in full scale, taken on the iPad 3: @@ -22,7 +23,7 @@ And it looks gorgeous. Here's a detail screenshot of the admin area in 3.4 in fu So if you're a plugin developer you absolutely want to make sure to include retina assets for your plugin, like a double sized admin menu icon. -There's just one problem: WordPress doesn't include anything to make this easy for developers. The functions `register_post_type()` and `add_menu_page()` only allow you to define one image as menu icon which then gets inserted as `img` tag. +There's just one problem: WordPress doesn't include anything to make this easy for developers. The functions `register_post_type()` and `add_menu_page()` only allow you to define one image as menu icon which then gets inserted as `img` tag. [![](/media/kremalicious-Teaser-WP-Icon-Template.png)](/wp-icons-template/)If you want to include retina assets, you have to do it via CSS and media queries. Have a look at the code examples in my [WordPress icons template post](/wp-icons-template/) or peek around in the [github repository](https://github.com/kremalicious/wp-icons-template) to see how this can be achieved. diff --git a/_src/design/index.html b/_src/design/index.html deleted file mode 100644 index 56f48001..00000000 --- a/_src/design/index.html +++ /dev/null @@ -1,21 +0,0 @@ ---- -layout: base -title: Design -description: All the design related articles, mostly about web/ui design & front-end development -category: design -redirect_from: - - /topics/design-articles/ - - /design-articles/ ---- - -
    - -

    {{ page.category }}

    - - {% for post in site.categories.design %} - {% include articles.html %} - {% endfor %} - -
    - -{% include paginator.html %} \ No newline at end of file diff --git a/_src/goodies/index.html b/_src/goodies/index.html deleted file mode 100644 index 96cb28d1..00000000 --- a/_src/goodies/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -layout: base -title: Goodies -description: All the goodies I've released for you to download. Those are all free for your personal use only, licensed under CC BY NC SA 3.0. Please contact me if you want to use them commercially. -category: goodies -redirect_from: - - /goodies/icon/ - - /goodies/other/ - - /goodies/wallpaper/ - - /topics/goodies/ ---- - -
    - -

    {{ page.category }}

    - - {% for post in site.categories.goodies %} - {% include articles.html %} - {% endfor %} - -
    - -{% include paginator.html %} \ No newline at end of file diff --git a/_src/personal/index.html b/_src/personal/index.html deleted file mode 100644 index e7518620..00000000 --- a/_src/personal/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -layout: base -title: Personal -category: personal ---- - -
    - -

    {{ page.category }}

    - - {% for post in site.categories.personal %} - {% include articles.html %} - {% endfor %} - -
    - -{% include paginator.html %} \ No newline at end of file diff --git a/_src/photography/index.html b/_src/photography/index.html deleted file mode 100644 index 8efe0184..00000000 --- a/_src/photography/index.html +++ /dev/null @@ -1,17 +0,0 @@ ---- -layout: base -title: Photography -category: photography ---- - -
    - -

    {{ page.category }}

    - - {% for post in site.categories.photography %} - {% include articles.html %} - {% endfor %} - -
    - -{% include paginator.html %} \ No newline at end of file diff --git a/_src/photos/index.html b/_src/photos/index.html deleted file mode 100644 index 4a4d6b32..00000000 --- a/_src/photos/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -layout: base -title: Photos -description: My photo posts aggregated from various sources. You can find more of my photography on 500px and Flickr. -category: photos ---- - -
    - -

    photos

    - -
    -
    - - {% for post in site.categories.photos %} - {% include articles.html %} - {% endfor %} - -
    - -
    - -{% include paginator.html %} \ No newline at end of file diff --git a/_src/robots.txt b/_src/robots.txt index 18cc5990..6b102523 100644 --- a/_src/robots.txt +++ b/_src/robots.txt @@ -5,5 +5,6 @@ User-agent: * Disallow: /search/ Disallow: /page/ Disallow: /*/page/ +Disallow: /tag/ -Sitemap: {{ site.url }}/sitemap.xml \ No newline at end of file +Sitemap: {{ site.url }}/sitemap.xml