How to Protect WordPress Sites 48

How to Protect WordPress Sites

WordPress is one of the most ubiquitous content management systems in the world. Even better, it's open source! However, as an open source piece of software, it can be vulnerable to malicious individuals digging through code and finding vulnerabilities in the code, which they attempt to exploit. As such, WordPress sites have been prone to security breaches and being hacked, and having your WordPress site hacked can be damaging to your reputation and your business. At Themify, we often hear about WordPress security issues from members, thus it inspired us to share this article.

30 Great Interactive Sites 35

30 Great Interactive Sites

I apologize for not posting on the Wall for the longest time, but yes, I'm still alive (just been busy with Themify). Today I have an awesome post to share — 30 great interactive sites. HTML5, CSS3, and Javascript have opened up many design possibilities. Web design nowadays is very interactive, it is no longer limited by static layouts. The 30 sites listed below demonstrate great examples of interactive web design. It ranges from simple transition effect to cool parallax scrolling to rich media presentation such as music audio and videos. Enjoy!

Interactive World JavaScript Map 28

Interactive World JavaScript Map

This tutorial will show you how to create an interactive map of the world you can use to display travel photos. In the process, you'll be introduced to Raphael.js. It is a small JavaScript library that makes it easy to work with vector graphics. Instead of using HTML5 Canvas for interactive animations, it uses SVG (for modern browsers) and VML (for IE8 and earlier). This means that Raphael.js looks great on modern browsers and mobile devices, but degrades gracefully and is functional on legacy browsers. Because it is written in JavaScript, it's very easy to integrate with other elements in the DOM. This makes it a great choice for all sorts of interactive animations and a useful tool to add to your skill set.

Note: this is a guest post by Chris Youderian.

Two Free 2013 FITC Conference Tickets 6

Two Free 2013 FITC Conference Tickets

I've got two FITC Toronto 2013 tickets to give away and all you need to do is send one tweet for your chance to win! For those of you who don't know what FITC Toronto is, it is a design and technology conference that brings together some of the world's best digital creators for three days of learning, networking and partying, and it will all be taking place from April 21-23. This year's event will feature over 70+ renowned digital creators from around the globe, covering everything from user experience to the awe-inspiring world of Film Holographic VFX. To enter for your chance to win a festival ticket, all you need to do is tweet the name of one of the speakers by Apr 5, 2013 with hashtag #designtechcon to enter.

Winners will be announced on Twitter, so be sure to follow @fitc and @nickla.

CSS: Responsive Navigation Menu 43

CSS: Responsive Navigation Menu

Previously I wrote a tutorial on how to make a mobile navigation for responsive design, now I've discovered a new technique to produce a responsive menu without having to use Javascript. It uses clean and semantic HTML5 markup. The menu can be aligned left, center or right. Unlike the previous tutorial where it is clicked to toggle, this menu toggles on hover which is more user friendly. It also has an indicator to show the active/current menu item. It works on all mobile and desktop browsers including Internet Explorer!

View Demo Responsive Menu

Responsive Column Layouts 33

Responsive Column Layouts

Typically, to create a column layout, you would need to add the first or last classes to reset the margin space and clear the float. Today I'm going to share a very simple CSS trick to create a responsive column layout using nth-of-type pseudo class. I use this trick to code the WordPress themes at Themify. It doesn't require any first or last class and the number of columns can be adjusted base on the viewport. In other words, it can be toggled from 4-column to 3-column or 2-column, etc.

View Demo Responsive Column/Grid

FALL LOVE: 20% FALLSALE coupon code & 40% affiliate commission boost at Themify (details)