Tag Archives: WordPress

How to embed third-party widgets such as Mixcloud into WordPress

There are now a huge number of third-party content providers that offer the ability to embed their content into your own website. YouTube is no longer the only media streaming service that you might want to include in one of your pages. Many other competing media streaming providers are now offering an API that should make it easy to embed their content. However, the question is what is the best way to include their content in one of your WordPress pages?

This post describes three different approaches to embedding third-party content. It is written for owners of self-hosted WordPress sites, but some of the techniques may also be applicable to sites hosted on WordPress.com. I will use the Mixcloud audio streaming service for the examples, specifically because it is not one of the out-of-the-box supported services in WordPress.

Continue reading How to embed third-party widgets such as Mixcloud into WordPress

Mixcloud logo

How to embed your Mixcloud profile in your WordPress Blog

Mixcloud is a fantastic online music streaming service that allows you to share your DJ mixes over the internet for free. Unfortunately, most WordPress social media widgets don’t yet seem to support linking to Mixcloud profiles out-of-the-box, so for the time being you might need an alternative solution.

Here is an easy way  to embed your Mixcloud profile in a Widget Area of your WordPress Blog, for example in a sidebar or footer on every page:

  1. Log in to your WordPress Blog as an Administrator.
  2. Go to the Appearance/Widgets admin section.
  3. Choose a suitable Widget Area from those displayed down the right-hand side of the page (e.g. Main Widget Area or Secondary Widget Area). Your Widget Areas may differ depending on the WordPress Theme you are currently using.
  4. Drag and drop a new Text widget from the Available Widgets box into the correct location of your chosen Widget Area.
  5. Enter a suitable Title for the new widget. This will be displayed at the top of the new widget box, so use something like “Follow me on Mixcloud”.
  6. In a new browser window/tab, log in to your Mixcloud account and go to your profile page.
  7. Click on the Embed button.
  8. Adjust the available Options as required.
  9. Once happy with the displayed Preview, select and copy the entire contents of the HTML code box.
  10. Go back to your WordPress Appearance/Widgets window, and paste the HTML code into the main box of your newly created Text widget.
  11. Save the Text widget.
  12. Review your Blog and check that your Mixcloud profile is being displayed correctly in the chosen Widget Area.

The same approach is equally applicable to other Content Management Systems or hand-coded websites. Please bear in mind that JavaScript support is required on the client for the Mixcloud widget to display correctly.


How to add Google Authorship to a single author WordPress Blog

Google Authorship is a great new way to boost your online presence by associating your Google+ profile with any web content that you create, so that Google automatically displays your Google+ profile next to any of your content listed in search results. It can help you to attract new followers, and help people to easily find other content that you have produced. Google have also added new “Author Stats” to their Webmaster Tools so that authors can easily see how often their own content is being discovered in Google search results.

This post gives simple instructions on how to add Google Authorship to a WordPress Blog produced by a single author. It assumes that you are using a WordPress Theme that supports WordPress “Menus”, and that you have a menu link to an “About” page about the Blog’s main author.

  1.  Create a Google+ profile that you want to associate with the WordPress Blog in question.
  2. If you don’t already have one, register a suitable email address with the same domain name as the WordPress Blog. Note – it is still possible to associate content from a domain that you don’t have an email address for, but that is not covered by this post.
  3. Activate Google Authorship using your email address with the same domain name as your Blog.
  4. Install the AuthorSure WordPress plugin in your WordPress Blog.
  5. Follow the AuthorSure instructions for configuring a single author Blog.
  6. Ensure that you have added your Google+ profile URL to your WordPress user account profile, since this is where AuthorSure gets the Google+ profile URL from when it automatically inserts the link below every post. When logged in to your WordPress Blog as the admin user, hover over the top-right menu and click on “Edit My Profile”. At the bottom of that profile page in the “Contact Info” section you will find a space for your “Google Plus Profile URL”.
  7. Use the Google Webmaster Structured Data Testing Tool to check if your Blog has been correctly configured for Google Authorship. Paste in an example URL for a post on your Blog to see if it correctly detects your Authorship data.
  8. If this test fails, or you have any other issues, please refer to the Google Authorship help page and double check everything.

In general, it seems to take between several days and several months for your Google+ profile to start appearing next to Google search results for your content, so don’t expect immediate results.

Client-side Rendering of RSS Feeds in Drupal

So I wanted to display the RSS feed of my latest Blog posts in the sidebar of my main website, which is powered by Drupal. Normally this would be trivial, if my Blog was also hosted by the same Drupal site. However, my Blog actually lives on a separate WordPress site running on the same web server. I wanted to learn both Drupal and WordPress, which is why I elected to have two separate CMSs (yes I realise this is just making life harder, but this is how we learn!).

Initially I installed the standard Feeds module, but for some reason it couldn’t aggregate the RSS feed from my Blog site. I eventually tracked the problem down to my web host Heart Internet. It seems they block loopback connections, which is preventing the underlying fsockopen() PHP call that powers the Drupal Feeds module from reading my Blog’s RSS file on the same server. Since all Drupal RSS modules use the same server-side socket connection model to read the RSS feeds, my only option was to use a client-side RSS aggregator.

After some research, I came across the PaRSS module, which uses the PaRSS jQuery plugin to actually do the work on the client. The installation is slightly complicated by the fact the jQuery plugins site is currently inaccessible due to development work, but you can download the necessary PaRSS files here. Once you’ve installed the module and library files, it’s quite easy to create a link (using the Link module) to represent the RSS feed URL, and then plug that in to a Drupal block with the formatter set to ‘PaRSS’ to ensure you get a nice jQuery-powered rendering of the RSS feed.

You can see my results in the left-hand sidebar of my main website, where it says “My Latest Blog Posts”. That is being populated on every page load by the PaRSS client-side library. This is not as elegant a solution as the Feeds module, but it offloads the effort from the Drupal server, and overcomes the restrictions of my web host. Sometimes you just gotta do what you gotta do.

Rename/remove the default “Home” menu link in WordPress Twenty Eleven Theme

If you’re using the “Twenty Eleven” Theme in WordPress and you want to either rename or remove the default “Home” link in your main menu bar, this is what you need to do:

  1. Create a child theme of “Twenty Eleven”. You only need a basic child theme with a default style.css file and an empty functions.php file.
  2. Add the following code to your functions.php file:
add_filter('wp_page_menu_args', 'twentyelevenchild_page_menu_args', 20);

function twentyelevenchild_page_menu_args( $args )
    $args['show_home'] = {value};
    return $args;

where {value} is either:

  • “new name” – to give the “Home” link a new custom name, or
  • false – to disable the “Home” link altogether.

It’s possible that this approach will work for other Themes, but I have not tested that – please add a comment if you find out!

How to remove the “Leave a Reply” Comment Box from a WordPress Page

For the standard WordPress “Twenty Eleven” Theme in WordPress v3.4.1, it’s very easy to remove the standard “Leave a Reply” box from a given page:

  1. Edit the page in question.
  2. Select the “Screen Options” drop-down menu from the top-right corner of the edit interface.
  3. Select the “Discussion” checkbox to make the Discussion options appear at the bottom of the screen, below the page editor.
  4. Scroll down to the “Discussion” options and uncheck both the “Allow comments” and “Allow trackbacks and pingbacks on this page” checkboxes.
  5. Then “Update” the page as normal.

The “Leave a Reply” box should now be gone! Now that you’ve enabled the “Discussion” options panel by default, you will easily be able to disable comments for any page by unchecking the same two options below the page content editor.