How to Allow Users to Notify You of Errors in WordPress Posts

Self publishing your ideas on the web has become extremely easy. However, the biggest downside of self-publishing is that you are entirely responsible for your mistakes. There is no one checking, proof reading and editing what you publish except yourself. You might have built yourself… Read More »

The post How to Allow Users to Notify You of Errors in WordPress Posts appeared first on WPBeginner.

Self publishing your ideas on the web has become extremely easy. However, the biggest downside of self-publishing is that you are entirely responsible for your mistakes. There is no one checking, proof reading and editing what you publish except yourself. You might have built yourself a good editing workflow where you cross-check your facts, spell-check your articles, and polish your thoughts with revisions, but there is always a chance that you might make a mistake. A small typo, a broken link, or another minor error can happen because you are human. Though if not reported on time, your error can stay there for years. In this article, we will show you how to allow your users to notify you of error in WordPress post content using error notifications.

Let users help you find mistakes in WordPress blog posts

Why Catching Small Errors is Important?

First of all a careless typo or spelling mistake can leave a bad impression on your readers. They might think that you do not carefully craft your posts before publishing them.

You can use tools to auto-check grammar and spelling mistakes in WordPress, but there is still a chance that some mistakes may end up on your site. They can stay there for years without you noticing or correcting them.

If you are writing in a language that is not your first language, then your words can be mistaken by native speakers. Some of your users may want to help you out by pointing out those mistakes so that you can fix them.

Allowing Users to Notify You of Errors in WordPress

First thing you need to do is install and activate the Mistape plugin. Upon activation, you need to visit Settings » Mistape page to configure the plugin.

Mistape settings page

You can choose users with the administrator or editor user roles to receive notification email about errors. Alternately, you can manually enter email addresses where you want to send notifications.

You can choose the post types where this feature would appear. You must check posts if you want all your blog posts to have this feature.

The plugin can automatically add a caption below posts to inform users that they can notify you about errors. But if you don’t want to automatically display the caption, then you can enable the shortcode.

You can also customize caption shown to users about this feature. By default, the plugin will show a text message. This text will be automatically translated if you are using WordPress in languages other than English.

Don’t forget to click on the save changes button to store your settings.

You can now see the plugin in action on your website. Depending on your settings plugin will display the caption below your posts. Users can select mistakes and press CTRL+Enter (Control+Enter on Mac).

A popup will appear to inform users that their suggestion is forwarded to site admins.

Notification sent popup

We hope this article helped you allow users to notify you of errors in WordPress posts. You may also want to see our guide on how to create a blog post checklist in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Allow Users to Notify You of Errors in WordPress Posts appeared first on WPBeginner.

How to Easily Display Code on Your WordPress Site

Do you run a development related blog and want to share code snippets on your blog posts? By default, showing codes in your WordPress site is not easy. For security reasons WordPress filters out any raw code added into posts, widgets, or comments. We’re often… Read More »

The post How to Easily Display Code on Your WordPress Site appeared first on WPBeginner.

Do you run a development related blog and want to share code snippets on your blog posts? By default, showing codes in your WordPress site is not easy. For security reasons WordPress filters out any raw code added into posts, widgets, or comments. We’re often asked about what syntax highlighter plugin do we use to display code on our website. In this article, we will show you how to easily display code on your WordPress site.

First you need to install and activate the Synatx Highlighter Evolved plugin. Upon activation, you need to visit Settings » Syntax Highlighter to configure the plugin settings.

Syntax Highlighter settings page

The basic plugin settings should work for most websites. However, you should review all settings and make changes if necessary. Each option has detailed description to explain what it does. Once you are done, simply click on the save changes button to store your settings.

Syntax Highlighter evolved uses simple shortcodes to display code. For each language you need wrap your code in the shortcode for that language.

For PHP you would wrap your code like this:

[php]
<?php
echo “Hello World”;
?>
[/php]

It will appear in your post like this:

<?php
echo "Hello World";
?>

For CSS you will wrap your code like this:

[css]
.entry-title {
font-family:”Open Sans”, arial, sans-serif;
font-size:16px;
color:#272727;
}
[/css]

It will appear on your site like this:

.entry-title { 
font-family:"Open Sans", arial, sans-serif;
font-size:16px;
color:#272727; 
}

Syntax Highlighter will automatically highlight the code for that particular language. It will also add line numbers and handle tab indent properly. Your users will be able to easily copy and paste code snippets from your WordPress site.

How to Display Code in WordPress Without Using Plugin

Many bloggers do not run a development blog, so they don’t need to add sample code snippets in their posts very often. For rare occasions, you can add code by encoding the code into HTML entities. Like this:

&gt;?php echo "Hello World"; ?&lt;

The problem with converting code into HTML entities is that it is difficult to do manually. You can use online tools like this one, to convert code into HTML entities.

By converting PHP, HTML, JavaScript code into HTML entities, you can paste them into your WordPress posts. For additional styling you can wrap code between <code> and </code> tags.

We hope this article helped you find the best syntax highlighter plugin for WordPress. You may also enjoy our article about 13 plugins and tips to improve WordPress admin area.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Easily Display Code on Your WordPress Site appeared first on WPBeginner.

How to simulate a low bandwidth connection for testing web sites and applications

Facebook just announced an internal initiative called “2G Tuesdays” and I think it’s brilliant. It’s a clear and concrete way to remind folks with fast internet (who likely have always had fast internet) that not everyone has unlimited bandwidth or a fast and reliable pipe. Did you know Facebook even has a tiny app called “Facebook Lite” that is just 1Mb and has good support for slower developing networks?

You should always test your websites and applications on a low bandwidth connection, but few people take the time. Many people don’t know how to simulate simulate low bandwidth or think it’s hard to set up.

Simulating low bandwidth with Google Chrome

If you’re using Google Chrome, you can go to the Network Tab in F12 Tools and select a bandwidth level to simulate:

Selecting lower bandwidth in Google Chrome F12 Tools

Even better, you can also add Custom Profile to specify not only throughput but custom latency:

Custom Profiles for Google Chrome that control throughput and latency

Once you’ve set this up, you can also click “disable cache” and simulate a complete cold start for your site on a slow connection. 20 seconds is a long time to wait.

Google Chrome timeline showing my site on a 2G connection

Simulating a slow connection with a Proxy Server like Fiddler

If you aren’t using Chrome or you want to simulate a slow connection for your apps or other browsers, you can slow it down from a Proxy Server like Fiddler or Charles.

Fiddler has a “simulate modem” option under Rules | Performance, and you can change the values from Rules | Customize Rules:

image

You can put in delays in milliseconds per KB in the script under m_SimulateModem:

if (m_SimulateModem) {
// Delay sends by 300ms per KB uploaded.
oSession["request-trickle-delay"] = "300";
// Delay receives by 150ms per KB downloaded.
oSession["response-trickle-delay"] = "150";
}

There’s a number of proxy servers you can get to slow down traffic across your system. If you have Java, you can also try out one called “Sloppy.” What’s your favorite tool for slowing traffic down?

Conclusion

There is SO MUCH you can do to make the experience of loading your site better, not just for low-bandwidth folks, but for everyone. Squish your images! Don’t use PNGs when a JPEG would do. Minify! Use CDNs!

image

However, step 0 is actually using your website on a slow connection. Go do that now.

Related Links


Sponsor: Big thanks to Infragistics for sponsoring the feed this week. Quickly & effortlessly create advanced, stylish, & high performing UIs for ASP.NET MVC with Ignite UI. Leverage the full power of Infragistics’ JavaScript-based jQuery/HTML5 control suite today.


© 2015 Scott Hanselman. All rights reserved.
     

Facebook just announced an internal initiative called "2G Tuesdays" and I think it's brilliant. It's a clear and concrete way to remind folks with fast internet (who likely have always had fast internet) that not everyone has unlimited bandwidth or a fast and reliable pipe. Did you know Facebook even has a tiny app called "Facebook Lite" that is just 1Mb and has good support for slower developing networks?

You should always test your websites and applications on a low bandwidth connection, but few people take the time. Many people don't know how to simulate simulate low bandwidth or think it's hard to set up.

Simulating low bandwidth with Google Chrome

If you're using Google Chrome, you can go to the Network Tab in F12 Tools and select a bandwidth level to simulate:

Selecting lower bandwidth in Google Chrome F12 Tools

Even better, you can also add Custom Profile to specify not only throughput but custom latency:

Custom Profiles for Google Chrome that control throughput and latency

Once you've set this up, you can also click "disable cache" and simulate a complete cold start for your site on a slow connection. 20 seconds is a long time to wait.

Google Chrome timeline showing my site on a 2G connection

Simulating a slow connection with a Proxy Server like Fiddler

If you aren't using Chrome or you want to simulate a slow connection for your apps or other browsers, you can slow it down from a Proxy Server like Fiddler or Charles.

Fiddler has a "simulate modem" option under Rules | Performance, and you can change the values from Rules | Customize Rules:

image

You can put in delays in milliseconds per KB in the script under m_SimulateModem:

if (m_SimulateModem) {

// Delay sends by 300ms per KB uploaded.
oSession["request-trickle-delay"] = "300";
// Delay receives by 150ms per KB downloaded.
oSession["response-trickle-delay"] = "150";
}

There's a number of proxy servers you can get to slow down traffic across your system. If you have Java, you can also try out one called "Sloppy." What's your favorite tool for slowing traffic down?

Conclusion

There is SO MUCH you can do to make the experience of loading your site better, not just for low-bandwidth folks, but for everyone. Squish your images! Don't use PNGs when a JPEG would do. Minify! Use CDNs!

image

However, step 0 is actually using your website on a slow connection. Go do that now.

Related Links


Sponsor: Big thanks to Infragistics for sponsoring the feed this week. Quickly & effortlessly create advanced, stylish, & high performing UIs for ASP.NET MVC with Ignite UI. Leverage the full power of Infragistics’ JavaScript-based jQuery/HTML5 control suite today.


© 2015 Scott Hanselman. All rights reserved.
     

How to Disable Auto Linking of URLs in WordPress Comments

Did you know that when a user adds a plain text URL in their comments, WordPress automatically makes it clickable. Recently, one of our readers asked us if it was possible to disable auto-linking of text urls in WordPress comments? The answer is YES. In… Read More »

The post How to Disable Auto Linking of URLs in WordPress Comments appeared first on WPBeginner.

Did you know that when a user adds a plain text URL in their comments, WordPress automatically makes it clickable. Recently, one of our readers asked us if it was possible to disable auto-linking of text urls in WordPress comments? The answer is YES. In this article, we will show you how to disable auto-linking of URLs in WordPress comments.

Why WordPress Autolinks Text URLs in Comments?

WordPress automatically converts text URLs into links which makes it easier to visit the link while moderating comments.

This auto-linking is not stored in your database. WordPress makes URLs clickable when displaying them on screen in admin area as well as comments section below your articles.

Auto-linked clickable text URL in WordPress comments

Some of these comments are genuine where commenters didn’t know how to add a link in comments. But many spam comments also contain plain URLs pasted directly in the comment text.

Disabling Auto-Link in WordPress Comments

Simply add this single line of code in your theme’s functions.php file or in a site-specific plugin.

remove_filter( 'comment_text', 'make_clickable’, 9 );

WordPress does not store plain text URLs as links in the database. Instead it changes them into clickable links on the fly. This code simply disables the filter that makes URLs clickable.

This makes plain text URLs non-clickable in admin area and comments section below your posts. Removing this code will re-enable the auto linking.

If you are adding it to your theme’s functions.php file, then updating your theme will overwrite your functions file.

Also keep in mind that this code only works on plain text URLs. If a user decided to create a link by adding the proper HTML tag, then those links will appear as they should.

If you want to complete turn off any HTML in comments, then take a look at our tutorial on how to disable HTML in WordPress comments.

We hope this article helped you disable auto linking of URLs in WordPress comments. You may also want to see our list of 16 best plugins to improve WordPress comments.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Disable Auto Linking of URLs in WordPress Comments appeared first on WPBeginner.

NuGet Package of the Week: Microphone registers and discovers Web APIs and REST services with Consul

I’m sitting on a plane on the way back from a lovely time in Europe. I attended and spoke at some great conferences and met some cool people – some of which you’ll hear on the podcast soon. Anyway, one of the things that I heard mentioned by attendees more than once was the issue of (micro) service discovery for RESTful APIs. Now if you lived through the WS*.* years you’ll perhaps feel a lot of this is familiar or repeated territory, but the new stuff definitely fits together more effortlessly than in the past.

Consul is a system that does service discovery, configuration management, and health checking for your services. You can write Web APIs in lots of things, Rails, Python, and ASP.NET with WebAPI or NancyFX.

Microphone is a library by Roger Johansson that plugs into both WebAPI and Nancy and very simply and easily registers your services with Consul. It’s recently been expanded to support CoreOs-ETCD as well, so it’s really a general purpose framework.

I made a little .NET 4.6 console app that self hosts a WebAPI like this.

namespace ConsulSelfHostedWebAPIService
{
class Program
{
static void Main(string[] args)
{
Cluster.Bootstrap(new WebApiProvider(), new ConsulProvider(), "HanselWebApiService", "v1");
Console.ReadLine();
}
}

public class DefaultController : ApiController
{
public string Get()
{
return "Hey it's my personal WebApi Service";
}
}
}

Now my Web API is registered with Consul, and now Consul itself is a RESTful Web API where I can hit http://localhost:8500/v1/agent/services and get a list of registered services. It’s the Discovery Service.

Consul reporting my WebAPI

Then later in a client or perhaps another Web API, I can ask for it by name and I’ll get back the address and port that it’s on, then call it.

var instance = await Cluster.FindServiceInstanceAsync("Heycool");

return String.Format("Look there's a service at {0}:{1}", instance.Address, instance.Port);

Here’s an active debug session showing the address and port in the instance:

Using Microphone.WebAPI and Consul for Service Discovery

It will be interesting to see what will happen with Consul and systems like it if the Azure Service Fabric gains traction. Service Fabric offers a lot more, but I wonder if there is a use case for both, with Service Fabric managing lifecycles and Consul doing discovery.

This is all early days, but it’s interesting. What do you think about these new discovery services for Web APIs?


Sponsor: Big thanks to Infragistics for sponsoring the feed this week. Quickly & effortlessly create advanced, stylish, & high performing UIs for ASP.NET MVC with Ignite UI. Leverage the full power of Infragistics’ JavaScript-based jQuery/HTML5 control suite today.


© 2015 Scott Hanselman. All rights reserved.
     

I'm sitting on a plane on the way back from a lovely time in Europe. I attended and spoke at some great conferences and met some cool people - some of which you'll hear on the podcast soon. Anyway, one of the things that I heard mentioned by attendees more than once was the issue of (micro) service discovery for RESTful APIs. Now if you lived through the WS*.* years you'll perhaps feel a lot of this is familiar or repeated territory, but the new stuff definitely fits together more effortlessly than in the past.

Consul is a system that does service discovery, configuration management, and health checking for your services. You can write Web APIs in lots of things, Rails, Python, and ASP.NET with WebAPI or NancyFX.

Microphone is a library by Roger Johansson that plugs into both WebAPI and Nancy and very simply and easily registers your services with Consul. It's recently been expanded to support CoreOs-ETCD as well, so it's really a general purpose framework.

I made a little .NET 4.6 console app that self hosts a WebAPI like this.

namespace ConsulSelfHostedWebAPIService

{
class Program
{
static void Main(string[] args)
{
Cluster.Bootstrap(new WebApiProvider(), new ConsulProvider(), "HanselWebApiService", "v1");
Console.ReadLine();
}
}

public class DefaultController : ApiController
{
public string Get()
{
return "Hey it's my personal WebApi Service";
}
}
}

Now my Web API is registered with Consul, and now Consul itself is a RESTful Web API where I can hit http://localhost:8500/v1/agent/services and get a list of registered services. It's the Discovery Service.

Consul reporting my WebAPI

Then later in a client or perhaps another Web API, I can ask for it by name and I'll get back the address and port that it's on, then call it.

var instance = await Cluster.FindServiceInstanceAsync("Heycool");


return String.Format("Look there's a service at {0}:{1}", instance.Address, instance.Port);

Here's an active debug session showing the address and port in the instance:

Using Microphone.WebAPI and Consul for Service Discovery

It will be interesting to see what will happen with Consul and systems like it if the Azure Service Fabric gains traction. Service Fabric offers a lot more, but I wonder if there is a use case for both, with Service Fabric managing lifecycles and Consul doing discovery.

This is all early days, but it's interesting. What do you think about these new discovery services for Web APIs?


Sponsor: Big thanks to Infragistics for sponsoring the feed this week. Quickly & effortlessly create advanced, stylish, & high performing UIs for ASP.NET MVC with Ignite UI. Leverage the full power of Infragistics’ JavaScript-based jQuery/HTML5 control suite today.



© 2015 Scott Hanselman. All rights reserved.
     

How to Add Google Analytics Event Tracking in WordPress

Do you want to track user activity while they are on your site? You can track pageviews, referral source, time spent on page, and much more by simply installing Google Analytics, but for more in-depth insights, you will need to use event tracking. In this… Read More »

The post How to Add Google Analytics Event Tracking in WordPress appeared first on WPBeginner.

Do you want to track user activity while they are on your site? You can track pageviews, referral source, time spent on page, and much more by simply installing Google Analytics, but for more in-depth insights, you will need to use event tracking. In this article, we will show you how to add Google Analytics event tracking in WordPress.

What is Event Tracking in Google Analytics

Event tracking allows you to measure user interactions on your website. These interactions can be things like clicking on a button, playing a video, downloading files, submitting forms, etc.

Let’s suppose you added a video to your product page, and now want to know how effective is it for your conversions. Event tracking allows you to track how many users played the video, so you can judge for yourself.

Another example is ajax based form submissions. If you are using Gravity Forms or any other contact form plugin, then form submission does not result into a new pageview.

Using event tracking you can see how users interacted with a form.

The same goes for file downloads included on a page. You can track how many users downloaded a file using event tracking and even which button on the page was clicked most.

Event tracking is different from tracking links in Google analytics. You can track links in WordPress using Google Analytics by simply adding UTM source to a link.

These measurable actions allow you to see how users behave on your site. You can then change your strategy to add content that generate more user engagement and interaction. Ultimately this means more sales and conversions on your website.

Getting Started

Before getting started, you will need to setup and install Google Analytics on your WordPress site. If you are not familiar with using Google Analytics, then you can try our beginner’s guide on how to use Google Analytics.

If you are already using Google Analytics, then you can jump right into event tracking.

Upgrade to Universal Analytics Code

There are currently two type of Google Analytics implemented on websites. Google is slowly pushing out the older code by asking webmasters to use newer ‘Universal Analytics Code’.

If your Google Analytics code looks like this:

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXX-1', 'auto');
  ga('send', 'pageview');

</script>

Then you are already using the newer Universal Analytics code. There is no action required, and you can move on to the next step.

If your code does not look like this, then you are probably using the older Google Analytics code. You will need to upgrade, Google has a detailed upgrade guide for that. Basically if you are not using advanced tracking features in Google Analytics, then you can just switch the old code with the new one from your account’s property settings.

Creating Your Event in Google Analytics

First you need to create your event in your Google Analytics account. Simply log into your Analytics dashboard and click on the Admin link at the top. If you have multiple websites under your analytics account, then make sure that you are viewing the dashboard for the site where you want to add the event.

Google Analytics dashboard

There are three columns under the admin page. Click on the ‘Goals’ link under the ‘View’ column.

Creating Goals in Google Analytics

Next, click on the new goal button to create a goal. From the Goal Setup options, you need to select the custom option and then click on the next button to continue.

Creating custom goal in Google Analytics

This will bring you to the Goal Description step. You need to provide a title for your custom goal, this is something that will help you identify the goal inside Google Analytics.

Under the goal type, you need to select Event. After that click on the next step button to continue.

Entering custom goal title and selecting event as the goal type

The last step is to provide goal details. You will need to enter the event conditions here.

Analytics will count a conversion when all these conditions match.

In this example, we have provided a category and action for the event. We entered a label for the event and provided a value. Depending on what kind of event you are trying to create, you can name your own category, actions, and labels.

If you feel that your event should pass on a value that can be calculated, then you can enter that value here. However, for most common event tracking using the value to be 0 works fine too.

Entering event conditions for custom goal in Google Analytics

Finally click on the create goal button to save and activate the goal. You have successfully enabled tracking for an event in Google Analytics. The next step is to track this event on your website and send data to Google Analytics.

Adding Google Analytics Event Tracking onClick

The easiest and perhaps the fastest way to add Google Analytics event tracking is by using the onclick method. This method simply sends event conditions to Google Analytics when user clicks on an element.

In this example, we are tracking users who click on eBook download link.

We will add the onClick parameter to the download link using this format.

onClick="ga('send', 'event', 'category', 'action', 'label', 'value');"

You will need to replace category, action, label, and value with your event’s conditions. Finally your download link would look like this.

<a onClick="ga('send', 'event', 'Downloads', 'Click', 'Ebook downloaded', '0');" href="http://example.com/wp-content/uploads/2015/06/free-ebook.pdf">Download Free Ebook</a>

That’s all, when users click on this link, it will send an event to Google Analytics which will appear in your site’s reporting.

Adding Event Tracking Using Google Tag Manager

Google Tag Manager is an online tool which allows you to add different tracking codes as tags under one dashboard.

You can also use it to create tags to track events in your Google Analytics account. The main benefit of using Google Tag Manager is that you wouldn’t have to manually insert code into your website, and you can manage all your tags from one location.

If you have already added Google analytics tracking code to your site manually, then you will need to remove it. Use our tutorial on how to install and setup Google Tag Manager in WordPress to add Analytics code to your website.

Once you have successfully added Google Analytics tag in the tag manager, the next step is to create a new trigger. For the sake of this tutorial, we will be tracking a contact form submission as an event.

Click on Triggers in tag manager and then click on the New button.

Triggers in Google Tag Manager

This will bring you to the trigger creation wizard. This is where you would choose event select form.

Choose form as your event

Under the configure trigger section, you need to uncheck wait for tags and check validation options. Next, click on the continue button to go to the next step.

Configure trigger options

In the next step, you need to choose when to fire the trigger. If your page has only one form on it, then you can choose all forms. If your page has more than one form, then you click on some forms button.

When to fire the trigger

If your page has more than one form and you want to track a specific form, then you need to tell Google Tag Manager which form you want to track. When you click on some form buttons you will see filters.

Creating a fire on filter

A filter is simply a set of instructions like if A matches B, then fire the trigger. You need to select new variable.

Selecting new variable will bring up a popup where you can create your own variable. Select DOM element as your variable type. Next, under configure variable choose ID as your selection method.

Now you will need to find your form’s ID. Visit the form page on your WordPress site, take the mouse over to the first form field and select inspect element.

Your browser screen will split into two. You will see the HTML for your page in the bottom screen. The id attribute will either be part of your <form> tag or the div containing the form.

Finding the form element ID

Copy and paste the form ID under the element ID and attribute. Next, click on the create variable button.

You will come back to Fire on filter where you can now select your custom variable. In the matching rule select ‘contains’ and then enter your form’s ID again.

Now click on the create trigger button to continue.

The next step is to create a tag for the event we want to track. In the Google Tag Manager, click on Tags and then click on the New button.

This will bring you to tag creation wizard. Select Google Analytics as your product and then click on the continue button.

Creating an event tracking tag in Google Tag Manager

Now you need to choose Universal Analytics as your tag type. You will be asked to provide your Google Analytics tracking ID. You can obtain this from your Google Analytics account.

Under the track type you need to select event and then provide category, action, label, and value information. In this example we used Forms for category, form submission for action, contact form as label, and submitted as the value.

Click on the continue button to proceed to next step. This is where you select when to fire the tag. Click on the more button and select the trigger you created earlier.

Select your trigger

Finally you can click on the create tag button to save your tag.

Remember that saving a tag does not make it go live on your website. You will still need to click on the publish button to make it live.

Publish your container

That’s all, you can now go to your website and submit the form. Go to Real Time » Events in your Analytics account and you will see your event tracked and recorded.

Event tracked in Google Analytics

Using the tag manager you can create different kind of events and manage them all from Google Tag Manager. It also saves you from editing your WordPress themes or adding tracking code manually.

We hope this article helped you add Google Analytics event tracking in your WordPress site. You may also want to check out our list 7 best analytics solutions for WordPress users.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Google Analytics Event Tracking in WordPress appeared first on WPBeginner.

How to Add Periscope On Air Button in WordPress

Are you using Periscope? Recently, one of our readers asked if there was an easy way to show the Periscope on air status in WordPress. In this article, we will show you how to add Periscope on air button in WordPress. What is Periscope? Periscope… Read More »

The post How to Add Periscope On Air Button in WordPress appeared first on WPBeginner.

Are you using Periscope? Recently, one of our readers asked if there was an easy way to show the Periscope on air status in WordPress. In this article, we will show you how to add Periscope on air button in WordPress.

What is Periscope?

Periscope is a new social platform that allows you to broadcast live videos straight from your phone for the world to see.

Show your Periscope on air status on your WordPress website

Think of Periscope as a video version of Twitter except you don’t have a 140 character limit.

That’s one of the many reasons why Twitter acquired Periscope and added the embed feature in their official WordPress plugin.

Adding Periscope on Air Button in WordPress

First thing you need to do is install and activate the Twitter plugin for WordPress.

Since Twitter acquired Periscope, this is the official Periscope WordPress plugin.

We will be using it to add Periscope on air button, but it also allows you to add Twitter cards, Tweet and Follow buttons to your WordPress site.

Upon activation, simply go to Appearance » Widgets page. You will find Periscope on air widget in the list of available widgets.

Now all you need to do is add the widget to a sidebar.

Periscope WordPress widget settings

You will be asked to provide a title for the widget, and enter your Periscope username. Next you will need to choose a button size and click save changes button to store your widget settings.

You can now visit your website to see the Periscope on air button in action. The button will change color when you go live on Periscope.

Periscope on air widget preview

Adding Periscope On Air Button in WordPress Posts or Pages

This plugin also allows you to easily display a Periscope On Air button in any WordPress post or page. Simply enter the complete Periscope profile URL and the plugin will change it into button.

https://www.periscope.tv/syedbalkhi

If you want to change the button size, then you can also use the shortcode like this:

[periscope_on_air username=”syedbalkhi” size=”large”]

Replace the username with your own username and choose a button size (large or small). Preview your post or page to see it in action.

Periscope is a relatively new platform, so hopefully there will be more features coming soon in this plugin.

We hope this article helped you add a Periscope On Air button to your WordPress site. You may also want to see our list of 10 most wanted Twitter hacks and plugins for WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Periscope On Air Button in WordPress appeared first on WPBeginner.

How to Add Inline Related Posts in WordPress Blog Posts

Inline related posts are becoming really popular thanks to larger news sites. An inline related post is basically a link to a relevant article in the middle of a blog post which is proving to increase pageviews. In this article, we will show you how… Read More »

The post How to Add Inline Related Posts in WordPress Blog Posts appeared first on WPBeginner.

Inline related posts are becoming really popular thanks to larger news sites. An inline related post is basically a link to a relevant article in the middle of a blog post which is proving to increase pageviews. In this article, we will show you how to add inline related posts in WordPress blog posts.

Add inline related posts in WordPress to increase pageviews

Why and When You Need Inline Related Posts?

In most cases, you simply interlink your blog posts naturally when writing. For all the other times, bloggers usually rely on related posts plugins that shows related content at the end of the post.

Showing related posts allows your readers to see more great content on your site that’s relevant to them.

Now since the traditional related posts plugins add related posts at the end of the article, what if the user never gets that far?

This is where inline realted post links come in handy. You can style them to stand out without distracting the user from reading the current article.

See how Mashable is doing it in the screenshot below:

Inline related links displayed on Mashable

Pretty cool right? Aside from improving pageviews, it also helps your SEO because this is basically interlinking your content. See our guide on how to optimize blog posts for SEO.

Let’s take a look at how to add inline related posts in WordPress.

How To Add Inline Related Posts in WordPress?

First thing you need to do is install and activate the Inline Related Posts plugin. Upon activation, you need to visit Settings » Inline Related Posts page to configure the plugin settings.

You will need to click on the Active option to be able to view the plugin settings.

Inline related posts settings page

You can change the appearance of how the related posts will appear in your posts.

There are two free themes that you can use, and you can also customize them by changing the colors.

Below the appearance options, you will find an option to add inline related posts into existing posts. You can select how many links you want to add in each post. You can also enter the amount of words that should be used as gap between two related post links.

Inline related posts configuration

Don’t forget to click on the save button to store your settings.

Now in some cases, you may not want an individual post to display inline related posts. In that case, it’s very easy to disable these inline related posts for specific posts.

Simply click to edit the post and scroll down a bit. You will notice the related post metabox with the option to disable it in the right hand column.

Disable related posts feature on a particular post

We hope this article helped you add inline related posts in WordPress blog posts. You may also want to check out these 21 plugins to efficiently manage a WordPress multi-author blog.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Inline Related Posts in WordPress Blog Posts appeared first on WPBeginner.

It’s happening – OpenSSH for Windows…from Microsoft

OpenSSH for Windows

Back in June the folks over at the Microsoft PowerShell blog indicated they were going to support SSH in Windows soon. I read the post a few times and I must admit I read deeply between the lines and enjoyed the post very much. For example, this passage, with emphasis mine.

Finally, I’d like to share some background on today’s announcement, because this is the 3rd time the PowerShell team has attempted to support SSH.  The first attempts were during PowerShell V1 and V2 and were rejected.  Given our changes in leadership and culture, we decided to give it another try and this time, because we are able to show the clear and compelling customer value, the company is very supportive.  So I want to take a minute and thank all of you in the community who have been clearly and articulately making the case for why and how we should support SSH! 

Fast forward a few months and they’ve just released a VERY early version. It’s not quite useful enough for a daily driver but it’s heartening that it’s happening. Sure, it’s late, and ya, it should have happened years ago, but it’s happening and it’ll be built in. SSH will be one less thing to worry about.

Note as they said:

With this initial milestone complete, we are now making the code publicly available and open for public contributions. Please note that this code is still very early and should be treated as a developer preview and is not supported for use in production.

The repository is over at https://github.com/PowerShell/Win32-OpenSSH and the first release is here https://github.com/PowerShell/Win32-OpenSSH/releases. I just unblocked the zip and unzipped it into my c:utils folder so it was in my path.

I SSH’ed into an Ubuntu machine I have running in Azure like this:

>ssh [email protected] -p 12345

I did have an issue immediately with an error and some formatting, which I filed and also discussed here. I was able to mostly work around with it “export TERM=xterm” but I’m sure they’ll fix it, as again, it’s super early.

As an alternative SSH client, try the Bitvise SSH Client. It has a command line app called “stermc” that acts like SSH. I made an ssh.bat file that contains just “stermc %1” and this let’s me shush around nicely.


Sponsor: Many thanks to Atalasoft for sponsoring the feed this week. If your project requires image viewing, format freedom, scanning, or other document-centric workflows, Atalasoft’s document imaging experts can help. Evaluate their developer tools for 30 days with remarkable human support.


© 2015 Scott Hanselman. All rights reserved.
     
OpenSSH for Windows

Back in June the folks over at the Microsoft PowerShell blog indicated they were going to support SSH in Windows soon. I read the post a few times and I must admit I read deeply between the lines and enjoyed the post very much. For example, this passage, with emphasis mine.

Finally, I'd like to share some background on today’s announcement, because this is the 3rd time the PowerShell team has attempted to support SSH.  The first attempts were during PowerShell V1 and V2 and were rejected.  Given our changes in leadership and culture, we decided to give it another try and this time, because we are able to show the clear and compelling customer value, the company is very supportive.  So I want to take a minute and thank all of you in the community who have been clearly and articulately making the case for why and how we should support SSH! 

Fast forward a few months and they've just released a VERY early version. It's not quite useful enough for a daily driver but it's heartening that it's happening. Sure, it's late, and ya, it should have happened years ago, but it's happening and it'll be built in. SSH will be one less thing to worry about.

Note as they said:

With this initial milestone complete, we are now making the code publicly available and open for public contributions. Please note that this code is still very early and should be treated as a developer preview and is not supported for use in production.

The repository is over at https://github.com/PowerShell/Win32-OpenSSH and the first release is here https://github.com/PowerShell/Win32-OpenSSH/releases. I just unblocked the zip and unzipped it into my c:utils folder so it was in my path.

I SSH'ed into an Ubuntu machine I have running in Azure like this:

>ssh [email protected] -p 12345

I did have an issue immediately with an error and some formatting, which I filed and also discussed here. I was able to mostly work around with it "export TERM=xterm" but I'm sure they'll fix it, as again, it's super early.

As an alternative SSH client, try the Bitvise SSH Client. It has a command line app called "stermc" that acts like SSH. I made an ssh.bat file that contains just "stermc %1" and this let's me shush around nicely.


Sponsor: Many thanks to Atalasoft for sponsoring the feed this week. If your project requires image viewing, format freedom, scanning, or other document-centric workflows, Atalasoft’s document imaging experts can help. Evaluate their developer tools for 30 days with remarkable human support.


© 2015 Scott Hanselman. All rights reserved.
     

How to Nofollow All External Links in WordPress

Do you want to nofollow external links on your WordPress site? While you can easily add nofollow tag to individual links, what if you wanted to nofollow all external links? In this article, we will show you how to nofollow all external links in WordPress.… Read More »

The post How to Nofollow All External Links in WordPress appeared first on WPBeginner.

Do you want to nofollow external links on your WordPress site? While you can easily add nofollow tag to individual links, what if you wanted to nofollow all external links? In this article, we will show you how to nofollow all external links in WordPress.

Why and When You Need to Nofollow All External Links

Automatically nofollow WordPress links

Search engines consider links as a ranking signal for the linked URL and domain. When you link to an external site, you are passing your link juice to that site.

Link juice is kind of your SEO score card. If you are linking to more sites than the sites linking back to you, then you will start losing authority.

This is why many SEO experts recommend using nofollow attribute.

Example of a link with nofollow attribute:

<a href="http://example.com" rel="nofollow">Example Website</a>

By default, WordPress does not allow you to automatically add nofollow to external links. You will have to manually add this to outgoing links to external sites.

An easier way is to use Title and NoFollow For Links plugin. It adds a title field and a nofollow checkbox in the insert link popup. You can make links nofollow as you add them.

Title and NoFollow Fields in the Insert Link popup

But if you run a multi-author site, then it increases the chances that your authors may forget to check the box for some external links. In this case, you need a solution that does not require any user input.

Having said that, let’s see how you can add nofollow to all external links in WordPress without requiring any user input.

Adding NoFollow to All External Links in WordPress

First thing you need to do is install and activate the External Links plugin. Upon activation, you need to visit Settings » External Links page to configure the plugin settings.

External links settings

The first option in the plugin settings applies nofollow globally. You can keep it unchecked if only you have access to your theme files.

Scroll down a little and enable ‘Add Nofollow’ by clicking the checkbox next to it. This option will add nofollow to all external links in WordPress posts and pages.

There are a number of options on the settings page which you can enable.

You can add nofollow to links in WordPress text widgets. You can also allow the plugin to treat subdomains as local sites and exclude them from nofollow rules.

External Links plugin also allows you to open external link in new window and you can even show an icon next to external links.

Advanced options for external links in WordPress

If you have some other websites that you want to exclude from nofollow rules, then you can add them under ‘Domains to exclude’ section.

Do not add http or www and use commas to separate domains. Click on the save changes button to store your settings.

Important: Please note that the plugin adds these attributes on the fly. Deactivating the plugin will remove nofollow from all links.

That’s all, we hope this article helped you NoFollow all external links in WordPress. You may also want to see our guide on how to cloak affiliate links on your WordPress site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Nofollow All External Links in WordPress appeared first on WPBeginner.