Code Snippets

Open External Links in New Tab

by Leave a Comment

In part, we write blog posts because we want our readers to benefit from our words. When writing these posts it is not uncommon to point to an external source via hyperlink. At this point you have to ask yourself a very important question. What do you want that hyperlink to do? Do you want it to take away the reader completely away from your site? Or would you rather have that hyperlink open in a new window or tab? Most likely, you will prefer the latter.

The WordPress Way

You can optionally choose to have any hyperlink open in a new tab simply by choosing the option when using the WordPress Visual Editor.

Getting Help with JavaScript

The WordPress Way works great. But with the help of JavaScript you can just set it and forget it. This avoids the possibility of forgetting to toggle the “Open in New Tab” option when creating a hyperlink in your post.

How to Set it Up

First you need to enqueue the JavaScript file that will do all of the heavy lifting within your functions.php file.

<?php
/**
* Open External Links in New Tab
*
* @author Edwin Velez (https://edwinvelez.net)
* @link https://edwinvelez.net/open-external-links-in-new-tab/
*/
function ev_load_my_scripts() {
wp_enqueue_script( 'external_links', get_stylesheet_directory_uri() . '/external_links.js', array( 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'ev_load_my_scripts' );
view raw functions.php hosted with ❤ by GitHub

Now, in your JavaScript file enqueued above, copy and paste the below. When a user clicks on a hyperlink in your blog post, JavaScript will check if the user is redirected away from your site via that link. If so, a new browser tab will help open giving the user the opportunity to remain on your site.

view raw external_links.js hosted with ❤ by GitHub

Set Reading Settings on Theme Activation

by Leave a Comment

Previously I shared a post on how to Set Reading Settings Programmatically. The code below takes it a step further by first creating the required pages, if they do not exist, needed for their respective settings. Thanks to the after_setup_theme() function, the process will run on activation of the theme.

<?php
/**
* Set Reading Settings on Theme Activation
*
* @author Edwin Velez (https://edwinvelez.net)
* @link https://edwinvelez.net/set-reading-settings-on-theme-activation/
*/
function ev_set_reading_settings() {
$author_id = 1;
$page_title_home = 'Home';
$page_title_blog = 'Blog';
// Does the Home page exist?
if ( null == get_page_by_title( $page_title_home, 'page' ) ) {
// Home page does not exist so it must be created.
wp_insert_post(
array(
'post_author' => $author_id,
'post_title' => $page_title_home,
'post_status' => 'publish',
'post_type' => 'page',
)
);
}
// Does the Blog page exist?
if ( null == get_page_by_title( $page_title_blog, 'page' ) ) {
// Blog page does not exist so it must be created.
wp_insert_post(
array(
'post_author' => $author_id,
'post_title' => $page_title_blog,
'post_status' => 'publish',
'post_type' => 'page',
)
);
}
// Set static front page.
update_option( 'page_on_front', get_page_by_title( $page_title_home )->ID );
update_option( 'show_on_front', 'page' );
// Set blog page.
update_option( 'page_for_posts', get_page_by_title( $page_title_blog )->ID );
}
add_action( 'after_switch_theme', 'ev_set_reading_settings' );
view raw functions.php hosted with ❤ by GitHub

Set Reading Settings Programmatically

by Leave a Comment

Home Page and Post Page settings can be changed manually in the Reading Settings page of the WP Admin Dashboard. With the code snippet below, you can set reading settings programmatically.

The two variables, $home_page and $blog_page, should match the title of a Page you create in the WP Dashboard.

<?php
/**
* Set Reading Settings Programmatically
*
* @author Edwin Velez (https://edwinvelez.net)
* @link https://edwinvelez.net/set-reading-settings-programmatically/
*/
// Set static front page.
$home_page = get_page_by_title('Home');
update_option('page_on_front', $home_page->ID);
update_option('show_on_front', 'page');
// Set blog page.
$blog_page = get_page_by_title('Blog');
update_option('page_for_posts', $blog_page->ID);
view raw functions.php hosted with ❤ by GitHub

Compare Two Domain Name Values

by Leave a Comment

The code snippet below compares two domain names. One domain name could point to development environment. The other domain name could be a live site on the Internet where visitors go to see the results of your hard work.

All you need to do is set the variable $live_site_url equal to the value of where your live site is found on the Internet. For example, the variable is set to edwinvelez.net which is points the website you are looking at now which is my live site. My development site lives elsewhere which is not on the Internet for you to find.

With the ability to compare locations based upon the domain name values, I can choose to selectively run code without making changes manually.

<?php
/**
* Compare Two Domain Name Values
*
* @author Edwin Velez (https://edwinvelez.net)
* @link https://edwinvelez.net/compare-two-domain-name-values/
*/
// The domain name or host you want to compare. Can also be a host i.e. http://localhost
$live_site_url = 'https://edwinvelez.net';
$head_pattern = '/(https?:\/\/(w{3}\.)?)?(^w{3}\.)?';
$tail_pattern = '(\:[0-9]+).*|\b\/.*|\b\?.*';
$head_vs_tail_boolean = '|';
$regex_flags = '/m';
$regex_pattern = $head_pattern . $head_vs_tail_boolean . $tail_pattern . $regex_flags;
// Strip everything before and after actual domain name and hostname.
$live_site_url = preg_replace( $regex_pattern, '', strtolower( $live_site_url ) );
$site_url = preg_replace( $regex_pattern, '', strtolower( get_site_url() ) );
$is_live_site = strcmp( $site_url, $live_site_url ) === 0;
// Is the web browser pointing to the live site?
if ( $is_live_site ) {
// Insert code here to run if this is your live site.
} else {
// Insert code here to run if this is not your live site.
}
view raw functions.php hosted with ❤ by GitHub