Spigot Design https://spigotdesign.com Clean, usable, and responsive web design and content strategy from Park City, Utah Thu, 17 Nov 2016 15:25:54 +0000 en-US hourly 1 https://wordpress.org/?v=4.7 https://spigotdesign.com/wp-content/uploads/2016/08/cropped-spigot-fav-2-32x32.png Spigot Design https://spigotdesign.com 32 32 44232909 Apple Pages hide / show guides keyboard shortcut https://spigotdesign.com/apple-pages-hide-show-guides-keyboard-shortcut/ https://spigotdesign.com/apple-pages-hide-show-guides-keyboard-shortcut/#comments Thu, 17 Nov 2016 15:25:54 +0000 https://spigotdesign.com/?p=9401 We’ve recently started using Apple Pages over InDesign for client proposals and contracts. It’s part of a larger strategy to start moving away from Adobe and the high cost of...

The post Apple Pages hide / show guides keyboard shortcut appeared first on Spigot Design.

]]>
pagesWe’ve recently started using Apple Pages over InDesign for client proposals and contracts. It’s part of a larger strategy to start moving away from Adobe and the high cost of Creative Cloud. Photoshop, Illustrator, and InDesign still have a strong place in my designer tool set. For admins and account execs, however, a full Creative Cloud account is overkill for proposals and contracts. The more we use Apple Pages, the more we find that it’s a pretty good replacement for InDesign.

There’s a lot missing however, especially some (most) of the keyboard shortcuts that InDesign uses. Showing / hiding guides is something I use a lot when in InDesign, and Pages doesn’t have a built-in way to do it. Here’s a quick tip to get InDesign style keyboard shortcuts for Pages. (Note this is the same way you can get a bunch of other keyboard shortcuts for macOS).

  1. Open System Preferences, then click on Keyboard
  2. Click on Shortcuts, select App Shortcuts, then click Add (+)
  3. From the Application dropdown menu, choose Pages
  4. Type in the exact name of the menu command: Show Guides
  5. In the Keyboard Shortcut field, type: ⌘; then click Add

You may need to restart Pages, but I was able to use this right away. The nice thing is that you can have the same keyboard command for both Show Guides, and Hide Guides. Follow the above steps again to add it. Here’s a screenshot showing the shortcuts, along with Zoom In and Zoom Out too!

pages-keyboard-shortcuts

Let me know in the comments if you’ve got some Pages shortcuts of your own!

The post Apple Pages hide / show guides keyboard shortcut appeared first on Spigot Design.

]]>
https://spigotdesign.com/apple-pages-hide-show-guides-keyboard-shortcut/feed/ 1 9401
How to leave an organization in Asana https://spigotdesign.com/leave-organization-asana/ https://spigotdesign.com/leave-organization-asana/#respond Tue, 15 Nov 2016 16:50:56 +0000 https://spigotdesign.com/?p=9405 We love Asana here at Spigot, if it wasn’t obvious enough. When we work with clients that also use Asana, it’s very easy to pair the two by joining their...

The post How to leave an organization in Asana appeared first on Spigot Design.

]]>
We love Asana here at Spigot, if it wasn’t obvious enough. When we work with clients that also use Asana, it’s very easy to pair the two by joining their organization. Often times we’ll stay on beyond the project to help, but what happens when it’s time to leave?

I recently decided to clean my Asana house a bit and remove myself from some old client organizations that were no longer active. So I headed to the settings section in Asana expecting to find an easy ‘leave’ link. Nope… Checking the Asana documentation didn’t turn up much, and neither did a direct Google search. After some poking around, I found it, under the More tab. Remove me from this Organization.

Remove yourself from an Asana Organization

  1. Switch to the Organization you want to remove yourself from
  2. Hover over the More tab, click on Remove me from this Organization

remove-from-org-asana

The post How to leave an organization in Asana appeared first on Spigot Design.

]]>
https://spigotdesign.com/leave-organization-asana/feed/ 0 9405
Drift Fluid App Icons & Setup https://spigotdesign.com/drift-fluid-app-icons-setup/ https://spigotdesign.com/drift-fluid-app-icons-setup/#respond Tue, 01 Nov 2016 18:42:04 +0000 http://spigotdesign.com/?p=9172 I love using Fluid to run websites as an app, especially websites I need to keep open and active. Like Drift, our on-site chat app for Cinch. Setting up Drift...

The post Drift Fluid App Icons & Setup appeared first on Spigot Design.

]]>
I love using Fluid to run websites as an app, especially websites I need to keep open and active. Like Drift, our on-site chat app for Cinch.

Setting up Drift in Fluid was not as straight forward as most apps. While most work just fine adding in the web address, sometimes a Fluid app will redirect to the browser when you try an log in. This is usually due to issues with the whitelist setting, and was the case for Drift. They recently changed their site url from http://driftt.com to http://drift.com. Even though they changed it a while back, the redirect still happened. Here’s the Whitelist Prefs that worked for me:

*drift.com*
*driftt.com*
https://app.drift.com/dashboard

drift-fluid-whitelist-prefs

So as I’ve done in the past for other Fluid apps, here’s the icons I’m using for Drift:

PNG

drift-icon

SVG

drift-icon

The post Drift Fluid App Icons & Setup appeared first on Spigot Design.

]]>
https://spigotdesign.com/drift-fluid-app-icons-setup/feed/ 0 9172
Site Stats restored to the Jetpack submenu https://spigotdesign.com/site-stats-restored-jetpack-submenu/ https://spigotdesign.com/site-stats-restored-jetpack-submenu/#respond Mon, 17 Oct 2016 17:53:46 +0000 https://spigotdesign.com/?p=9373 Jetpack released a new React powered interface in version 4.3, released on September 8th of this year. They worked very hard on it for over a year and are clearly...

The post Site Stats restored to the Jetpack submenu appeared first on Spigot Design.

]]>
Jetpack released a new React powered interface in version 4.3, released on September 8th of this year. They worked very hard on it for over a year and are clearly very proud of it.

jetpack-fourpointthree

While I can agree that the interface looks nice and clean, there were a few things that I was disappointed with in this update:

  1. The new stats interface is severely lacking in the amount of data available in the dashboard compared to the old stats
  2. The old Site Stats are still available, but buried in a link from the Jetpack dashboard page. The submenu link to these stats was also removed
  3. The Dashboard is less useful than it was before, and appears to have become more of a marketing area for Jetpack
  4. I’m not partial to the width of the Dashboard. There is a ton of wasted space on my big monitor

It’s understandable for Automattic to push Jetpack’s paid plans and options, but I think they went just a little too overboard with it.

Site Stats restored

I’m not sure how it came about, or where the pressure came from, but the Jetpack team quietly put the Site Stats sumbenu back. Check out the changelog here. Note that adding the menu item back is labeled an Enhancement.

jetpack-4-3-2-changelog

The post Site Stats restored to the Jetpack submenu appeared first on Spigot Design.

]]>
https://spigotdesign.com/site-stats-restored-jetpack-submenu/feed/ 0 9373
From MAMP to Vagrant and back again https://spigotdesign.com/mamp-vagrant-back/ https://spigotdesign.com/mamp-vagrant-back/#respond Thu, 13 Oct 2016 16:42:26 +0000 https://spigotdesign.com/?p=9348 One of the most rewarding things about web development is that it’s always changing. New code specifications, design trends, device capabilities, programming languages, API integrations… Wait, did I say rewarding?...

The post From MAMP to Vagrant and back again appeared first on Spigot Design.

]]>
One of the most rewarding things about web development is that it’s always changing. New code specifications, design trends, device capabilities, programming languages, API integrations… Wait, did I say rewarding?

Yes, it can be overwhelming, but for me it is also rewarding. Especially learning new development tools. Like a lot of folks, a few years back I switched my local WordPress development environment from MAMP Pro to Vagrant / VVV. At the time it was the trendy thing to do, and still is I’d presume. Quite a few influential developers were making the switch. My Twitter feed was overflowing with Vagrant awesomeness and tutorials on how to set it up. After (quite a) few initial hiccups, I had a Vagrant environment up and running, with VVV to manage WordPress.

While the initial setup wasn’t as smooth they said it would be, I was very excited to be learning some new tricks, using the command line, and being part of, well, the cool developer crowd. Yes, Vagrant took a long time to launch every morning, and even longer to shut down at night. But hey, it’s the price of progress I thought.

Well, a few months ago I switched back to MAMP Pro. Here’s why.

Matching development and production environments

One of the most compelling arguments for switching to Vagrant is that it allows a developer to set up a virtual environment that matches exactly the final production server configurations. This sounds both reasonable and good. In practice, however, I don’t really need this. And I wasn’t actually using it either.

VVV is a Vagrant configuration specifically designed for WordPress and comes with a default configuration. It also comes with the ability to alter that configuration, but I never took the time to do so. Perhaps I should have, but every WordPress site I’ve built has worked fine no matter what production environment they ended up in. The differences between environments never actually crossed my mind, because it never seemed to actually matter. I still to this day don’t know if a site would run differently on PHP 5.5 vs 5.6. Or what exact version of MySQL. As long as the server is hitting the WordPress minimum requirements, maybe it doesn’t matter.

MAMP doesn’t allow for much configuration either, so perhaps this is a draw. But matching dev environments is the first reason on most Why Vagrant articles, and I just took it away. So, strike 1.

Getting up and running

While most tutorials on how to set up Vagrant / VVV show how clearly easy it is, my experience was anything but… I followed along installing the necessary components and ran my first Vagrant up – and nothing. Tore it all down and tried again – nothing. Tore down and tried a third time –  wha-la – I guess third times are a charm. I’m not sure what went wrong the first couple of tries. Perhaps I’m just an idiot. I’ll admit it was pretty exciting to type that first (successful) Vagrant up in Terminal and see a default WordPress site sitting there. I quickly added Variable VVV and a VVV Dashboard I was off and running with a shiny new development environment.

Too bad it took me heavy parts of multiple days to do so. MAMP is not perfect, and is certainly a PITA to update, but getting it up and running is as easy as 1. Launch the App. 2. Start server. 3. That’s it.

Keeping Vagrant running smoothly

If you talk to a developer who’s used Vagrant long enough, they’ll tell you a time or two they’ve screwed it up somehow. I certainly did that a bit in the beginning, without knowing what or why. Some mornings Vagrant simply wouldn’t load, or I’d get an SSH timeout error. Without knowing exactly what I was doing, I’d try reprovisioning, or halting and restarting, and sometimes re-installing the entire thing. The hours of lost time trying to troubleshoot were astounding, even for someone who loves to waste time troubleshooting. I should have been getting real work done.

I was finally able to get reliable, steady production out of Vagrant after getting a new 5K iMac and installing everything from scratch. There was clearly some configuration or setting on the old computer that was mucking up Vagrant. From then on Vagrant was thankfully very stable. So kudos to nearly two years of Vagrant smoothness. And also kudos to MAMP, because I’ve never screwed it up.

Vagrant performance

For the most part, the speed of Vagrant was okay. Not great but it didn’t suck either. Except for the days that it did. I still don’t know why, but every now and again page load speeds would just drop, making development nearly impossible. If you Google the keywords Vagrant slow you see the first article is titled How to make Vagrant performance not suck. I tried following along but that article is clearly a notch or two above my pay grade. Nothing I did seemed to change the performance on these days and I just ended up dealing with it.

Since Vagrant is a virtual machine, it can only use as much resources as you give it. And perhaps it’s my bad that I didn’t provision more, but what ever the default amount of RAM and CPU was given is what it uses. I may be mistaken, but MAMP might have the entire cadre of resources my machine has at its disposal. I’ll say that I’ve never run into a performance is

vagrant up / vagrant halt

The other speed issue has to do with getting going in the morning, and shutting down at night. I suspect the slow startup and shutdown procedures has to do with the number of sites I had added to the box (20 or so). vagrant halt normally takes 4-5 minutes to run. I shut down every day, and never liked turning off the computer without first shutting down Vagrant. Maybe it doesn’t matter, but on the days I was running out late those 4 minutes seem like forever. MAMP shuts down with ⌘-q

My a-ha moment

I’d still be using my Vagrant development environment today if I hadn’t attended WordCamp SLC this year. Chris Reynolds of WebDev Studios gave a talk titled Building WordPress for Enterprise Clients (or How I Learned to Stop Worrying and Deal With My Imposter Syndrome). Amongst a ton of great information about how he goes about his work, he lightly mentioned how he’d gone back to using MAMP Pro again for development. He summed it up with the following slide:

building-wordpress-for-enterprise-clients-or-how-i-learned-to-stop-worrying-and-deal-with-my-imposter-syndrome-23-638
No on ever complains about blowing up their MAMP install.

I don’t know Greg Rickaby but I could see the wisdom in his words. I went to work the next day and dusted off my old copy of MAMP. Then upgraded to Version 5.

Conclusion

In the end, I’m glad I learned how to use Vagrant. It served me well for over two years. Yes it has it’s issues and took up too much of my time. Yes it’s still cool and yes it’s still fun to run vagrant up. Is MAMP perfect? No. I really (really) wish they’d figure out how to upgrade the app with single click. But it fires up quickly, is reliable, and performs really well.

But maybe I should be looking at Docker.

The post From MAMP to Vagrant and back again appeared first on Spigot Design.

]]>
https://spigotdesign.com/mamp-vagrant-back/feed/ 0 9348
Tweetbot filter search bug https://spigotdesign.com/tweetbot-filter-search-bug/ https://spigotdesign.com/tweetbot-filter-search-bug/#respond Mon, 10 Oct 2016 22:33:19 +0000 https://spigotdesign.com/?p=9338 I’ve been using Tweetbot for a few years now and it’s still my go to Twitter app on the Mac as well as iOS. I’ve noticed the following issue for...

The post Tweetbot filter search bug appeared first on Spigot Design.

]]>
I’ve been using Tweetbot for a few years now and it’s still my go to Twitter app on the Mac as well as iOS. I’ve noticed the following issue for a while now but only recently started to look into it. Here’s a quick screen recording of what I’ve been experiencing:

Basically, the filter search bar at the top sometimes can take over the entire top section of the timeline (or mentions) section, and there is no apparent way of getting rid of it. Here are the steps to replicate:

  1. In Tweetbot, click on the timeline search icon at the top
  2. Don’t click into the field that pops up, but anywhere else, like on a message below
  3. The Search field text will center itself, but you won’t be able to make the field active
  4. This is where I get stuck. There is no obvious way to close out of the field.

The Workaround

Here’s the two ways I’ve gone about resetting the app, the first should be obvious:

  1. Restart Tweetbot
  2. Activate another account, then switch back to the original account

I’ve sent Tapbots a note about this, I’ll update the post if I hear anything from them.

10/11/16 Update: Tapbots got back to me with this:

The post Tweetbot filter search bug appeared first on Spigot Design.

]]>
https://spigotdesign.com/tweetbot-filter-search-bug/feed/ 0 9338
Get the Featured Image of a parent page in WordPress https://spigotdesign.com/get-featured-image-parent-page-wordpress/ https://spigotdesign.com/get-featured-image-parent-page-wordpress/#respond Fri, 07 Oct 2016 21:18:20 +0000 http://spigotdesign.com/?p=8074 When you’re building a number of pages in WordPress that are closely tied to a main, or parent page, tying them together with imagery can help the user know where...

The post Get the Featured Image of a parent page in WordPress appeared first on Spigot Design.

]]>
When you’re building a number of pages in WordPress that are closely tied to a main, or parent page, tying them together with imagery can help the user know where they are.

This snippet is from the same book project as this snippet that gets the title of the parent page. It allows us to show the same header image on all subsequent chapters of a book (child pages)>

The snippet

srcset for the responsive

The beauty of this snippet is that it uses WordPress’ built in responsive image support, introduced in WordPress 4.4. This allows a browser to use the best sized image available using the srcset attribute, potentially saving bandwidth and speeding up page load times in the process.

Put it in a template file

This code is meant to be placed anywhere in a template file that you’d need to display the Featured Image of a parent page.

The post Get the Featured Image of a parent page in WordPress appeared first on Spigot Design.

]]>
https://spigotdesign.com/get-featured-image-parent-page-wordpress/feed/ 0 8074
Get the title of the parent page; If no parent, show this page’s title https://spigotdesign.com/get-title-parent-page-no-parent-show-pages-title/ https://spigotdesign.com/get-title-parent-page-no-parent-show-pages-title/#comments Wed, 01 Jun 2016 18:54:51 +0000 http://spigotdesign.com/?p=8069 This snippet is from a book project – the book title needed to be shown on all subsequent chapters, unless it was the main book page. Here’s the snippet that...

The post Get the title of the parent page; If no parent, show this page’s title appeared first on Spigot Design.

]]>
This snippet is from a book project – the book title needed to be shown on all subsequent chapters, unless it was the main book page. Here’s the snippet that does it:

The post Get the title of the parent page; If no parent, show this page’s title appeared first on Spigot Design.

]]>
https://spigotdesign.com/get-title-parent-page-no-parent-show-pages-title/feed/ 1 8069
Screen size indicator returns in Chrome 50 https://spigotdesign.com/screen-size-indicator-returns-chrome-50/ https://spigotdesign.com/screen-size-indicator-returns-chrome-50/#respond Thu, 28 Apr 2016 19:50:45 +0000 http://spigotdesign.com/?p=8054 Chrome 49 removed a minor feature that I used quite a bit – the screen size indicator that would appear when resizing the window while in web inspector. Many workarounds...

The post Screen size indicator returns in Chrome 50 appeared first on Spigot Design.

]]>
Chrome 49 removed a minor feature that I used quite a bit – the screen size indicator that would appear when resizing the window while in web inspector. Many workarounds were suggested on this Stackexchange thread, but nothing quite replaced the original.

Well good news, the feature has made it’s way back in Chrome 50. Whew.

chrome-screen-size-indicator

The post Screen size indicator returns in Chrome 50 appeared first on Spigot Design.

]]>
https://spigotdesign.com/screen-size-indicator-returns-chrome-50/feed/ 0 8680
New Asana logo for Fluid app https://spigotdesign.com/new-asana-logo-for-fluid-app/ https://spigotdesign.com/new-asana-logo-for-fluid-app/#comments Tue, 06 Oct 2015 15:59:35 +0000 http://spigotdesign.com/?p=7984 Asana pushed a redesigned branding last week, updating their logo, website and web app. They nailed it in my opinion. It’s clean and fresh and the web app is even easier...

The post New Asana logo for Fluid app appeared first on Spigot Design.

]]>
Asana pushed a redesigned branding last week, updating their logo, website and web app. They nailed it in my opinion. It’s clean and fresh and the web app is even easier to use.

I connect to Asana via a Fluid app so it was time to update the Asana and Instagantt icons I’d previously released.

These aren’t perfect (I spent less than 5 minutes on the gradients), and I clearly took liberties with the Instagantt icon… AND I’ll assume someone on Dribbble will make something better… but at least now my dock isn’t sporting the old Asana logo.

new-asana-logo-fluidinstagantt-new-fluid

Make em better

For those who want to perfect the gradient profiles, here’s a zip that includes a Sketch working file: asana-instagantt.zip.

Let me know what you think.

The post New Asana logo for Fluid app appeared first on Spigot Design.

]]>
https://spigotdesign.com/new-asana-logo-for-fluid-app/feed/ 1 7984
OS X El Capitan: The Ars Technica Review https://spigotdesign.com/os-x-el-capitan-the-ars-technica-review/ https://spigotdesign.com/os-x-el-capitan-the-ars-technica-review/#respond Tue, 29 Sep 2015 18:11:15 +0000 http://spigotdesign.com/?p=7974 When ever a new version of OS X is released, Ars Technica puts out as thorough a review as anyone. This release is no different: OS X 10.11 El Capitan:...

The post OS X El Capitan: The Ars Technica Review appeared first on Spigot Design.

]]>
When ever a new version of OS X is released, Ars Technica puts out as thorough a review as anyone. This release is no different: OS X 10.11 El Capitan: The Ars Technica Review

A few highlights:

  • New system font: San Francisco
  • Improved Mission Control.
  • System Integrity Protection. Means apps like TotalFinder won’t work without a tweak. Bummer.
  • Responsive Design mode in Safari. Cool for us developers!

So do they recommend you upgrade? Most certainly, but this quote sums up the differences between El Capitan and Yosemite:

Almost all of El Capitan’s updates are aimed at detail-oriented power users who are intimately familiar with the platform and its apps.

The post OS X El Capitan: The Ars Technica Review appeared first on Spigot Design.

]]>
https://spigotdesign.com/os-x-el-capitan-the-ars-technica-review/feed/ 0 7974
Custom credit card icons for WooCommerce https://spigotdesign.com/custom-credit-card-icons-for-woocommerce/ https://spigotdesign.com/custom-credit-card-icons-for-woocommerce/#comments Thu, 24 Sep 2015 16:01:44 +0000 http://spigotdesign.com/?p=7960 WooCommerce comes with a default set of credit card icons that look like this: If you like ‘good enough’ then these will do you just fine. But if look close,...

The post Custom credit card icons for WooCommerce appeared first on Spigot Design.

]]>
WooCommerce comes with a default set of credit card icons that look like this:

default-woocommerce-credit-card-icons

If you like ‘good enough’ then these will do you just fine. But if look close, these a probably a bit blurry, especially on a high-resolution screen. They are feel a bit dated to me – curved buttons shapes with faux drop shadows. Again, they are not bad but may not fit the flatter style we’re currently wrapped in.

So let’s change them out with icons that are more modern in look, and let’s use SVG icons for perfect resolution on any screen.

I found this set from Dribbble: https://dribbble.com/shots/1115380-SVG-Credit-Cards. We’re using Stripe and these contained all the icons we needed. Check around for more if your payment gateway includes different companies.

The code

Just note that we are using Stripe, so the code below is based on the WooCommerce Stripe Gateway extension. Which ever gateway you’re using should follow the same pattern however, you may just need to adjust which credit cards you need to show.

We’ll be filtering the WooCommerce function, which is most likely available in each gateway extension: woocommerce_gateway_icon

In functions.php or a custom functions plugin, add this:

This code will replace the icon list generated in the extension. This assumes your images are in the img/build/svg/ directory within your theme.

The icons

Split the icons out into individual .svg files and save them in your theme. One thing to remember is that when saving these in Illustrator be sure to constrain the artboard to the size of the artwork. But this isn’t a post about working with SVG’s… if you need more info css-tricks.com has a good list of articles on the subject: http://spig.io/3C0o112F1N2x

The results

Before:
default-woocommerce-cc-icons

Better:
better-woocommerce-credit-card-icons

The post Custom credit card icons for WooCommerce appeared first on Spigot Design.

]]>
https://spigotdesign.com/custom-credit-card-icons-for-woocommerce/feed/ 10 7960
Introducing: Cinch Security and Maintenance https://spigotdesign.com/introducing-cinch-security-and-maintenance/ https://spigotdesign.com/introducing-cinch-security-and-maintenance/#respond Wed, 23 Sep 2015 22:01:34 +0000 http://spigotdesign.com/?p=7947 We’ve been running Cinch Hosting for nearly a decade now. We’ve also been quietly running a web maintenance and security service through Spigot. Well, now they are joined into Cinch Web...

The post Introducing: Cinch Security and Maintenance appeared first on Spigot Design.

]]>
We’ve been running Cinch Hosting for nearly a decade now. We’ve also been quietly running a web maintenance and security service through Spigot. Well, now they are joined into Cinch Web Services. We’re offering security and maintenance for WordPress based websites at a reasonable cost.

Here’s a rundown of the services:

These services are open to all, and come in a few different plans depending on your needs. We still continue to only host websites for clients we develop for, but the rest are open season for all.

We’re really proud to be able to offer the service – maintaining a website is an important responsibility for all site owners and this is a good way to stay on top of it without having to know all the ins and outs of website security.

Check out our plans here: https://cinchws.com/plans

The post Introducing: Cinch Security and Maintenance appeared first on Spigot Design.

]]>
https://spigotdesign.com/introducing-cinch-security-and-maintenance/feed/ 0 7947
The Double Opt In Email Introduction https://spigotdesign.com/the-double-opt-in-email-introduction/ https://spigotdesign.com/the-double-opt-in-email-introduction/#comments Thu, 23 Jul 2015 16:25:21 +0000 http://spigotdesign.com/?p=7888 Since I’ve been somewhat opinionated in the past regarding email etiquette, a recent post by Anand Sanwal at Quartz got me nodding my head. You’re probably doing email introductions wrong...

The post The Double Opt In Email Introduction appeared first on Spigot Design.

]]>
Since I’ve been somewhat opinionated in the past regarding email etiquette, a recent post by Anand Sanwal at Quartz got me nodding my head.

You’re probably doing email introductions wrong

Anand describes the situation where one person is introducing two others by way of email – and the right and wrong way to do it.

Here’s the wrong way:

Hey Mary,
Wanted to introduce you to Jack (cc’d) who runs Gruber.com an “Uber for granite countertops”. They’re killing it and are really disrupting the granite space. They’re also making the world a better place.
Think you guys are doing similar things, tackling similar problems, etc. so you should chat.
I’ll leave it to you to connect.
Hope all is well.
Best,
Joe

And the ‘double opt-in’ right way:

Mary,
My friend Jack runs Gruber.com, an Uber for granite countertops. They are doing things with data visualizations in d3.js which are pretty amazing.
Given all that your company is doing with d3.js, I thought connecting you might be useful so you can talk shop. In addition, Jack has found a really good way to source talented d3.js developers and I know this was a pain point for you.
He’d love to chat with you about your content marketing success and how he might apply it to the granite countertop industry.
Let me know if an introduction via email would be useful, and I’ll make that happen. If not or just too busy, no worries.
We should catch up soon.
Best,
Joe

The solution boils down to this: Don’t be lazy; Respect the time of your friends and colleagues; Take the time to do a bit of the legwork.

I love these kinds of tips. They’re not always immediately obvious, but make total sense when you think about it.

Read the original article here: You’re probably doing email introductions wrong

The post The Double Opt In Email Introduction appeared first on Spigot Design.

]]>
https://spigotdesign.com/the-double-opt-in-email-introduction/feed/ 1 7888
WordPress Admin Bar break points https://spigotdesign.com/wordpress-admin-bar-break-points/ https://spigotdesign.com/wordpress-admin-bar-break-points/#respond Tue, 21 Apr 2015 17:58:04 +0000 http://spigotdesign.com/?p=7837 If you’re building a responsive site with a fixed header, you may have run into troubles with content below the header fitting correctly, depending on what screen size your viewing...

The post WordPress Admin Bar break points appeared first on Spigot Design.

]]>
If you’re building a responsive site with a fixed header, you may have run into troubles with content below the header fitting correctly, depending on what screen size your viewing at here’s a quick rundown of the breakpoints that WordPress currently (4.1.2) uses:

1. 0 – 600px

Position: Absolute, 46px height. This bar scrolls up as you swipe/scroll. Content below need to be adjusted down. Since WordPress uses a max-width media query, this style also takes on, but overrides the following two break points.

Here’s their CSS:

media screen and (max-width: 600px)
#wpadminbar {
  position: absolute;
}

2. 601 – 783px

Position: Fixed; 46px height. The bar now becomes fixed to the top of the window, at a height of 46px. You will also need to adjust content below, but if you’re using a min-width, styles from the previous break point should cover you. Again, as WP used max-width, the following point will be included in this width range.

Here’s their CSS:

@media screen and (max-width: 782px)
html #wpadminbar {
  height: 46px;
  min-width: 300px;
}

3. 784px an up

Position: Fixed; 32px height. This is the main desktop version of the admin bar. Fixed again, but at 32px. You’ll most likely need to adjust content below accordingly. Here’s their styles:

#wpadminbar {
  direction: ltr;
  color: #CCC;
  font: 400 13px/32px "Open Sans",sans-serif;
  height: 32px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 600px;
  z-index: 99999;
  background: #222;
}

How to target these break points

When a user is logged in and the admin bar is present, you’ll find a body class that you can hook if your theme is coded correctly. I’d bet it works even with a crappy theme though…

Here’s a code example, written in Sass on how I go about it:

.site-header {
    width: 100%;
    padding: 0;
    
    .admin-bar & {
        top: 46px;

        @include mq(783) {
            top: 32px;
        }
        
    }
    @include mq(600) {
        position: fixed;
        top: 0;
    }
}

I use a Sass mixin to compile the media queries into a min-width. The above code will output this:

.site-header {
  width: 100%;
  padding: 0;
}

.admin-bar .site-header {
  top: 46px;
}

@media (min-width: 48.9375em) {
  .admin-bar .site-header {
    top: 32px;
  }
}

@media (min-width: 37.5em) {
  .site-header {
    position: fixed;
    top: 0;
  }
}

This code will keep my .site-header positioned normally until 37.5em, or 600px, at which it will turn fixed and rest at the top, unless a user is logged in, where it will bump down 46px. Then bump back up to 32px at 48.9375em or 783px. If you’re wondering, I’m calculating em’s at a base of 16px.

Also, don’t forget to set styles for non-logged in users!

The post WordPress Admin Bar break points appeared first on Spigot Design.

]]>
https://spigotdesign.com/wordpress-admin-bar-break-points/feed/ 0 7837
Hide xScope floating toolbar https://spigotdesign.com/hide-xscope-floating-toolbar/ https://spigotdesign.com/hide-xscope-floating-toolbar/#respond Thu, 16 Apr 2015 14:47:23 +0000 http://spigotdesign.com/?p=7826 I’ve had this floating xScope toolbar on my desktop for a few weeks, getting in the way. I use the xScope from the OS X menu bar so it’s been...

The post Hide xScope floating toolbar appeared first on Spigot Design.

]]>
I’ve had this floating xScope toolbar on my desktop for a few weeks, getting in the way. I use the xScope from the OS X menu bar so it’s been pretty annoying having to move it.

To remove it I checked the preferences, but there’s nothing there. Turns out it’s pretty easy once you find it:

Window > Toolbar. Voilà. You can also keyboard it with Command-T (⌘-T)

The post Hide xScope floating toolbar appeared first on Spigot Design.

]]>
https://spigotdesign.com/hide-xscope-floating-toolbar/feed/ 0 7826
Save notes to Evernote from Sublime Text https://spigotdesign.com/save-notes-to-evernote-from-sublime-text/ https://spigotdesign.com/save-notes-to-evernote-from-sublime-text/#comments Wed, 15 Apr 2015 23:47:42 +0000 http://spigotdesign.com/?p=7818 For a few years now I’ve used Snippets for keeping track of code snippets. It’s been a fine app, but recently has become slow, looks funny on Yosemite, and I...

The post Save notes to Evernote from Sublime Text appeared first on Spigot Design.

]]>
For a few years now I’ve used Snippets for keeping track of code snippets. It’s been a fine app, but recently has become slow, looks funny on Yosemite, and I get the feeling it’s become vaporware.

Since I use Evernote for keeping track of lots of things, both business and personal, I thought I’d look into using it for code snips. It’s easy enough to create a Snippets notebook, and notes for each bit of code – but retaining syntax highlighting and formatting doesn’t seem possible in Evernote. The first bit of javascript I tried to add pasted in as one long line, unformatted and unreadable. Bummer.

Enter bordaigorl/sublime-evernote.

I use Sublime Text everyday, this little package allows saving, opening, and updating notes to and from Evernote right from Sublime. Thus far I’ve tried two snippets, a .js and a .php script. The php file came in okay – no syntax highlighting but the line breaks and tabs were intact. The .js file saved as it had before. No highlighting, no line breaks/tabs.

I’ll update this post as I figure out how to get the highlighting perfected. At the very least it’s nice to leave an outdated app behind.

Update: Okay that didn’t take long… the way to get syntax highlighting and formatting to work is to use Markdown… Here’s an example with the proper Markdown to get it working with javascript:

```javascript
$(document).ready(function() {
    $('.hover').bind('touchstart touchend', function(e) {
        e.preventDefault();
        $(this).toggleClass('hover_effect');
    });
});
```

And here’s a quick reference for Markdown if you need it: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet

The post Save notes to Evernote from Sublime Text appeared first on Spigot Design.

]]>
https://spigotdesign.com/save-notes-to-evernote-from-sublime-text/feed/ 3 7818
Admitted WOT Fanantic https://spigotdesign.com/admitted-wot-fan/ https://spigotdesign.com/admitted-wot-fan/#respond Wed, 01 Apr 2015 02:38:54 +0000 http://spigotdesign.com/?p=7802 I don’t play as many games as I used to, for all the same reasons you don’t anymore either. But World of Tanks has caught my son and I and...

The post Admitted WOT Fanantic appeared first on Spigot Design.

]]>
world-of-tanks-logo

I don’t play as many games as I used to, for all the same reasons you don’t anymore either. But World of Tanks has caught my son and I and it’s been a blast.

We started out with the iOS version (WOT Blitz), and have recently discovered that there’s a World of Tanks port to Mac OS X. I’d still consider us both noobs, but we’re low level so hopefully there aren’t too many players irritated with our team tactics.

Tory loves the game because he’s a kid and has all the time in the world to love such a game (after homework of course). The reason I love playing? The same reasons Mike Foster loves playing.

We’ve yet to join a platoon. Let me know if I can be of use: spigotdesign

 

The post Admitted WOT Fanantic appeared first on Spigot Design.

]]>
https://spigotdesign.com/admitted-wot-fan/feed/ 0 7802
Using ‘admin’ as a username is not awesome https://spigotdesign.com/admin-as-username-bad/ https://spigotdesign.com/admin-as-username-bad/#respond Tue, 31 Mar 2015 23:42:21 +0000 http://spigotdesign.com/?p=7791 WordPress stopped auto filling in the ‘admin’ username on install a while ago in version 3.7, but that doesn’t mean someone can’t fill it in that way themselves. Here’s a...

The post Using ‘admin’ as a username is not awesome appeared first on Spigot Design.

]]>
WordPress stopped auto filling in the ‘admin’ username on install a while ago in version 3.7, but that doesn’t mean someone can’t fill it in that way themselves. Here’s a screenshot that shows why this is a bad idea:

bruteforce-admin-wp

 

I get these bruteforce notifications multiple times a day. Here’s a few other usernames they like to try:

  • demo
  • adm
  • toor
  • user

toor? What the heck is that?

The post Using ‘admin’ as a username is not awesome appeared first on Spigot Design.

]]>
https://spigotdesign.com/admin-as-username-bad/feed/ 0 7791
Updating SEO Yoast through MainWP breaks permalinks https://spigotdesign.com/updating-seo-yoast-through-mainwp-breaks-permalinks/ https://spigotdesign.com/updating-seo-yoast-through-mainwp-breaks-permalinks/#comments Mon, 30 Mar 2015 21:51:28 +0000 http://spigotdesign.com/?p=7781 April 10 Update: MainWP Support found the issue. Apparently there was conflict between the way MainWP handles updates and the way WordPress SEO by Yoast updates when custom post types...

The post Updating SEO Yoast through MainWP breaks permalinks appeared first on Spigot Design.

]]>
April 10 Update: MainWP Support found the issue. Apparently there was conflict between the way MainWP handles updates and the way WordPress SEO by Yoast updates when custom post types were involved. The latest version of both the MainWP Dashboard (2.0.10) and MainWP Child (2.0.10) adds additional checks for these types of updates.

April 1 Update: Turns out the steps below don’t actually fix it. The Yoast SEO plugin update today broke a couple of sites yet again. MainWP Support is looking into the issue, I’ll report back when something new arises.

We use MainWP to manage a few clients websites – keep the sites backed up and updated (among other things). Recently we’ve had issues with certain sites Custom Post Type permalinks breaking, resulting in 404 pages on the single page view. Visiting the permalinks page in WordPress would instantly fix it, but clients generally don’t like it when their site is periodically broken.

It took a bit of troubleshooting to find the culprit, but it turned out to be related to two things:

  1. Updating Yoast SEO plugin
  2. Updating the plugin remotely, through MainWP. Updating Yoast SEO through the WP update page did not break the permalinks.

I was able to reproduce the issue with the following steps on a broken site:

  1. Deactivate the (now updated) Yoast SEO plugin
  2. Replace the updated plugin with an older version via FTP
  3. Reactivate plugin
  4. Update plugin via MainWP Dashboard
  5. Permalinks broken

After a bit of trial and error we were able to fix this issue following these steps:

  1. Fix permalink issue by visiting permalinks page in WP
  2. Leave Yoast  plugin active
  3. Delete now updated version of plugin via FTP, including directory folder
  4. Upload older version via FTP
  5. Updat to new version via MainWP
  6. Permalinks NOT broken – Yay!

The reason I went through the trouble to delete the plugin and upload an older version through FTP was to test that the remote update no longer broke the permalinks. It’s entirely possible that simply deleting and re-uploading would fix the issue.

What went wrong?

It’s very hard to say really. I won’t blame either MainWP or Yoast for this. It happened to only a couple of websites and not all that we manage – and nearly everyone has Yoast installed. My guess is there were legacy files in the older versions of Yoast that were not necessary. The only reason I say this is because deleting the plugin via FTP resulted in a few file-not-found errors. Refreshing the directories revealed all files and then could be deleted.

I checked with MainWP support and they haven’t had anyone else report this issue. And I know better than to put in a support request with Yoast.

Has anyone else experienced this issue?

The post Updating SEO Yoast through MainWP breaks permalinks appeared first on Spigot Design.

]]>
https://spigotdesign.com/updating-seo-yoast-through-mainwp-breaks-permalinks/feed/ 3 7781