Category: WordPress Toggle Comment Threads | Keyboard Shortcuts

Tips and Tricks on WordPress usage and development. I am very passionate about WordPress, but it doesn’t work just by itself – it needs a rich environment to live and breathe in.

If you’re after theme and plugin alterations, we have a category for that.

  • Jay Versluis 12:32 pm on January 7, 2015 Permalink | Reply  
    Categories: WordPress ( 106 )

    How to allow additional file type uploads in WordPress 

    AppIcon76x76@2xYou can upload a lot with the WordPress Media Uploader, but depending on the file extension the system will not allow everything on your server by default – for security reasons. ZIP files and PDFs are fine, but something more obscure – particularly non-standard extensions or executable files – are not. I like it that way too!

    One way around this limitation is to simply ZIP up your obscure file and upload the archive – but that’s not always an option. Besides, you may need your file to be openable directly.

    In this article I’ll show you how to add additional file extensions to WordPress so that they can be uploaded with the Media Uploader.

    Screen Shot 2015-01-07 at 11.54.45

    Principle

    WordPress takes care of allowed file extensions in an array of MIME Types. Those are comprised of a type and a subtype (for example, text/html or image/jpeg). Here’s a list of MIME Types commonly in use:

    When in doubt about your file type, text/plain is a good starting point. In this example I’ll add the .brush file extension because I wanted to share some Procreate Brushes, and iPad visitors should be able to open them directly in Procreate when they hit my link.

    Adding File Types

    We’ll setup a function which adds our file extension to the existing array of mime types, then let WordPress call this function with a filter. Add this code to your theme’s functions.php file, or anywhere in your plugin:

    function allow_personal_uploads ( $existing_mimes=array() ) {
     
    // add your own extension here - as many as you like
    $existing_mimes['brush'] = 'text/plain'; 
     
    // return amended array
    return $existing_mimes;
    }
    
    // call our function when appropriate
    add_filter('upload_mimes', 'allow_personal_uploads');
    

    It’s always wise to prefix such functions with your own initials or known prefix (like prefix_allow_personal_uploads). This avoids potential duplicate functions and conflicts with WordPress and existing plugins.

    That’s it – .brush files are now allowed by the Media Uploader.

    Removing File Types

    With the same principle we can also disallow certain file types to be uploaded. For example, GIF files are allowed by default, but we can remove them if we wish:

    function disallow_personal_uploads ( $existing_mimes=array() ) {
     
    // remove GIF files
    unset ($existing_mimes['gif']); 
     
    // return amended array
    return $existing_mimes;
    }
    
    // call our function when appropriate
    add_filter('upload_mimes', 'disallow_personal_uploads');
    

    No more GIF uploads.

    Multisite Considerations

    To make your new file extensions available on Multisite Installations, you need to add those under Network Admin – Settings – Network Settings – Upload Settings. There’s a text box there with default values, just add yours at the end, separated from the rest with a space:

    Screen Shot 2015-01-07 at 12.29.42

    No need to remove any here, they simply won’t be allowed when users try to upload extensions you’ve forbidden by using the upload_mimes filter.

    Further Reading





     
  • Jay Versluis 10:04 pm on December 24, 2014 Permalink | Reply  
    Categories: Linux, Plesk, WordPress ( 53 )

    FIXED: The wp-content folder does not show itself via FTP in Plesk 12 and CentOS 7 

    Screen Shot 2014-12-24 at 21.49.49

    I’ve noticed a weird bug in Plesk 12 on CentOS 7: when you connect via FTP, the wp-content folder does not show up – all other folders can be seen as usual. It’s a rather crucial folder for WordPress users.

    At first I had suspected a problem with the ProFTP service which is not the stock version, but a specially compiled version for use with Plesk, and Plesk takes care of this system services (it’s called psa-proftpd in case you’re interested). But ProFTP is not the problem.

    Thanks to the amazing Sergey Lystsev from Parallels for letting me know that the issue is instead with SELinux: when it’s used in Enforcing mode (which is the default), wp-content does not show itself via FTP. Switching it to Permissive mode or disabling SELinux altogether solves the problem.

    The entire issue will be fixed in the next release of Plesk, and it’s already working in the latest update to the Plesk Preview 12.1.13. CentOS 5 and 6 are not affected.

    How do we fix it, Cap’m?

    To disable SELinux on CentOS 7 we can use this:

    setenforce 0
    

    Or, to switch to permissive mode, use this:

    setenforce permissive
    

    Now we’ll need to restart the xinetd service as well as Plesk for the changes to take effect:

    systemctl restart xinetd.service
    service psa stopall
    service psa restart
    

    Connect to your site via FTP and see if the wp-content folder shows itself.

    To permanently change the SELinux configuration so that it survives a server restart, check out my other article here:





     
    • Ronald 7:56 am on January 20, 2015 Permalink | Reply

      Thanks a lot for this post! I was experiencing the exact same problem and this solved it. Thanks.

      • Jay Versluis 9:16 am on January 20, 2015 Permalink | Reply

        You’re very welcome, Ronald!

  • Jay Versluis 3:58 pm on December 5, 2014 Permalink | Reply
    Tags:   

    Categories: MySQL, WordPress ( 18 )

    How to find and replace in MySQL with phpMyAdmin 

    mysqlSometimes you need to replace a string in your database with another string, and it can be rather tedious to plough through a large table manually. Thankfully MySQL can execute raw queries such as find and replace.

    This comes in handy if you’ve moved a WordPress installation to another URL: you only need to tweak two values in the options table, but there may be countless image references and links in the posts and options table too. That’s where find and replace can come in handy.

    You can execute the following statement either on the MySQL command line, or use phpMyAdmin’s Raw SQL option:

    Screen Shot 2014-12-05 at 15.42.10

    That big text field is where we’ll use the following code. Before we do however, make a backup of your database because there is NO UNDO FUNCTION in MySQL. A cute typo can break things beyond repair!

    Here’s what the find and replace statement looks like in principle:

    update table_name set field_name = replace(
    field_name, 'original text',
    'replacement text');
    

    For WordPress specifically, if you’d like to replace text strings inside posts and pages, then wp_posts would be your table, and field_name is the column of that table. So for wp_posts this will be post_content. You can see the field labels at the top of each column when you select a table.

    To replace a URL in all posts and pages the statement would look like this:

    update wp_posts set post_content = replace(
    post_content, 'http://oldurl.com/',
    'http://newdomain.com/subfolder/');
    

    As soon as you hit GO, MySQL will go to work and show you a success or failure message. The above would replace all image references and links from your old domain to the new one, where WordPress is installed in a subfolder.

    Make a note of your table prefix and replace it accordingly. wp_ is the default, but this can easily be changed into something else for security reasons. Be cautious of trailing slashes when you’re replacing URLs.

    Also note that a small letter “l” and a capital “I” look surprisingly similar in the phpMyAdmin! If you keep getting errors like “this table does not exist”, it’s something to watch out for before questioning your sanity again ;-)

     

    Replacing URL strings in WordPress

    I use this technique when I need to replace URLs across an entire WordPress installation. Those can hide not only in posts, but also in widgets and menus. Here’s a list of places to hunt for them:

    • wp_posts table, in the posts_content field (links inside posts and pages)
    • wp_links table, in the link_url field (the old Link Manager)
    • wp_postmeta table, in the meta_value field (URLs of Custom Menu items)
    • wp_options table, in the options_value field (anything saved by themes and plugins)
    • wp_comments table, in the comment_content field (URLs inside comments)

    And while we’re talking about replacing URLs: if you need to change the root URL of a WordPress installation, this is done in wp_options too. Look for two values called siteurl and home.

     

    Further Reading





     
  • Jay Versluis 11:31 am on September 20, 2014 Permalink | Reply
    Tags:   

    Categories: WordPress ( 106 )

    P2 Header Ad – Version 1.5 released 

    Screen Shot 2014-09-20 at 11.15.53

    I’ve just updated my P2 Header Ad plugin with some new options:

    • you can now display the same ad again after the post content (before the comments)
    • you can do this on single posts, and additionally on the front page if you like

    These options are not enabled by default and work best if you have longer posts on your site – the look a bit naff if you use your P2 site mainly for short status updates.

    I’ve also spruced up the graphic assets that are used on WordPress.org while I was at it. Check out the new options in the Admin Interface (it’s still under Appearance – P2 Header Ad):

    screenshot-2

    Note on Google Adsense ads

    If you’re using both options above with Google Adsense ads, please note that those can only be shown up to 5 times on a single page. If your front page shows 5 posts or more, then the ad can no longer be displayed in the header (which is called last for performance reasons).

    If you want to use the after-content-front-page-ad feature, and you want the header to show first, you can tweak line 293 of the main plugin file (p2-header-ad.php) from this

    add_action ('get_footer', 'p2DisplayAdvert');
    

    to

    add_action ('get_header', 'p2DisplayAdvert');
    

    I may make this an option in the admin interface in a future update. Let me know if you have any questions. Enjoy the plugin, you can download it from within WordPress, on WordPress.org on GitHub:





     
  • Jay Versluis 12:30 pm on September 8, 2014 Permalink | Reply
    Tags:   

    Categories: WordPress ( 106 )

    How to add Icons and Banners for your Plugins hosted on WordPress.org 

     

    Screen Shot 2014-09-08 at 12.29.32

    WordPress 4.0 introduced a new way to browse Plugins in the admin interface: beautiful icons show up that make Plugins looks like Mini-Apps. When a user clicks on one they get a description right there and then without the need to browse to the WordPress site in a different tab. This gives easy and instant access to important info without disrupting the user experience. Simply put: it’s beautiful!

    It’s very simple to add your own icons and banners to this experience and stand out from the crowd. Let me show you how.

    Plugin Icons

    Create a square icon, much like you would for iOS and Android Apps. Avoid text and keep it simple. Icons can be either jpg or png (transparency is recognised in the latter format). You can upload two sizes with the following file names:

    • icon-128×128.jpg (or icon-128×128.png) for standard displays
    • icon-256×256.jpg (or icon-256×256.png) for retina/hi-res displays

    The second file is optional and will show up if a suer browses on an iPad or Retina Laptop. Both files need to reside in the plugin’s assets folder. This is something that is not download when a plugin is installed and only lives on the WordPress repo.

    Assets is the same folder that houses your screenshots you may have added which show up in the plugin descriptions. If yours live in the main plugin folder, perhaps now is a good time to move them into assets and keep downloads smaller.

    If you don’t already have an assets folder, create one in your root directory of your svn repo (as provided by the WordPress Plugin Master), on the same level as trunks, tags and branches:

    your-plugin-folder (root)
        trunk
            plugin-files-live-here
        tags
            1.0
            1.1
        branches
        assets
            icon-128x128.png
            icon-256x256.png
    

    Commit your files using your favourite SVN Tool and now they’ll show up in the WordPress admin interface as seen in the screenshot above. It’s that simple.

    Plugin Banners

    Banners were introduced to plugin authors sometime in July 2012. Back then they were only displayed on the WordPress.org site as part of your plugin URL, like this: http://wordpress.org/plugins/child-theme-wizard

    Screen Shot 2014-09-08 at 11.48.04

    The new feature in WordPress 4.0 is that those banners now show up when a user clicks your plugin to get more information.

    And just like with icons, those banners live in the same assets directory and follow the same pattern for standard and retina displays. Banner sizes are 772×250 and 1544×500 respectively. Again both jpg and png formats are accepted:

    your-plugin-folder (root)
        trunk
            plugin-files-live-here
        tags
            1.0
            1.1
        branches
        assets
            banner-772x250.png
            banner-1544x500.png
    

    Here’s what a banner looks like in the WordPress admin interface:

    Screen Shot 2014-09-08 at 11.50.08





     
  • Jay Versluis 8:41 am on September 1, 2014 Permalink | Reply  
    Categories: Plesk, Screencasts, WordPress ( 52 )

    How to use the WordPress Toolkit in Plesk 12 

    In this screencast I’ll show you how to use the WordPress Toolkit in Plesk 12.

    I’ll demonstrate how to update WordPress Core, Plugins and Themes selectively and across the entire server directly from within Plesk.

    Among many other features I’ll also show you how to secure WordPress instances, install and remove themes, and how to exclude WordPress instances from mass management.

     





     
  • Jay Versluis 8:45 am on July 28, 2014 Permalink | Reply
    Tags:   

    Categories: Screencasts, Themes, WordPress ( 59 )

    How to use the TwentyThirteen Theme by Automattic 

    In this screencast I’ll show you how to use TwentyThirteen, a simple yet powerful WordPress theme that looks gorgeous and is mobile friendly. I’ll explain Post Formats and their impact, how to show images in galleries and how to embed videos to your WordPress site too.

    I’ll finish it off by demonstrating how the site looks like on a desktop browser as well as the iOS Simulator on iPad and iPhone. I’m using WordPress 3.9 for this demo.

    I’m referencing some related articles in this video – here they are:





     
  • Jay Versluis 1:05 pm on July 3, 2014 Permalink | Reply  
    Categories: WordPress ( 106 )

    How to avoid 500 Internal Server Errors when using the WordPress Importer 

    wordpress-iconI’ve used the WordPress Importer on many occasions – most of which gave me more grief than results. Usually I end up with a white screen telling me that there was an “Internal Server Error”. It basically means that something went wrong, but nobody knows what it was – and there is no way to find out.

    While entertaining ideas of finding another hobby, I searched the web one last time to sift through the hundreds of posts by other users sharing the same woes – until I came across this forum post by Anon who had the same problem:

    Anon did not give up so easily and found a solution which WORKS GREAT – even though it doesn’t make sense, or is in any way documented:

    Rather than simply importing the XML file you receive from Tools – Export, turn this file into a GZIP file, and then import it.

    I have no idea why this works, but I’ve just tried it with WordPress 3.9.1 and it works like a charm. On a Mac, simply

    • open Terminal
    • type “gzip ” (with a space)
    • then drag the file in question into the Terminal session
    • this will paste the full path of that file

    Hit return and you have a .gz file. The original file is deleted automatically.

    You can also do this from the command line like this:

    gzip yourfile.xml
    

    Anon suggests that if you’re a Windows user you can use 7zip to create a .gz file.





     
  • Jay Versluis 12:53 pm on June 30, 2014 Permalink | Reply
    Tags:   

    Categories: WordPress ( 106 )

    How to swap the post title and date in P2 

    wordpress-iconI’ve just posted this tweak in the WordPress P2 forum to help a user and thought I’d add it here too before I forget what I did.

    To swap the post title and date in P2 we’ll first grab a reference to each element, then we move one up and the other down.

    Like so:

    /* swap post title and date */
    #main h4 {
      margin-top: 30px;
      margin-bottom: 15px;
    }
    #main .postcontent h2 {
      margin-top: -65px;
    }
    

    Note that the date line does not have a selector for the author, so it’s difficult to remove it if that’s required. You can remove the entire line though (#main h4).

    Add padding where appropriate.





     
  • Jay Versluis 8:35 am on June 16, 2014 Permalink | Reply
    Tags: Flickr, , , Vimeo,   

    Categories: Screencasts, WordPress ( 59 )

    How to embed YouTube and Vimeo videos in WordPress 

    In this screencast I’ll show you how to embed YouTube and Vimeo videos into your WordPress posts. There’s no need to copy and paste code snippets and position them anymore, thanks to a technology called oEmbed (sometimes called auto embed).

    WordPress parses the URL to your videos and adds the code needed to display those automatically – it even adjusts the width (if supported by your theme).

    oEmbed works with a variety of services, and while I’m at it I’ll show you how to embed items from YouTube, Vimeo, Flickr and Twitter. For a full list of supported services take a look at this:

     





     
c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
l
go to login
h
show/hide help
shift + esc
cancel