How to save an SVG from HTML

If you’ve worked with SVG’s before you may know that you can grab the file by inspecting the DOM through your browsers developers tools, and then copy and pasting the <svg… code into a new file and saving as file.svg. This works fine a lot of times, but what if the SVG has css styles applied? This is where it can get tricky and something I’ve been running into more and more.

SVG Export Plugin

Luckily there is a free Chrome/Firefox plugin called SVG Export that will do all this for you automatically and easily let you export into almost any format you desire. As well as letting you copy it to the clipboard and opening in popular apps like Sketch, Figma, and more.

Statamic SEO Pro with Laravel Controllers

Statamic has a great first party plugin called SEO Pro that includes a lot of settings every site probably needs for search engine optimization including things like og tags, dynamic titles, descriptions, and even canonical urls.

It has been working perfectly for me but today I hit a small snag with how it tries to dynamically set the canonical url and it wasn’t working when loading Statamic Antlers views through a Laravel controller. For example, here is the code I use to show an about page:

return (new \Statamic\View\View)
    ->template('about')
    ->layout('layout')
    ->with([
        'content' => 'my content here',
    ]);

When this page is loaded the SEO Pro plugin was using the home page as the canonical url.

<link href="https://mysite.com" rel="canonical" />

To set your own canonical URL you just need to pass it manually like this:

return (new \Statamic\View\View)
    ->template('about')
    ->layout('layout')
    ->with([
        'content' => 'my content here',
        'seo' => ['canonical_url' => 'https://mysite.com/about']
    ]);

With that in place the plugin will pull the setting you pass and use it in the parsed html source. I’m sure you can also change other settings this way as well, so if you ever need to dynamically customize what data it uses look at adding to an “seo” array when passing your data to the view.

Inspect Browser

Ever wanted to debug a site or web app while on the go, or maybe view it on mobile and do some debugging? As you may know Safari on iOS doesn’t include any form of console utilities but the Inspect Browser makes a great replacement that includes all the basic features to get the job done.

Granted this isn’t as powerful as Chrome or Firefox but it includes the main features like a JavaScript console, HTML inspection, CSS inspection and live preview, network panel, responsive design tools, and more.

Commercial Packages

It seems everyone loves creating packages and releasing them as open-source. I understand the appeal, it’s much easier to release something this way as it lets you wash your hands of a lot of the responsibility.

Need a bug fixed, send a PR or GTFO. Have some questions about how to do something, hopefully, Stack Overflow can help you.

Of course, this is merely a caricature of some maintainers, and then you have others that are super responsive and are happy to help you use their package.

If you are one of the second groups that are responsive to support and community engagement then I’d love for more of you to consider making future packages commercial.  Granted it’s probably not going to be as easy as just pushing up a repo, but we have tools available now like gitstore that makes this easier than ever before.

This came about because I struggled with a JavaScript package all day yesterday, and today I found a similar commercial version that just worked instantly.  If I would have found it and went the commercial route first I would have already saved all the money in time that it costs.

TablePlus Workflow for Alfred

It seems many developers are making the switch to TablePlus because it supports a wide range of different database types, has an active development team, and is a stable app.

I started using it yesterday and I’ve been fairly impressed, plus they are working on an iOS version which I’m super excited about. If you are using it on a Mac here is a cool Alfred workflow by Chris Renga for opening a database quickly.

TablePlus Workflow for Alfred

If you are interested in this you can grab the workflow from GitHub.

1Password 7 for Mac

AgileBits just released 1Password 7 for the Mac and it comes with a ton of new improvements. Some of the things I’m really looking forward to is the new design and the ability for better app integration:

With our new app integration we’ll automatically suggest logins for the current app you’re using. Along with support for drag and drop, this is a real game changer.

Not being able to use 1Password for standalone apps is one of the reasons I’ve always preferred browser-based apps. So I think this alone will be huge.

If you are not using 1Password or another password management system then I highly recommend you start and you couldn’t go wrong with 1Pass. It’s seriously great and when you hook it up with 2fa logging in has never been quicker and easier.

 

Ulysses Plans to Improve The Code Blocks

From the Ulysses announcement:

The next Ulysses version will ship with greatly improved code blocks.

You’ll have to mark up the beginning of a code block only once to let it span as many paragraphs as needed. No more backtick fatigue! Also, we revamped the appearance of code blocks in the editor to make them easier to distinguish from the body text: they’re set in a monospaced typeface (what else would make sense for a code block?) on a colored background (depends on theme). What’s more, the new code blocks will import from, and export to GitHub-style fenced code blocks. Oh, and you’ll be able to use them in external folders as well. Yay!

I really like Ulysses, but code blocks are the number one reason I stopped using the app. The current system is clunky and annoying so I have a lot of high hopes for this change. It does worry me how this is described and I’m assuming it isn’t going to support traditional three tick markdown code blocks, but instead some special block.

 

Open Source – Donations vs Selling

I know most people do not create open source projects to make money or to even get reimbursed for their time, but as a project gains success more than likely it will incur some expenses. It would be nice to have some sort of revenue attached to the project so you can cover those.

I’ve seen two basic ways of generating revenue in open source, the first is donations, and the second is by selling something, a commercial license, priority support or something else.

What is funny is how people look at the two vastly different. For example, if you say here is a way to buy something for $20 then people will either buy it or move on. It’s a simple business transaction.

On the other hand, if you say donate $20, the average person goes into a completely different mindset and they want to know what you are going to do with the money, are you going to be frugal, is it required, and on and on.

It’s interesting how people are happy buying things even when a company might be failing and could go out of business tomorrow, but when it switches to a donation they want to see a P&L, balance sheet, and ensure their money is going to be spent well.

If you have a choice, sell something.

Hawaii missile alert

On Saturday morning a missile alert was pushed out from the Hawaii Emergency Management Agency and according to the Washington Post this was the cause:

Around 8:05 a.m., the Hawaii emergency employee initiated the internal test, according to a timeline released by the state. From a drop-down menu on a computer program, he saw two options: “Test missile alert” and “Missile alert.” He was supposed to choose the former; as much of the world now knows, he chose the latter, an initiation of a real-life missile alert.

I can’t imagine how a designer, developer, QA, and all the other links allowed something this bad to even make it into production. Much less something so important as a missile warning system.

I can’t imagine how scary it would have been to be on the island when this was pushed out and it makes me think of all the cold war bunkers we still have peppered around our nation. Back then I imagine everyone would have had the thought of dying at any minute in their mind. Which if we are honest is not necessarily a bad thing since it would keep your focus on what matters most to you.

From Make.WordPress:

Twenty Seventeen will focus on providing a seamless initial theme setup so anyone can set up a website for themselves or their business with minimal hassle.

I’ve been a fan of both twenty-fifteen and twenty-sixteen and I like the direction of adding video headers, but I’d really to see them create a super minimal theme one year without a focus on big bold images. The hunt for post images is such a huge time sink.

Use the Tab key for dialogs on a Mac

One thing that I’ve always found annoying on the Mac is that by default it’s not possible to “tab” between the different buttons in a dialog window.

This is possible but it requires finding this bizarre setting in the keyboard settings. To get this go to System Preferences -> Keyboard -> Shortcuts, then click the All Controls radio button.

Happy Tabbing!

WordPress now supports AMP

WordPress announced today that the wordpress.com service now supports the Accelerated Mobile Pages (“AMP”) initiative.

Accelerated Mobile Pages are just like any other HTML page, but with a limited set of allowed technical functionality that is defined and governed by the open source AMP spec. Just like all web pages, Accelerated Mobile Pages will load in any modern browser or app webview. AMP files take advantage of various technical and architectural approaches that prioritize speed to provide a faster experience for users. The goal is not to homogenize how content looks and feels, but instead to build a more common technical core between pages that speeds up load times.

There is also a WordPress plugin available for self-hosted installs.

I haven’t dug into the AMP documentation, but I do find it funny that we have failed so bad at creating websites that a new standard is needed to speed it up.

Alfred Snippets

I am a big fan of the application launcher Alfred. To call it an application launcher is an understatement as it is very powerful. In my day to day usage I probably only use a quarter of its entire feature set.

One feature I’ve been using a lot more of lately is its snippets. This is considered a power feature and requires the “power pack” that costs between £17.00 (single license) and £32.00 (mega supporter).

To set up snippets launch Alfred and go to settings. Then Features -> Clipboard -> Snippets. (The screenshot above is from this area)

Once you are on this screen you can add shortcuts of text that you typically use.

Continue reading “Alfred Snippets”

Switching to WordPress.com

Right around the Christmas break, I decided it was time to revive this site. I had an idea for a blog post and I logged in to create it. Instantly I was hit with the dreaded, “you have updates”, message. I ran through updated the core, then the plugins, and by the time it was over I had lost interest in what I was actually going to write about.

After this, I decided it was time for a change and you might say laziness took over. I did want to host it, I didn’t want to update it, and most of all I didn’t want to worry about it. So that left the typical SaaS choices. Squarespace, WordPress.com, etc.

Continue reading “Switching to WordPress.com”

A first look at the Flarum Forum Software

Flarum is a new open source PHP forum system developed by Toby Zerner and Franz Liedke. Toby and Franz both have history in creating forum software and with Flarum they decided to join forces and reimagine the forum landscape.

Gone are the days of the old style forums that has been popular for the past 20 years. With Flarum, it takes a fresh look and is both nice to look at and fully functional.

Let’s take a quick look at these new forums and see what all the excitement is about. Just note that Flarum is currently in beta, and any of this information can change.

Continue reading “A first look at the Flarum Forum Software”

Slack vs Hipchat – It’s not the design

I came across two posts discussing the design aspect of Slack and it’s $2.8 Billion Dollar Secret Sauce with a follow up from a designer working on HipChat, Slack’s design is not secret sauce.

Both of these got me thinking about the differences in the apps and for me they are both wrong. Both designs are good enough for my everyday communication. The only reason Slack is winning is because of the multiple account logins. At work, we used Hipchat, and it was a fine product that got the job done. Where it started lacking is when I would get invited to another companies account. The only way to use both was to have the browser open for one and the app for the primary. It was horrible.

That single feature alone made me champion the move to Slack. Of course, the ability to create public channels so open source projects, and teams can move off the dreadful IRC is another wonderful feature.

Shuttle – A simple SSH shortcut menu for OS X

Shuttle is a simple SSH shortcut menu for Mac. It’s designed to take the pain away from remembering all your SSH shortcuts and directly from your menu bar you can visually see all the SSH connections you have available.

I’ve been using it and love the simplicity of the app. Adding new shortcuts is easy and defined in a JSON file. However, if you already have connections defined in ~/.ssh/config it will automatically pull those in.

The project is open source and created by Trevor Fitzgerald and inspired from SSHMenu from Linux. If you have trouble remembering your connections or shortcuts definitely give this little app a try.