Half-Elf on Tech

Thoughts From a Professional Lesbian

Tag: wordpress

  • SEO Slides Is A Pie

    SEO Slides Is A Pie

    This review is of the FREE version during the beta release!

    I wanted to love you. All my friends rave about you and tease me for using PowerPoint. “Don’t you want to own your data!” they harangue me. And it’s true, I do! So the idea of having my slides on my server, embedable into posts? Hey that sounds great!

    The cake, is, alas, a pie.

    It’s not really a ‘lie’, but there are points that I just don’t love like they do. This is not to say I don’t like it, in fact I am happily using it, and I’m going to keep using it, and for a lot of people, this will be perfect to make slides. It’s not (quite) perfect for me, but that’s because of my current usage. I can see the future of slides and WordPress, and it really is going to be SEO Slides for many (if not all) of us.

    seoslidesBefore I get deep into this, you have to register to import PDFs. This is perfectly fair and understandable. They’re converting a PDF into images on their server and importing. Okay, I’m jiggy with that. I could conceivably make the images myself, but this is fine. The problem, or rather the part I don’t like, is that they really all just images. And they’re named things like c6ddd0b82e5a45c70fb2718869cad3e1-7. So once I import, I have to go back and change all the titles and (if I want) copy in my notes.

    So why not just write it in SEO Slides? Because of Presenter View.

    Say what you want about PowerPoint, but the fact that I get a presenter view, filled with my notes, is actually very important to me. I make notes, as you may have noticed reading my post from WordCamp Portland, 2013. Sometimes they’re exactly what I’m going to say, sometimes they’re slightly different bullet points than my slide has. Sometimes I have NO bullet points on the slide, so they’re all in the text. I really try to use that aspect of Power Point. I don’t really script my talks to 100% detail, but I treat those notes as flashcards to keep me on topic and on pace. They even will have time notations.

    As a presenter, keeping to my time limit and topic is important to me. Since I do give similar talks a lot (example: I used ‘A Tale of Two Servers’ to talk about Managed WP hosting in Boston, but I also have a Degrassi themed one called ‘Whatever it Takes’), the notes are often the same, but the pacing will be different. I try to cater to my audience. For now, this is the absolute number one reason I’m sad-panda about the plugin. But if that’s not your thing? You have no worries!

    The important factor to me is embed-ability. I have to be able to embed my content on a page. I use that page with a custom shortlink and put it in my slidedeck. Now with SEO Slides, I can just use the page, but it doesn’t let me put text or notes around it, so I’ll still want this to be embedded. Problem? Embedding with SEO Slides is not as obvious as you’d think. I read the Embedding FAQ and this just did not happen for me:

    When you “Publish” your presentation, you will be provided a link to “Use presentation in a new post.” This option will embed your presentation directly into a new blog post.

    I thought I was doing something wrong, but finally I realized the ONLY way to get this “Use in presentation” link was to save the post once published. Gah. Why not a nice button? Still, this was not insurmountable, and in the end, I really did like the look of the embed way better than the Slideshare one.

    Except … I’m not really thrilled with having to upload all my media. It makes me want to make a dedicated SEO Slides site on my network so I can isolate content. Part of the issue is with how I like to write my slides. I know for a WordCamp where I speak for 45 minutes, in order to leave room for questions, I should have no more than 30 slides, and that’s only if I’m doing roughly a slide a minute! I try to keep it closer to 20-25 honestly. A 45 minute talk should have at least 5 minutes for questions. I like to keep the text on my slides minimal, so I have a lot more to actually talk about.

    I hate slides that are pretty much what the person reads off… thanks. And that’s really a totally personal thing, but it means my slides are really image heavy. So that adds a lot of weight to a site. It’s not a plus or minus, just something I have to consider.

    The other problem with embeds is the embed CODE. You get a lot of parameters but the ones that jump out at me is this:

    site_src="http://slides.ipstenu.org/site_title="Slideshows"
    

    It looks cool, and I can change the site_src and site_title…. What I can’t do is change the output. I mean, I can’t remove that ‘source and title’ at all. I can’t change the default so it’s always ‘halfelf.org’ instead of my placeholder site. And worse? I can’t turn it OFF so other people can’t embed my stuff. I mean, what if I don’t want them to embed my warez? This means if someone looks at my slides, clicks the slick plus-sign, they get the code for embedding and they get my slides.ipstenu.org link. Now if you go there, you get redirected, but that’s not the point! Why have this customizable if I can’t… customize it? There are no settings options save entering my API key and allowing for tracking (which I turned off). Why not have an option for customizing output!

    A final minor note with SEO Slides, the title is also wonky. This may be because I’m running Trunk but I get this weird title thing in my … well … title:

    titlewonk

    Not really super happy about that. I did report it though. Also I reported that I ‘ran out’ of uploads of PDFs. In the free version, you get three free PDF conversions. I did it once. I tried a second time and it said “Upload Error: Your subscription has exhausted the use of this service.” So I filed tickets for both of those on November 14th.

    On the good side? These guys are WAY responsive to my enquiry about something (which they changed promptly), and helpful when I said “DaFUQ?” about embedding.

    I’m not sure if I want to use it going on. I may end up using it for embedding, though, but it won’t be a replacement for PowerPoint for me any time soon. Now I just have to decide if I want to pony up the $200 a year just to convert my PDFs. There are enough ‘little’ things missing that frustrate me, like no quick-edit if you just want to change titles, no categories, no tags, no main ‘slides’ page (that is – the custom post type has no archive page).

    Of note! Since this initial review was written, but before it was posted, SEO Slides upgraded me, so I’ll have to come back and re-review once I bang on the Premium Version: Is it worth it? Since, clearly, the brunt of why I’m ‘meh’ about this is the presenter mode, I may fall in love with Premium! The software’s only been out for two months at the time I wrote this, there’s a LOT of room for growth and I’m probably just being really really impatient.

    As this moves from Beta to Live, I expect a lot of great things from SEO Slides. Do I love them? Not yet. But I like them a hell of a lot more than I like PowerPoint, with that sole exception. The presenter view. God help ’em, no idea how you’d tackle that! Can’t wait to see how they do it.

  • No More PHP Code (In Widgets)

    No More PHP Code (In Widgets)

    I consider Otto one of my friends. He’s a guy I don’t mind hanging out with in a bar for hours. His code advice (and debugging advice) has furthered my career. He’s also one of the more realistic folks out there when it comes to work/life balance. Enjoy your beers, bro. So you can guess my surprise when, a couple years ago, he lamented to me about his plugin, PHP Code Widget, and how he wished everyone would quit using it. “I use it.” I replied, and earned an Otto-Grumpy Cat glare. “Don’t.”

    25508154Further conversations illuminated the situation. The code works, but it’s not great since people can use it to insert anything PHPish. Sure, in the wrong hands that is hella dangerous. I was about to broadly declare “I’m not the wrong hands!” when I thought back on everything I do, and where I do it, and I sheepishly replied, “I guess I’m just lazy.”

    And that’s the crux. I am lazy, and I looked for the easier way to include a PHP file in my widget areas. I was using it to show ads (the ones you see all over this site) via include("/home/foo/public_html/blah.php");. Why? Because I use the same ads on multiple places. But that’s it for my PHP usage. Which means for me, replacing it with anything else is super easy!

    Shortcodes

    They work in widgets, so hey! I knew I just needed to include a specific PHP file from a specific location, so for me, this was pretty simple. Also it meant I could call a do_shortcode in other places in my theme functions to add it in.

    // My Ads [myads name="name"]
    function myads_func( $atts ) {
            extract( shortcode_atts( array(
                    'name' => 'placeholder',
            ), $atts ) );
    
            $filename = '/home/foo/public_html/ads/'.$name.'.php';
    
            if ( !file_exists($filename) ) { return '<!-- Ad would go here, but you messed up! '.$filename.' not found -->'; }
    
            ob_start();
            include($filename);
            $content = ob_get_clean();
            return '<div id="'.$name.'">'.$content.'</div>';
            }
    
    add_shortcode( 'myads', 'myads_func' );
    

    I put in the little fail check to be hidden, so I would know where to look. This obviously works well for me since I’m pretty limited in how I was using Otto’s code. Before this, though, I was also using it for some BuddyPress sidebar trickery which could not be done (easily) with shortcodes, and really nor should it be, so that brings us to number two…

    Make Your Own Widget

    phpcode-287392Widget code is … weird. It’s not as easy as a function, and it’s way the heck larger than shortcode code, for many things. But you should remember that better or worse is subjective, I know, but for me it wasn’t worth the time to do it. It takes me way longer to master widget code, which I can’t use everywhere (in post content, in footers etc). But Otto’s general advice has been to make a widget.

    It’s also probably way safer than doing an include like I am, but when I started needing the shortcode all over the place, that’s what it was.

  • Don’t Fear The Auto Update

    Don’t Fear The Auto Update

    I was not surprised to see the backlash to Auto Updates. We spent a lot of time trying to figure out how to explain to people that while you can disable it, we really, really, really, really, don’t want you to, and basically ended up with a Codex page that explained how to configure it and then Nacin’s followup post that is, indeed, the definitive guide to disabling updates. But people hate it or love it, and there’s no middle ground. This was, as I implied, somewhat expected.

    No auto-updates makes me sadReasons why people hate it have varied from “I want to control my own updates!” to “This 3.7 upgrade broke something, so clearly you’re not ready!” Oh and don’t forget “You suck, I hate this! Why would you default this to on!?”

    I want to stress one really important thing here. The automatic background updates for WordPress are for minor updates only. We’re not talking about auto-upgrading people from 3.7 to 3.8, but just 3.7 to 3.7.1 – These are small, minor, updates. When someone comes to me and complains that major releases don’t always work, I have actually said, “So? We’re not talking about major releases.” And of course, “You are making good backups on these super important websites, right? Right?”

    It’s really easy to get bogged down with all the variable permutations about what updates could include and forget that WordPress started out simple. Yes, it’s defaulted to “on” because after intensive testing, and careful thought, WordPress core devs are pretty darn sure that these minor updates, which are more often than not security related, will not break a site. I’ll get back to breaking sites in a second. The point is that minor updates were picked specifically because it’s known that major upgrades can often break things.

    Why is it defaulted to on? This is my reasoning here… Because the people who wouldn’t turn it on are the people who need it most. If they don’t know it can be turned on, they won’t do it. And they need it. The people who don’t read all the nerdy things are the ones who are still running WordPress 3.4 (no I’m not kidding). I spend a lot of time debugging WP without ever seeing or really ever looking at their site. I know a lot of users don’t upgrade because of laziness, or fear, so I want to address this (see? told you I’d get back to breaking sites).

    Don’t fear updates

    Don't Fear The ReaperI said this on Twitter: If your site breaks every time you update WordPress, it’s time for a theme and plugin audit.

    So what’s an audit? How does one audit?

    It’s really simple. I have a longer presentation I give on this, but let’s go over how simple and basic this is.

    Who is the author?

    This is really obvious. With one exception, every plugin I use that’s made by core developers is updated to fix problems right away. It’s tested on versions of WordPress in the Beta stage, or even on trunk. It’s reliable because the author is reliable. Using a plugin by Mark Jaquith? No fear!

    How active is the author?

    Sometimes even I have no idea who that author is, so I look them up. And I want to see how active they are in WordPress. If someone is engaging on trac and writing plugins and themes, and posting about WordPress, yes, I take the time to read up on them. Remember, I’m auditing the plugin! So I want to see that this author is active and writes or contributes in a way that I approve of. That helps me trust them. Now I’m not expecting them to code as prolifically as Nacin, or write as frequently as Chris Lema, or even scour trac like Scribu. I have realistic expectations. One of my favorite developers is ‘try-lingual’ when it comes to CMSs, so I’ll check on her to see if she’s able to keep up with all the myriad CMSs her code works on. She knows about every release coming up? No fear!

    How popular is it?

    The more a plugin is used, the more people are banging on it in a diverse myriad of environments in ways the author probably never imagined. This is good. This means that the odds are higher than normal that the plugin will work on a bog-standard setup. It also means if I have a common server type (shared) it will probably work. The odds also go up for a more active volunteer environment. Popular plugin, used by thousands? No fear!

    How often is it updated?

    This is a careful thing. I don’t particularly worry if a plugin is old (i.e. not updated in over two years) if the plugin is simple, or made by someone very reliable. Heck, I haven’t touched the code in Impostercide in years, but I do update the readme every couple of WordPress releases to avoid people thinking it’s been abandoned. That said, I do like to see if the complicated ones are at the very least updating their readmes to say “yes, compatible up to the most recent version.” That tells me not only are they testing, but they’re aware of what’s going on in WordPress. Updates are reasonable? No fear!

    What does the code look like?

    The Reaper is Melvin'dThis is hard. This is really hard. I review plugins, and write them, and it’s just plain hard okay? If I’m lucky, I don’t actually have to do this. Examples? Okay, try StudioPress’ Genesis Theme. I don’t look at their code, unless I need to make a child theme. Even then, it’s a case of trusting them to do the best by me. I believe in their code more than mine most of the time. Another example? Anything managed by WordPress.org. But what about the rest? When it’s simple, I can read through the code, make sure it’s not doing anything nefarious and move on. When it’s not, I hire someone else to do it. You heard me. I pay people to do what I can’t because an audit of code is important. Now I don’t do this for every site. Personal/play sites? I may wing it, knowing I make good backups. But a big, company site? Oh you bet every single line of code was checked. Good code? No fear!

    Really? No fear?

    No. Not really. You have to keep in mind that none of these are absolutes. I don’t look at just one thing and say “Done, I have no fear.” I mean, I say ‘no fear’ in these explanations, but the truth is it’s the combination of these things that makes me fear less. WordPress is doing a good thing here and I’m not afraid of it.

    And in case you’re wondering, I’m using auto-updates on all my sites.

  • ShareDaddy Genericons

    ShareDaddy Genericons

    I have a sneaky feeling that after I publicize this, it may end up as an option in Jetpack. After all, they already include Genericons.

    jetpackI’m using Sharing (from Jetpack) on a couple sites, and it works fairly well (the metrics were surprising that one one site they excel and on others they’re never used). That said, I didn’t like the images loaded for ShareDaddy, and it was a real Golidlocks moment. The ‘icon’ buttons were buttons within buttons, and with or without the text, that didn’t make me smile. The official buttons were too large and not matchy enough since everyone has their own design.

    sharing-buttons1

    So what’s a girl to to but fall back on her favorite toy in all the world, Genericons!

    There are only three steps, and the third is to have a drink. You ready?

    Change Sharing Links to “Text Only”

    It’s easier to do this via text only, though I’m sure you can do it with the others. I switched to Text. One click. Done.

    Edit your CSS

    Now I want to hide the text, put a Genericon before the link, and set the colors to ‘true’ for each item (that is, use Twitter Blue for Twitter, Facebook Blue for Facebook, Google Orange for Google+ etc). I picked silvery-grey for email. Also I think it’s correct to use display:none to hide the text, since screenreaders will still read it, and that’s okay. Could be wrong. CSS is not my super-power.

    div.sharedaddy a.sd-button {
        padding: 2px!important;
    }
    
    div.sharedaddy .sd-content li a::before {
        font-family: 'Genericons';
    	font-size: 16px;
    	color: #fff;
    }
    
    div.sharedaddy a.sd-button>span {
        display: none;
    }
    
    div.sharedaddy .sd-content li.share-twitter a::before {
        content: '\f202';
        color: #4099FF;
    }
    div.sharedaddy .sd-content li.share-facebook a::before {
        content: '\f204';
        color: #3B5998;
    }
    div.sharedaddy .sd-content li.share-google-plus-1 a::before {
        content: '\f218';
        color: #DD4B39;
    }
    div.sharedaddy .sd-content li.share-tumblr a::before {
        content: '\f214';
        color: #2C4762;
    }
    div.sharedaddy .sd-content li.share-email a::before {
        content: '\f410';
        color: #666666;
    }
    

    This isn’t perfect, since there’s no Genericon for Printing, Digg, Reddit, StumbleUpon, or Pocket at this time. I’ll be suggesting it to Joen soon. Interestingly, Font Awesome (which could also be used for this) doesn’t have Reddit or the other social networks either, but it does have a print icon. Me? I don’t need them for this site, so it’s okay.

    myshare

    Looks great, scales well on high-def devices, and it pleases me. By the way Pinterest’s red is #C92228 from what I can tell.

    Have a drink

    Like I said, step three to was to have a drink. You’re done!

  • Genesis: Static Nav Bar

    Genesis: Static Nav Bar

    One of my sites got a facelift, and mid-stream I thought “This site would be the perfect place to have one of those floating nav bars.” You know, like how Twitter has this?

    sticky bar example

    Well guess what? It was easy! Presuming you already have a Primary Navigation Menu (like the one I have here with the Genericons), it’s two steps. Of note, you don’t have to do this in your functions.php, but since this will be a part of your theme, it probably belongs there. I tested, and it works in an mu-plugin as well. I should also point out that there are some official directions in the My.StudioPress.com site, but I didn’t use them. I like making it hard.

    Step One: Put the nav menu above your header

    This one was super easy, it’s even in one of the official Genesis Snippits under Navigation Menus. Put this in your functions.php file:

    //* Reposition the primary navigation menu
    remove_action( 'genesis_after_header', 'genesis_do_nav' );
    add_action( 'genesis_before_header', 'genesis_do_nav' );
    

    That puts the primary navigation menu above the header. If you want to use the secondary menu, it would be genesis_do_subnav but you can sort that out.

    Step Two: Make it stick

    This is pure CSS, so into your style.css goes:

    .nav-primary {
        position:fixed;
        z-index:99;
        top: 0;
        width: 100%
    }
    

    At first I didn’t add in the top: 0; but I found out that without it, a fixed position meant my header was suddenly under the navbar all the time. Oops. So I moved that to on, after spending an hour trying to math out the permutations with margins, and ended up with my navbar under the WordPress toolbar! Don’t worry, CSS to the rescue!

    body.admin-bar .nav-primary {
        top: 28px!important;
    }
    body.admin-bar .site-container {
        margin: 30px 0 0 0;
    }
    

    This simply says that for the body class of admin-bar, bump everything down by 28 pixels.

    Step Three: Return to Top

    I know, I know, I said two steps. This one is optional. I made a menu item called ‘Top’ with a link of #top and a CSS label of ‘top’ and it looks like this:

    Top Menu

    Now since I called this menu ‘primary’ and I’m using Genericons, I made this my CSS (keep in mind .nav-primary would also work):

    .menu-primary top {
        float: right;
    }
    
    .menu-primary li.top a {
        font-size: 0;
    }
    
    .menu-primary li.top a::before  {
        vertical-align: middle;
        padding: 0 5px 0 0;
        font-family: 'Genericons';
        content: '\f435';
    }
    

    This gives me a happy little top arrow that, when clicked on, takes people to the top. If you want to mess with colors, remember that to be specific for just the before calls, it’s a:hover:before (the pseudo-element is last).

  • Writing Evil Code

    Writing Evil Code

    Malicious CodeLately I’ve been doing a lot more training than ever before, and I think (Jen, tell me if I’m wrong) I’m decent at it. I certainly know I have issues with planning exactly what I’m going to teach, though in the case of WordPress troubleshooting, I’m not teaching people what the right answer is, but actually how to look at the error in order to find the right answer. It’s like a code philosophy class, and the more I give it, the more I think I should go back to school to actually ‘learn’ this stuff.

    One thing we’ve been learning about all this stuff, though, is that the hands-on lessons go way better than the lectures (to which every one of you is going ‘Duh, Mika!’ I’m sure), and in the interests of that, I’ve been writing intentionally bad and evil plugins. Actually, Kailey Lampert wrote most of the bad/broken plugins, and I’ve been writing the evil ones. I have a hard time writing broken, as it turns out.

    On the other hand, when it comes to writing intentionally nefarious code, it’s pretty easy. Either that or I’m actually really good at it and don’t think I’m not pondering what that means about me.

    The following are some of the one’s I’ve not only written, but explained what they do, why and how.

    Computers with Errors

    • I Love DC: When installed and activated, you will be redirected elsewhere. Forever.
    • I Love San Diego: Changes your password to something you have no idea what it is, and also changes your email so you can’t easily reset.
    • Hello D0LLY: Redirects non-logged in users to a different site.

    Now it’s intended that all these plugins are simple. They don’t take long to fix your site, and they don’t take long to decyrpt and understand. Every page where you can download them even tells you how to fix them. The point of them is not to make super complex hacks that can never be detected (no such thing), but to explain the process of how one looks through your own site to figure out what happened, and then the plugin file itself to see why it happened at all.

    You see, I’m not aiming for these to make someone the world’s best coder. The goal is to help people understand what’s going on and in general, how to un-do it. Personally, I’ve found that these are great ways for me to understand better how naughty people do things, but also the unraveling has proven delightful for people wanting to learn more about code and cleaning up sites. The only worry left with that is hackers might see this and get great ideas of what do to people. I finally decided that since I’m showing you all how to fix this, you’d know what was wrong when you saw it.

    If you want to download these hacks, check out Break/Fix over on my ElfTest network, and download away. Every example comes with a walkthrough on how to solve it, so if you need a hand held, it’s there for you.