One day, you wake up and realize that your WordPress got hacked. Maybe the landing page shows a skull and mocks you, as you may have made a mistake allowing the hacker to access the page. Now, you have a real problem, because no matter what username and password combination you try, you just won’t get back into your website’s admin area. Stay calm; we have a solution to that as well.

Of course, the trick that I’m about to show you will also work for forgotten access information. Whatever the problem may be, and for whatever reason, you don’t have access to the admin account, it can be solved.

If you don’t have any website backups to restore, you need to fix the problem differently. However, if you have a good backup strategy, your website will be recovered with just a few clicks. If not, proceed as follows:

Setting Up New Access Information in phpMyAdmin

In about 98 percent of all cases, a hacker will not want to, or be able to compromise all areas of a website or a server. Thus, you’ll always have access to phpMyAdmin, including your database used by WordPress.

If you don’t have access to your server or web hosting package anymore, contact your hoster’s support.

In case you forgot, you’re able to find the access information in the wp-config.php. Use this access information to log into your phpMyAdmin interface. Then, choose the right database, if you happen to have multiple websites.

Now create a manual backup of your database, allowing you to import it again later on if you happen to make a major mistake in the following work.

Now, it’s time to go to the bone. We will set up new access information in the database, so that you get your access back fast, and restore your website.

Placing New Access Information in the Database

Click the table wp_users on the left. Please keep in mind that your table could also be named differently when using a database prefix other than wp_. Maybe, the table will be called myblog_users instead. It’s also possible to get that information from the wp-config.php.

In the upper line, click the first menu item called “Display”. Now, you’ll see the user accounts and click on “edit” for one admin.

Next, place a working email address in the email field and save your data. Make sure that you have access to this email address, and that you can receive emails.

Requesting a New Password

After you placed a new email address, you can log out of phpMyAdmin and call up your website’s admin area with the following URL:

http://your-website.com/wp-login.php

Now, use the WordPress function for forgotten passwords. Click on “forgot password” and enter the email you just placed in the newly opened window.

WordPress automatically sends you a new password to the email address you entered in the database. From that point, you have regained full access to your website, allowing you to remove it from malicious code.

After you’re able to log in again, please choose a safe password with at least ten characters, letters, numbers, as well as upper, and lower case letters. A proper password will make it a lot harder for future hackers to invade your website.

At a Word: the Right Backup Strategy

The entire procedure that you just had to go through was only possible because you didn’t protect your website properly, or didn’t keep it up to date. I know, it’s tough to hear this. But it’s the truth nonetheless.

Nobody has just to accept that their blog got hacked. You can always do a lot to prevent it. Everything starts with the updates. Always keep your page, plugins, and themes up to date. This closes security gaps. Make sure to have an optimal .htaccess file that makes it almost impossible for hackers to get into your blog. Use a safe password. This will let you sleep a lot better in the future.

My Recommendation for Regular Backups

There’s nothing more important than an excellent backup service. Yes, a service, not a plugin. A plugin requires expert knowledge and time when it comes to the recovery of a blog. On top of that, most plugins store backups on the same server they run on. I’ve been working with VaultPress, the paid service by Automattic, the company behind WordPress, for years. I’d like to recommend this service to you.

For only 5 USD a month, you’ll get daily backups that can be restored with one click. Your data is not saved on your server, meaning they are always available, even when your server is attacked. Additionally, VaultPress doesn’t require the website’s access information, but only the information for the (S)FTP access. You also get to choose what exactly you want to restore: the whole installation, including WordPress, or single files.

For the registration and the conclusion of a contract, you need a WordPress.com account and a credit card, however, prepaid credit cards, like those by Number26, are also accepted.

Further Information:

• VaultPress Backup Service
• Number26 Credit Card

(dpe)

Ah, I remember the days well… when everything was a shiny, drop-shadowed gradient, with at least 6 pieces of clip art, and a stock photo of 5 celebratory office workers. We loved pictures of keyboards with nonsensical buttons on them, and 3D-effect stick people holding glossy symbols.

And then what happened? iOS 7 came along. The gradient tool on our Photoshops started gathering dust and we deleted our massive library of stock photos.

Flat design took over in 2013. Everything needed to be bright, cartoonish, and, of course, flat. In the same way that flat design was a reaction to skeuomorphism, we’re starting to see things go another way entirely.

So, what’s the new flavor of the year? I’m pleased you asked: Sites that look like the downloads page of an open-source software company that shut down in the late ‘90s.

This has been documented by Brutalist Websites, which picked up traction and scored coverage on Washington Post and Fast Co to name a couple. But surely, these are just websites from pretentious design agencies and experimental artists? In the Brutalist Websites showcase, that’s mostly true, but we’re starting to see this aesthetic leak through to the mainstream. Nice! We can’t look at sleek flat design for the rest of our days, can we?

Personally, I love this trend. I’m not the sharpest web designer out there, and nor do I want to use a hackneyed framework — whatever I can cobble together is the best I can do.

I used to spend time scouring the internet for outdated web design, delighting in clunky Times New Roman and awkward framesets. Probably because it reminded me of a simpler time, where people called themselves webmasters and everything was permanently ‘Under Construction’.

But, seeking to learn web design from scratch instead of adopting a WP theme or CSS framework, I’ve always been too ashamed to create the simple, ugly website of my dreams. ‘What would be the point?’, I thought. Showing it off would make me look ridiculous. I can’t use it as a portfolio for anything without looking like a mess.

Seeing CSS-light websites with no JavaScript in sight gave me the confidence I need to stop working on other people’s sites and make my own, instead.

Looking at the selection of new minimalist sites, I noticed several key themes that seem to be rearing their beautifully ugly heads.

Monochrome

Monochrome design does exactly what good design should do: draws attention to the content.

No Fancy CSS

Remember the good old days? When everyone owned a website and had something to prove? The no (or little) CSS approach brings back those days, and, personally makes me extremely nostalgic for simpler times where a website could be just a short bio and collection of links.

Slanted/overlapping text

Slanted text throws the user off a little, and not in an astonishing way. Instead, it’s something that the user isn’t used to seeing so it makes a powerful impression.

Check out the experimental text placement Loïc uses on his website. The total disregard for readability gives visitors the feeling of a high-fashion store that doesn’t have price tags. It’s so uninformative (and in this case, aloof) that it’s classy.

Little regard for scale or padding

Bloomberg’s getting pretty experimental these days, and I love it. Imagine the trials and tribulations the designer had to go through to get that approved with the big boss.

The reason this is awesome is that it’s so different. It pays little regard to hard design rules: leaving enough space between elements, keeping things at similar scale, and even making sure that everything is suitably readable on all devices.

References to legacy tech

Many of us will have fond memories of Windows 98, or early Mac operating systems. Some websites instill a sense of nostalgia—and, perhaps humor—by making references to old software. After all, a lot of brutalist web design does come from the ‘old days’.

Check out this example from Post HTML (these folders each contain experimental art).

What this means for designers

We thought that flat = simplicity, but obviously it still needed a ton of design work to get it right.

With brutalist aesthetics coming to the forefront, designers will need to rely less on traditional CSS frameworks and code sites from scratch.

However, it doesn’t seem to be businesses that are employing this trend on their sites. Brutalist design—aside from Bloomberg and some other bigger names—is, right now, confined to design agencies, experimental sites and personal blogs.

If you want to make your own brutalist website, here are a few pointers…

Strip the CSS out of your current site

While some sites rely heavily on CSS for horizontal positioning, it is possible rip all styling from some sites and still have them display ‘properly’. Here’s an example:

If your site relies on flashy animations, JavaScript or fancy CSS, it will probably need remaking if you want to adopt this style. In fact, the reason I ditched WordPress was because I couldn’t find a theme that fit my vision. In the end, I actually ended up learning HTML/CSS by editing an ancient template from the early 2000s. After that, I felt confident to go ahead and start over, scribbling my own messy CSS and making the furthest thing from a polished, ‘modern’ site.

Cut back to monochrome

Sometimes, brutalist design means simple design. And that’s always great for the user experience. Cutting back your current color palette to just 2 colors (black and one other—white, technically), can help reduce the user’s overload and give them a clearer direction on where to go. After all, you don’t see sites with a ton of different colors in the text area because it’s hard to focus on.

Get creative with text positioning

Who said you have to have everything line up nicely? Loïc Dupasquier’s website above, for example, is a bold statement that says something about the designer. Looking exactly the same as every other potential hire isn’t a good look.

Unless you’re the most famous designer in that field, you’re always going to be second best. By shunning traditional ‘rules’ about typography, you’re standing out from the crowd.

Re-learn the basics & old ways

For me, it wasn’t a matter of adapting a design or skillset to a new mentality. I learned the basics of web design back when sites actually looked like the ones I’ve shown you, so all I had to do was take a quick refresher and get to work.

I’d recommend checking out the source code on old sites and those featured on Brutalist Websites, old HTML tutorials, or this goldmine that features a list of the earliest websites that are still alive.

Where this style works well (and where it doesn’t)

In the end, a website is always a balance between self-expression and creating the best experience for your users.

On a blog, it’s probably best to concentrate on making the body of the text easy to digest. You’ll notice that while Bloomberg’s piece on Yahoo starts out pretty weird, the main body of text is easy to read.

So, when you’re building a blog, it’s better to stick to conventions for the body of the article. For example, WIRED‘s design is quite distinctive but when it comes to the articles themselves, they use a pleasant font and keep it readable.

For a designer that works mostly with stuffy corporations, an experimental portfolio might put the client off at the most vital moment—first contact.

In the end, it comes down to knowing your audience, and whether you can get away with totally ignoring conventions.

Go forth, and make something disgustingly brilliant.

Bundle of 265 High Quality Vector Textures – only $24!

Source

Whether you have a full design tool kit, or you are lacking this or that, there is usually an additional resource, tool, or service that you can take advantage of to improve your work, your workflow, or your skills. There is always room for improvement, or room for a tool that will make one aspect of your work just that much easier.

• One of the books in this selection could be just what you’ve been looking for to learn a new skill, or to learn how to work smarter and faster.
• Freebies are always nice to have on hand, particularly when they are useful and of high quality; as is the case with the freebies listed here.
• Turning you project over to a professional developer can save you time, and save you money as well, if your team does not have the necessary coding skills or tools.
• Most of the items listed here are genuine time savers, especially in the areas of big data and UX testing.
• Many providers of high-quality design or test tools will give you a free trial, and there is also open source software you can use at no cost.

The UDX Book

If you’re looking to find a job as a web designer, or if you already have a design job, and you are looking for ways to advance your career, this book is for you. UXD is loaded with tips and techniques on how to create an irresistible resume or portfolio, how to prepare for a job interview, and how to negotiate like a seasoned pro.

You’ll also learn some real world skills that are not taught in design school.

Responsive Web Design with HTML5 and CSS3

If you’ve already learned HTML5/CSS3, it’s time to take the next step, and learn how to code responsive and “future-proof” websites. This book will show you the way. You’ll even get a sneak peek into upcoming CSS4 features.

This book is a comprehensive source for all things responsive. You will learn how to employ a “responsive and mobile first” methodology. You can read it from beginning to end, or use the stand-alone chapters as references.

Freebies

Design Freebies by Visual Hierarchy

Here is your chance to take yourself on a no-cost shopping binge for some quality items if you’re on the lookout for some font or icon freebies, or maybe a UI design freebie or two.

You don’t have to look several different places for these items, thanks to Visual Hierarchy. VH has put together a big selection (200+) of freebies, including those mentioned, plus Sketch freebies, mockups and more.

Free Desktop and Digital Publishing Mockup

This mockup is nicely laid out on three levels. You’ll find it most useful for desktop and digital publishing applications. Features include multiple design elements and levels. It’s free, and you are welcome to download it and open it in Photoshop.

This is one of several freebies that have been contributed by members of the Behance community for use by web and digital designers.

Prototyping Tools

Proto.io

With Proto.io, you can create a high-fidelity, animated, interactive prototype in minutes, with no coding needed. To give you an idea of this tool’s quality; it is used by major corporations like Disney, ESPN, BBC, PayPal, and Amazon.com. These corporations use Proto.io’s prototype designs before committing resources for production. They also make full use of this tool’s program management and collaboration features.

What works for them, should work for you, if you want a tool to build prototypes with the look and feel of the real thing. A full-featured subscription can be yours for a 30-day free trial.

PowerMockup

PowerMockup is an add-on that turns PowerPoint into a powerful prototyping tool. PowerMockup integrates an 800+ UI element library pane into the PowerPoint window. From this library pane, it’s a simple matter to select the shapes you need to build your prototype and drag and drop them onto a PowerPoint slide.

You can add your own shapes to the library; and since you can import and export shape categories, you can share them with others if you choose. This, coupled with PowerPoint’s collaborative features, provides an ideal situation when working as a team.

Design to Code Services

PSDgator

Send PSDgator your PSD file, and receive hand-coded, pixel-perfect HTML5/CSS3 in return. The PSDgator team does a lot of that type of development work, but they are in fact a full-service team that delivers a range of solutions. This highly-talented team specializes in conversion of PSD files onto WordPress and other CMS platforms, theme design and development, eCommerce solutions using WooCommerce, plugin development, and much more.

The green gator’s team will be happy to discuss the solutions they offer, but if PSD conversion is what you need, this is a great place to have it done.

PSD2HTML

PSD2HTML® is an ideal coding partner if you want the services of a development team that has served digital, marketing, and design agencies for over 11 years. With more than 100,000 projects under their belt, this team of results-driven pros provides HTML/CSS markup, solutions for a range of e?ommerce, CMS platforms and the slickest JS interaction.

PSD2HTML® are pioneers when it comes to PSD to HTML services, they deliver the best code quality, every time. Don’t wait. Let PSD2HTML® helps your team reach new heights today.

TheSiteSlinger

Check out The Site Slinger site if you’re looking for an exceptional PSD to HTML service. These results-focused professionals will transform your designs into amazing code smooth and fast.
The Site Slingers have made a few key improvements recently, too. Their simple navigation and striking layout have made the user experience slicker than ever.

The Site Slinger is the place to go for an ace-high markup. So send your designs over and let the Site Slingers do the rest.

Multipurpose WordPress Themes

Be Theme

Be Theme, the biggest WordPress theme ever, is a favorite of a huge number of users, and it always will be. One of the reasons? – Be’s 210+ (and counting) modern, professionally-designed, pre-built websites. They make building stunning websites and blogs an easy task.

Be is easy to use, and it has plenty of cool core features to help you along; plus, their customer support is second to none.

X Theme

X Theme, by Themeco, is the most feature-rich theme on the market for 2016. Add to that the fact that it comes with Cornerstone, its innovative 100% front-end page builder, a host of extensions (22 and counting), and a live previewer that lets you see what you’ve accomplished before you publish it.

Purchase X Theme, and you can get ready for most customizing fun you’ve ever experienced.

eCommerce WordPress Themes

Merchandiser

Merchandiser is simple, fast, and reliable. The reason? – it’s minimalist design. It is loaded with features you need to build a stunning online store, but nothing more. You won’t find the bells and whistles that contribute mainly to slowing things down, or making the learning curve steeper.

What better way to create online stores based on minimalist designs, than by using an eCommerce theme based on that modern trend?

XStore

XStore is another eCommerce theme based on the “what you see is what you get” design principle. This theme has just what you need to make your eCommerce sites professional looking, appealing, and trustworthy.

With XStore, you can create an awesome online store that features a pair of special effects – skins and hover – that are guaranteed to capture and engage users, and do wonderful things for your conversion rates. Check out the demos – and you’ll agree.

Website Builders and Platforms

Webydo

Having a powerful design tool that is easy to work with is a good thing of course, but sometimes what you really need is a way to increase productivity by streamlining your design process.

With full creative control and no technical barriers, Webydo enables professional designers and web agencies to grow their operation.

White label branding, SEO capabilities, web hosting, client billing and a built-in CMS are just some of the business-oriented features that may be found in Webydo’s central Dashboard. Webydo enables you to boost productivity and quickly create beautiful websites for any client.

XPRS

Most professional web designers are well acquainted with drag and drop page builders, and most excel at using these tools. There is however, a better way, and XPRS can show what that is. It’s faster and easier to build pages – and websites – using a modular, Polydom approach, and you’ll end up with website that provides superior performance as well. Polydoms are used like Lego blocks.

If you are a “drag and dropper”, the folks at XPRS will give you a free license to try their approach out. They also have a white label offering – unlimited licenses for a $350 annual fee.

WordPress Plugins

wpDataTables

wpData Tables is a WordPress add-on that allows you to analyze big data and present the results in concise, easy-to-understand charts and tables. Data of particular interest, or data ranges, can easily be highlighted.

The tables are natively responsive, and can be made editable. This add-on is a huge time saver and a great help when you are faced with looming deadlines.

W3 Total Cache

W3 Total Cache will improve the UX of your website through increased server performance, download time reduction, and by providing transparent CDN integration. More than 1 million copies of this WordPress optimization tool are actively installed.

W3 Total Cache can improve overall site performance by a factor of up to 10X, and bolster your site’s rankings on Google.com, as well as its conversion rates.

Stock Images

PhotoSpin Royalty Free Stock Images and Subscriptions

Photospin, with its well-organized inventory of millions of top-quality stock images and vector files, is an excellent resource to have access to. You can easily drill down to find an image to suit your needs – including images of up to 17 inches in length.

See which of their subscription plans will fit you best. If you sign up today, opt for their annual plan. Mention Promo Code BAW20, you’ll receive a 20% discount.

Stockfresh

Stockfresh is another resource worth a look. They feature millions of nicely-organized, hand-picked photos and vectors to pick and choose from. If your needs are minimal, you can purchase items separately. Otherwise, you’ll save by signing up for a subscription plan.

In any event, you can sign up for free to browse through the Stockfresh offerings.

Collaboration and Task Management

InVision

InVision is the world’s leading product design platform. It gives designers and design teams the ability to prototype, review, modify and refine, manage, and user test their web and mobile product designs. All of this can be done with a single tool and without having to resort to a single line of code.

Get your free Enterprise trial, and soon you may find yourself in company with Apple, General Motors, IBM, and others.

Azendoo

If your project tracking and collaboration operations aren’t quite what you need them to be, Azendoo has just the solution. With this collaboration and task management tool, everyone on your team, along with other project stakeholders, can collaborate and share information in real time.

No one needs to be mistakenly left out of the look, plus Azendoo is great at organizing tasks and smoothing out your workflow.

UX and UI

Loop11

Loop 11 can help you resolve a number of recurring issues. It eliminates the need to decide between multiple tools for working with big data or user feedback analysis. You no longer need to dread user testing because with Loop11 it’s so simple.

Now, you can run hundreds of users through each test, collect volumes of data, and quickly have the results you need to base your design decisions on.

Google Content Experiments

If your UX testing approach up until now has been to tweak the contents of a landing page, and wait to see the results, Google Content Experiments will show you what you need to do to improve landing page performance, and in a hurry.

With this Google Analytics tool, you can test up to 10 landing page versions at once, to see which can be expected to perform best; plus, you can track user response over time.

Other Useful Tools

Vivaldi

You may have all the web-building and productivity-enhancing tools you need readily at hand, but there always seems to be something to hold you back. If it’s your browser, and it could well be, give Vivaldi a try. Vivaldi is a web browser that adapts to your needs, not the other way around.

Download it and give it a try; the odds are that you’ll decide to stick with it. After all – it’s your browser.

Coolers

Coolers provides just about the easiest way there is to pick precisely the color you need to use in your design or save for later use. You can use the analog approach to scan through a range of shades and color combinations, type in the hex code (assuming you have it handy), or view and export colors with the browser.

Coolers makes what could be a complicated operation seem like child’s play.

Wrapping it up

To describe these resources and tools as “useful” is probably an understatement. Included in this list are several of the most productivity-enhancing design tools on the market.

The UX testing tools do much more than merely automate manual procedures, and add-ons like wpDataTables take the fear out trying to perform analyses on big data.

The books that are offered will help you learn new skills, or upgrade existing ones, most of the tools will save you time, and the freebies and open source applications will save you money; not to forget the free trials.

Read More at Fresh Resources and Tools for Improving Your Design Game

At my day job, we have about 1,000 sites spread across 30 WordPress multisite installs. The installs all run many of the same plugins and settings, especially at the network level. This causes a lot of wasted time for our staff: They have to manually repeat the same settings across 30 installs. Because of this, we’re moving to something I like to call “Remote Control WordPress”.

We designate one install as the “control”, where we configure network settings, and then the other 30 “client” installs get their network settings from the control.

It’s going to take me several articles to lay this all out. I hope you pore over every pain-staking and obscure detail. This method has the potential to save us dozens of man-hours per year, and also greatly reduces the chance for human error. Fewer clicks means fewer mistakes! It’s a tricky approach and new approach, but I’m stoked about it.

Here’s an overview, before we dig in deeper:

• The control install exposes data via the WP REST API V2 plugin.
• The control install runs a custom plugin to add network settings to the WP API (they’re not in there by default). This custom plugin also registers a global variable that gives us a programmatic way to distinguish between the control install and the other 30 client installs.
• The control install runs the Oauth1 plugin to secure the settings from public browsing, yet expose them to our scripted requests from the client installs.
• Both the control install and our 30 client installs run many “feature” plugins: custom network plugins that provide common WordPress hackery, such as a custom logo on the wp-login screen.
• Both the control install and our 30 client installs run a custom plugin for managing network settings. It provides an abstraction layer for our feature plugins to get their settings from the control install.

What You’ll Need to Follow Along

• Two WordPress multisite installs: One will be the control install, and the other will act as a client install. In my examples, the control install will be my personal website, and the client install will be my local MAMP. At time of writing, both installs are on WordPress 4.5.3. In this first article, we’ll only need the control install. Subsequent articles will involve the client install.
• A total of five plugins, as I eluded to above. Some of them are on GitHub and some of them are in the .org repo. Some of them are written by me, and some of them are written by people way smarter than me. Some of them will likely be part of core someday, and some of them are just for demonstration. I’ll address them each as they’re needed. This first article will require two of the five plugins.
• The theme doesn’t really matter, but my examples will depict twentysixteen. If you have any problems following along, mimicking that would be a good practice.

Are you with me so far? I realize this has been a fast overview, but just like at the end of middle school dances, we’re about to slow things down. Our goal for the rest of this article is to expose network settings to the WP API on our control install. We’ll get to the rest of the components in subsequent articles. Fire up your test installs and follow along!

JSON Returns

Alright, on your control install, try browsing http://example.com/wp-json/wp/v2/posts. This should get you a 404 error.

Now install and network activate the WP REST API V2 plugin and browse /wp-json/wp/v2/posts again. You should get something like the following:

Sweet! You have JSON data now. Surf around for a bit, using the endpoints in the docs as a guide — or better yet, the link urls in the JSON response itself. For more details, also see this excellent article by Andy Adams on fetching posts via the API.

You might notice in the docs that network options are not available for fetching, but we’ll fix that soon. For now, just load /wp-json/css_tricks_wp_api_control/v1/ url on your control server and note the 404. Then, install and network activate my CSS Tricks WP API Control plugin. That /wp-json/css_tricks_wp_api_control/v1/ url should work for you now, returning some data about the network_settings route my plugin registers.

If you squint hard enough, you’ll pick up on the most interesting part of the response:

"args":{"meta_key":{"required":true}}

That’s telling you that my endpoint accepts one argument, called meta_key, and that it’s required.

So, /wp-json/css_tricks_wp_api_control/v1/network_settings — what’s that url all about? The /wp-json/ portion is ever-present for the WP API. That just means you’re getting JSON. The /css_tricks_wp_api_control/ portion is the namespace for my plugin. Note that core uses the namespace /wp/, such as in the posts example above. The /v1/ indicates that this is version 1 of the endpoint that my plugin is using. I could update this version number if I want to break backwards compatibility, but otherwise I would not, say, update this each time I update the version number of my plugin itself. Finally, I’ve chosen to register the /network_settings/ endpoint for getting network settings.

Digging into the Control Plugin

The control plugin has two purposes. First, you’ll see that it registers a global variable, CSS_TRICKS_WP_API CONTROL, which other plugins can sniff for in order to determine if they are running on the control install or a client install.

Second, you’ll see that it registers network options for querying in the WP API. That file is thoroughly commented — please give it a quick read. For now, I’ll highlight two functions:

callback() is what returns the network settings from the database. It requires a GET variable for meta_key, giving us a way to get a specific network option. You can see that it’s required if you try to load /wp-json/css_tricks_wp_api_control/v1/network_settings without tacking on a ?meta_key=whatever: You get a 400 admonishing you for failing to provide a meta key.

permission_callback() designates that, when requesting data from our custom route, the we must provide some authentication in order to see the network settings in the WP API, otherwise we’d probably have a security problem. We’ll do this via the OAuth1 plugin in the next article. For now, you can see that auth is required if you try to load /wp-json/css_tricks_wp_api_control/v1/network_settings?meta_key=whatever: In this case, you get a 403 spanking you for failing to authenticate.

If you’re interested in exploring the network_settings endpoint without dealing with authentication, you can omit the call to permissions_callback, or make it always return TRUE, but beware that it’s a security hole.

This file could have been written much differently. For a more complex endpoint, you’d be better off extending the WP Rest Controller. I think that would be overkill for our case, and certainly would be a tutorial unto itself.

Next Steps

There are a few different things you should be wondering about at this point.

One is authentication. How are the client installs supposed to make it past permission_callback()? We’ll accomplish this in the next article via a long and brutal battle with the OAuth1 plugin.

Another is DRY/WET. If our 30 client installs run many feature plugins, wouldn’t it be a drag if all of those feature plugins hard-coded a query to the control install? Therefore, we’re going to write an abstraction layer that all of our feature plugins can use to query the control blog. The control blog will even use it to get settings from itself! Heady stuff; I’ll save that for the third and final article in this series.

Then there’s performance. We’re going to make an http request each time we need a lousy setting? Nope. We’re gonna cache the results, which I’ll also demonstrate in the third article.

More generally, you might just have the objection that this seems like a lot of work. To this I’d say, compared to what? I’m writing this series because I think it’s better than having a staff manage the same settings across 30 installs. I think by the end, you may agree!

Other Resources

If you’re having trouble following along thus far, here are the best places to go next:

1. Buying the WROX book on plugin development is like buying yourself a career.
2. Torque’s WP API book. These guys run WP Engine – need I say more?
3. The WP API Docs, where the section on extending the API is particularly relevant to the terrain we’ve covered thus far.

Ready For More?

If you’re following so far, brace yourself for a savage dance with OAuth in the next article!

---

The WP REST API for Remote Control WordPress is a post from CSS-Tricks

Even though web developing may sometimes be a tiresome job, there are some tools which web developers can use to ease their work. That’s when these best free editors or IDE – Integrated Development Environment come in handy!

We selected some of the best IDEs with lots of useful functions for web developers. The best thing is that all of these editors are free, though some may have premium versions as well.

These free editors will allow you to see codes in separate screens and show you the results of your work, instantly. These free editors are incredibly helpful for both beginner and more experienced web developers as well.

These free editors will let you develop in almost any kind of languages such as HTML, PHP, CSS, Javascript, Java, Python, Perl and more.

Check out our list of best free editors for programmers and choose the one you like most. Do you have any other suggestions for us? Let us know in the comment section below.

CODELITE

CodeLite is an open source, free, cross-platform IDE specialized in C, C++, PHP and JavaScript. This is a lightweight free editor that runs on all major Platforms ( OSX, Windows and Linux).

JS BIN

Jsbin can be used by programmers to create online web applications with HTML, CSS and JS.

BLUEFISH

Bluefish is a powerful free editor for programmers. It comes with many options for websites, scripts and programming code. It also supports many programming and markup languages.

ECLIPSE

Eclipse is a very popular free editor, especially among Java programmers. It is so well known due to its advanced features and to the fact that it can be used with more languages like PHP, C/C++.

KOMODO IDE

Komodo IDE is an open source editor that can be used with many programming languages including Perl, Python, HTML, CSS, JavaScript, Ruby and Nodejs.

APTANA

This free editor will help you build web applications quickly and easily. Aptana Studio harnesses the flexibility of Eclipse and focuses it into a powerful web development engine.

SHIFTEDIT

ShiftEdit is the editor you can use to develop web applications with HTML, CSS and PHP. It comes with useful features like Autocomplete, syntax highlighting, live editing and more.

GEANY

Geany is a free text editor using the GTK2 toolkit. This editor comes with some basic features of an integrated development environment. It is a small and fast IDE.

XCODE

Xcode is free IDE for Mac users. It offers a great environment for programmers for building apps for Apple devices.

MONO DEVELOP

MonoDevelop lets programmers quickly write desktop and web applications on Linux, Windows and Mac OS X. It is also used by developers to port .NET applications created with Visual Studio to Linux and Mac OS X.

DABBLET

Dabblet is a free online tool for designers and developers who work on web applications with the help of HTML and CSS.

WEBSTORM

WebStorm is a lightweight, powerful IDE.. This can be used for more complex web developments and server-side development with Node.js.

LIVEWEAVE

This free online editor tool supports multiple languages and it is used by programmers to design and develop web applications.

NETBEANS

NetBeans is an open source editor with a worldwide community of users and developers. It lets you quickly and easily develop desktop, mobile and web applications with Java, HTML5, PHP, C/C++ and other languages.

CODA

Coda is a free text editor for programmers. It is brought to you with features such as syntax highlighting, code folding, project-wide autocomplete, fast find and replace, indentation guides, automatic tag closing, and more.

MARIAMOLE

MariaMole is a free editor with an easy but advanced interface for coding. Use it for free!

SQUADEDIT

Squad is a web-based collaborative IDE. It has premium plans as well.

KANTHAROS

Kantharos is a great free editor that provides a fast & portable PHP scripting environment.

DRJAVA

DrJava is a lightweight development environment for Java programs. It comes with an intuitive interface and the ability to interactively evaluate Java code.

LAZARUS

Lazarus is a Delphi-compatible cross-platform editor for Rapid Application Development. It has variety of features to easily create complex graphical user interfaces.

The post 20 Best Free Editors for Programmers appeared first on Web Design Blog | Magazine for Designers.

The benefits of UI design systems are now well known. They lead to more cohesive, consistent user experiences. They speed up your team’s workflow, allowing you to launch more stuff while saving huge amounts of time and money in the process. They establish a common vocabulary between disciplines, resulting in a more collaborative and constructive workflow.

They make browser, device, performance, and accessibility testing easier. And they serve as a solid foundation to build upon over time, helping your organization to more easily adapt to the ever-shifting web landscape. This article provides a detailed guide to building and maintaining atomic design systems with Pattern Lab 2.

The post Making And Maintaining Atomic Design Systems With Pattern Lab 2 appeared first on Smashing Magazine.

Launched this week, Atomic’s new plugin for Sketch is a free addition that streamlines artwork transfer between the two for a much accelerated workflow.

Atomic is one of the most popular examples of the new breed of design app, focused not on how design looks, but on how design behaves. Launched last Summer it’s a favored tool of many designers who shun the omnipresence of Adobe’s Creative Cloud, and aren’t convinced by the traditional approach Serif’s Affinity suite; if you’re using Sketch for UI design, you’re probably using Atomic for prototyping.

The philosophical connection between the two apps has been there from the start, but until now—because they’re made by different software companies—the best way to get artwork out of Sketch and into Atomic was by copy and paste. Hardly a slick process.

Atomic’s new Sketch plugin links the apps like never before. Design your layouts in Sketch, then bring your prototypes into Atomic via the new export options. When exporting you have the option of transferring a single flattened image, a series of flattened artboards, or a series of layered artboards.

Sketch Plugin for Atomic from Atomic on Vimeo.

Having produced your design elements in Sketch, creating a prototype in Atomic is simple. It doesn’t produce production code, it’s not a WYSIWYG. Atomic is similar to Adobe’s Experience Design application, it’s focused on creative interaction design.

Toolsets need to complement each other, and it’s through finding ways to work together, that individual apps like Sketch and Atomic can challenge the Adobe dominance of the market. As we’ve seen with the flood of updates from Adobe in the last few years, competition breeds innovation; anything new to the market benefits all users, regardless of their tool of choice.

Atomic’s new plugin doesn’t deliver anything radically new, it simply removes one of the pain-points designers experience in their workflow, and allows them to focus on the creative side of their job. If you’re using Sketch with Atomic, it’s worth trying out.

The Atomic Sketch Plugin is free to download. Atomic starts with a 30 day free trial, after which prices begin at $15/month/user.

Bundle of 265 High Quality Vector Textures – only $24!

Source

Here’s a challenge for you: what about building a 3D game over the weekend? Babylon.js is a JavaScript framework for building 3D games with HTML5, WebGL and Web Audio, built by yours truly and the Babylon.js team. To celebrate the new version 2.3 of the library, we decided to build a new demo “Sponza” to highlight what can be done with the WebGL engine and HTML5 today when it comes to building great games.

The idea was to create a consistent, similar, if not identical, experience on all WebGL supported platforms and to try to reach native apps’ features. In this article, I’ll then explain how it all works together, along with the various challenges we’ve faced and the lessons we’ve learned when building it.

The post Building A Cross-Platform WebGL Game With Babylon.js appeared first on Smashing Magazine.

Speed may not be everything. However, it is an important aspect of any web project. Especially when distributing significant amounts of data, such as images or other multimedia content, it’s crucial to make sure that the user receives them as fast as possible. Too much buffering or long loading times can already be enough to make visitors leave your website. Most of the time, fast transfer of such content can only be done reliably using a content delivery network (CDN). CacheFly is one of them, providing speed, safety, and reliability.

Fast Transfer – Worldwide

One of CacheFly’s selling points is the fact that its network is connected to over 40 internet nodes all over the world, resulting in naturally fast data connections. In Germany, the node DE-CIX in Frankfurt is among the strategic hubs. That’s because DE-CIX is the largest internet node worldwide when measuring by throughput.

CacheFly is connected to strategically important nodes in both North America, and Europe. According to measurings by the analysis service CloudHarmony, CacheFly is one of the fastest content delivery networks in these regions. Its CDN can reach a throughput of over 18 megabytes per second when dealing with large files. Due to the rather slim presence in other areas like Africa, and Asia, the service nets a lower bandwidth there.

Worldwide Points-of-Presence – Mainly in North America and Europe

Nonetheless, CacheFly’s speed is nothing to sneeze at, even leaving some providers with local servers behind.

Costs Between Three and Ten Cent Per Gigabyte of Traffic

To convince you of CacheFly’s speed, you can conduct a test for two weeks. The service’s regular prices depend on total traffic. If you stay below ten terabytes of traffic, you’ll pay 10 cents per transferred gigabyte. The higher the total traffic, the lower the price per gigabyte. Starting at 500 terabytes, you’ll only pay about three cents.

The cost for the web space is 2 USD for the first 10 gigabytes, 1.50 USD for the next 40 gigabytes, and one USD for everything above that. You will only be charged for the web space you actually use. If you only use one gigabyte of storage, that’s all you will need to pay for. There’s a transparent overview that displays all costs for web space and traffic in the respective regions, being North America/Europe, Asia, Australia/Africa, as well as South America/India. This way, you’ll always have an eye on your monthly expenses.

However, the minimum charge will be 50 USD a month, being the fee required to use the service. As you can tell from the prices, the service was mainly designed for those that need to transfer large amounts of data. For most of the “standard” providers, the mentioned volumes will already exceed the provided web space, as well as the monthly traffic.

Upload Via FTP, Security Via HTTPS

Comfortably upload your media content via an FTP access. You also have the option to set up additional FTP users, which only gain access to individual folders, if necessary. You’ll receive a subdomain in the form “account name” followed by “.cachefly.net.” This allows you to comfortably integrate your content into your web project, using your content management system.

Simple User Interface

On demand, all content is available to you via a safe HTTPS connection. Thanks to Gzip compression, your content will be transferred even faster. Thus, CacheFly assures the most optimal compression and speed.

If you prefer using a custom domain to access the CacheFly files, you can deposit domains, as well as subdomains, which you want to be used for the transfer. You simply need to adjust your web host’s DNS settings, so that the domain is redirected to the IP address of CacheFly.

Easily Creating Expiry Headers

Particularly for large files, caching makes sense, preventing reload whenever it’s possible. Of course, you should think about for how long a file should stay in the cache. Images often remain unchanged, which is why you could set a generous expiry date.

CacheFly provides an easy to use management for expiry headers. This way, you can define for how long the respective content should be cached, for single folders, or file types. If necessary, define multiple rules for the expiry header, and prioritize them.

Blocking any referrers, and overwriting them with MIME types if needed is very easy as well. Instead of solving all of these tasks using a “.htaccess” file, CacheFly provides a clean management interface, allowing you to make all of these settings.

Extensive Statistics – Also in Real Time

To make sure you know when which content is downloaded, CacheFly gives you comprehensive statistics. You can use them to create daily summaries, but you can also demand information over which node this content was delivered, or which countries the requests came from.

Real Time Statistics Keep You Updated

Another interesting and important aspect is the option to receive an overview of flawed requests. Then, CacheFly will create a report on all 404 errors, and tells you which missing data was accessed.

The real time statistics are currently in a beta stage. These will inform you about how many requests are currently made each second. Whenever necessary, comfortably download all reports and statistics as a PDF file.

Suits Both Small and Large File Delivery

Fast and reliable transfer is of particular importance when it comes to video and audio content. With an availability of 100 percent, CacheFly guarantees that your content will be available at any time. This erases the risk of a service outage. Did I mention that images are compressed on-the-fly to speed up delivery and minimize bandwidth load?

However, CacheFly is not only a good choice for multimedia content. For example, you can also use the service to provide applications for download. If your customers depend on your software, they will be more than angry when they can’t download it reliably.

Not Only Suitable for Video and Audio Content

When offering software-as-a-service (saas), instead of traditional applications, an outage-proof service is even more important. To guarantee users that they will always have a fast, outage-free access to your service, CacheFly is the right partner for you.

Conclusion

When safety, speed, and reliability is important to you, CacheFly is a perfect choice. The service is very transparent, and easy to use, and provides everything that helps you distribute significant amounts of data worldwide, fast, and outage-free. The prices are as transparent and flexible. The two-week trial allows you to test the service in-depth. When comparing it to your “average” web host, you’ll notice a significant difference in file download speed.

Talking of speed, I guess you have already heard about Google taking performance as a ranking factor. Speeding up your site’s content does good to your search engine ranking. And CacheFly delivers your content lightning-fast. The conclusion is yours to draw;-)

So then. I’d suggest you make up your own mind and give CacheFly a chance. Sign up for their 14-day free trial and see what they can do for you.

(dpe)

Until now, safe TLS connections for websites were only obligatory when personal data was transferred. This is the case for online banking, shops or social networks, for example. But this is supposed to change. Google plays a significant role due to its initiative “HTTPS everywhere”, forcing safe connections to become the standard for all websites.

Open Networks

For most websites, there was no necessity to deliver them via HTTPS. News pages, business and organization websites all worked fine without encrypted transfer. Simple contact forms were usually transferred without encryption as well. However, everyone needs to be aware that, without a safe connection, the transferred data can be read by third parties, which is a major problem in open networks.

Due to the growing importance of the mobile web, we and our smartphones and tablets are in open WiFi networks ever more often. This also increases the risk of the communication with the websites you visit being captured. Thus, it makes sense to generally use a safe HTTPS connection, even when no personal data is transferred, for the sake of your own privacy.

Google forces HTTPS

Google and its campaign “HTTPS everywhere” are a major reason as to why safe connections are becoming the standard. In 2014 Google’s announcement to introduce HTTPS as a soft ranking factor drew a lot of attention to the topic. However, Google explained that only one percent of search requests worldwide are affected by this ranking factor. Nonetheless, they also announced that HTTPS is a very significant ranking factor, in any case, to encourage the switch from HTTP to HTTPS.

Connection Warning in Chrome

On top of that, Google has also added a feature to its browser Chrome that marks websites that are delivered via HTTP with a lock crossed in red. You can already activate this feature on “chrome://flags”. Search the settings for “Mark Unsafe Origin as Unsafe”.

Settings for Unsafe Connections

If Chrome ever happens to activate the feature by default, all HTTPS connections would be labeled with a warning, while HTTPS connections would be marked with a green lock, as they already are. Visitors of your website could be scared off by the alarm, suspecting a potentially unsafe or sketchy website.

JavaScript APIs for Safe Connections Only

The label of unsafe connections is not the only thing separating HTTP and HTTPS in your browser, however. Modern JavaScript APIs that grant access to webcam and microphone, for example, can only be executed in Chrome and other browsers via HTTPS.

Camera Access Only Possible With HTTPS

Since Chrome version 50, operating the Geolocation API using an unsafe connection is not possible anymore. Before, you could read a user’s location with a simple HTTP connection, and from now on, HTTPS is necessary to do so.

It is not possible to rule out that Google Chrome will also only execute other APIs when combined with a safe connection in the future. It has already been announced that the orientation, as well as the fullscreen API, will soon only be usable via HTTPS.

Free Certificates Using “Let’s Encrypt.”

One reason against safe connections has always been the financial aspect. You can’t have an HTTPS connection without a certificate. The providers of these certificates usually charge a notable price for them. However, “Let’s Encrypt” now allows you to create a free Certificate for your domains.

Website of “Let’s Encrypt.”

Since all relevant browsers accept the “Let’s Encrypt” certificates, you don’t run the risk of your browser displaying a warning due to an unknown originator. The first providers have already included the creation of “Let’s Encrypt” certificates into their plans, giving you fast and uncomplicated access to a safe connection for your website.

Conclusion

HTTPS as a Google ranking factor might not be this important now, but new security settings in the browsers might make it impossible to avoid HTTP very soon. Thanks to “Let’s Encrypt”, there is now a free and – depending on the provider – easy way to make your website safer, for the sake of your visitor’s privacy.

(dpe)